자바 스크립트와 CSS 구배를 추가 - IE7

난 단지 .link.box.gradient에 그라디언트를 추가하려고에 버그가 있지만 IE7에서이 .link.box.gradient에 추가하고 .style.box.gradient자바 스크립트와 CSS 구배를 추가 - IE7

<!DOCTYPE html> 
<html lang="sv"> 
    <head> 
    <title></title> 
     <script src="http://ajax.microsoft.com/ajax/jQuery/jquery-1.4.4.min.js"></script> 
     <script> 
      jQuery(function ($) { 
       $('head').append("<style>.link.box{height:100px;width:100px;}.link.box.gradient{filter:progid:DXImageTransform.Microsoft.gradient(startColorStr='#000000',EndColorStr='#ffffff');}</style>"); 
      }); 
     </script> 
    </head> 
    <body> 
     <div class="style box gradient">Gradient (style-tag)</div> 
     <div class="link box gradient">Gradient (link-tag)</div> 
    </body> 
</html>

당신은 여기에서도 볼 수 있습니다 http://jsfiddle.net/Zhvpy/ 하나 이상한 것은 때입니다 당신이 여기에서 볼 수있는 것처럼 나는 자바 스크립트에서 .link.box {높이 : 100px; 너비 : 100px;} 밖으로 이동 http://jsfiddle.net/Zhvpy/1 그것은 작동하는 것,하지만 밖으로 이동하고 싶지 않아.

왜 이런 식입니까? 이 버그를 어떻게 해결할 수 있습니까?

출처

2010-12-20 Codler

나는 IE7 그런 여러 클래스에 선택기를 지원합니다 생각하지 않는 것과 서로 다른 결과 . – Pointy

IE7 이상에서는 여러 클래스 선택기를 지원합니다. 따라서 CSS는 그가 자바 스크립트에서 .link.box 선언을 제거 할 때 작동합니다. – lnrbob

아래의 제 제안을 시도하십시오. - IE7은 여러 클래스 선택기를 지원합니다 : http://www.maxdesign.com.au/articles/multiple-classes/ – lnrbob

제거 원래 오답

EDIT 1

홀수는 - 그것은 IE의 방법으로 이전 버전의 특정 요소를 처리 할 수 있습니다 결정 (같은 <script />는) 너무 a non-jQuery solution를했습니다. 작동하는 것으로 보입니다.

편집 2

추가 된이 전체 스크립트 - 출력을 더 줄 IE8 출력은

function appendStyle(element, cssObj) { 
    //$('#a').append($('<span/>').text(cssObjToText(cssObj))); 
    if ($.browser.version == 7) { 
     var head = document.getElementsByTagName('head')[0], 
      style = document.createElement('style'), 
      rules = document.createTextNode(cssObjToText(cssObj)); 

     style.type = 'text/css'; 

     head.appendChild(style); 

     style.styleSheet.cssText = rules.nodeValue; 
    } 
    else { 
     element.after('<style class="css-finalized">' + cssObjToText(cssObj) + '</style>'); 
    } 
}

출처

2010-12-20 18:33:12 lnrbob

여전히 작동하지 않습니다. – Codler

@Codler - 작업 옵션을 사용하여 답변을 편집했습니다 – lnrbob

말할 수는 있지만 IE7의 두 태그 모두에 그래디언트가 표시됩니다. = ( – Codler

자바 스크립트와 CSS 구배를 추가 - IE7

답변

관련 문제