2011-06-25 15 views
2

これは私のページ全体のコードです。 divはFirefoxで(予想通り)回転しますが、IE9では回転しません。通常のCSSを使用して-ms-transformプロパティを設定すると、divが回転するため、問題はjQueryを使用してプロパティを設定しようとしたことに起因しているようです。誰が何が起こっているのか分かっていますか?-ms-transformをjQueryで設定できないのはなぜですか?

<!DOCTYPE html> 
<html> 
<head> 
<script type="text/javascript" charset="utf-8" src="/jquery-latest.pack.js"></script> 
<script>  
    $(function(){ 
     $("#divid").css("-ms-transform", "rotate(-90deg)"); // For IE9 
     $("#divid").css("-moz-transform", "rotate(-90deg)"); // For Firefox 
    }); 
</script> 
</head> 
<body> 
    <div id="divid">Foo</div> 
</body> 
</html> 
+0

は、<!DOCTYPE HTML>壊れていない、あなたのDOCTYPEです??それがページの開始点であるかどうかを確認できますか? – kobe

+0

doctypeの前にスペースを入れない – zjmiller

答えて

4

このためにCSSクラスを使用する方が簡単かもしれません:

.rotated { 
    -ms-transform: rotate(-90deg); 
    -moz-transform: rotate(-90deg); 
} 

------ 

jQuery(function ($) { 
    $('#divid').addClass('rotated'); 
}); 
+0

Webkitブラウザ(Chrome、Safari)との互換性のために、 "-webkit-transform"を追加することができます。 – Bakudan

+0

@Bakudan、もちろん、ターゲットブラウザに必要なスタイルをCSSに追加できます。 – nickf

0

これは、関連するかもしれない。それを報告http://bugs.jquery.com/ticket/8346

1はを使用して周りました:

jQuery.cssHooks["MsTransform"] = { 
    set: function(elem, value) { 
     elem.style.msTransform = value; 
    } 
}; 

$("#divid").css("MsTransform", "rotate(-90deg)"); 
関連する問題