2011-06-28 16 views
3

私たちはIE7/8でいくつかの本当に変わったjQuery/CSSの動作を追いかけました。jquery css(white-space)IE7/8バグ?

私たちはいくつかのアニメーションと高さ測定を行います。アニメーション化している間、テキストを折り返すことは望ましくありません。

$(selector).css("white-space", "nowrap"); 
... animate ... 
$(selector).css("white-space", "inherit"); 

これはFF、クローム、サファリ、iPadの、でもIE9上GREAT動作しますが、IE7や8我々はJavascriptのエラーを取得:

"Could not get the whiteSpace property. Invalid argument" 
の腸内ディープ

だから我々はこれをしませんでしたjQuery。いくつかの頭のスクラッチの後、我々はこれをやってしまった:

まず、.cssの中でクラスを定義します。

/* Kludge to avoid IE7/8-jQuery css('white-space') problem? */ 
.nowrap { white-space: nowrap; } 

そして、上記のアニメーションコード変更:

$(selector).addClass("nowrap"); 
... animate ... 
$(selector).removeClass("nowrap"); 

は今、誰もが幸せなのですが、 kludgeは本当に私を悩ます。 jQueryはIEのための何らかの種類のCSS変換を行いますか?私たちはjQuery 1.4.2を使っています。ここ

答えて

3

テスト:http://jsfiddle.net/nL48C//http://fiddle.jshell.net/nL48C/show/light/
エラーが[IE7]互換モードでIE7とIE8でもあります。 IE8標準モードでは正常に動作します。 inheritラインアウト

コメント:http://jsfiddle.net/nL48C/1//http://fiddle.jshell.net/nL48C/1/show/light/
エラーがなくなっています。

私はIE7がほぼ完全にdoesn't support inheritであることを知っていますので、それが問題の原因です。

あなたはjQueryの1.4.4でinheritを試す場合は、エラーがない:
http://jsfiddle.net/nL48C/2//http://fiddle.jshell.net/nL48C/2/show/light/

のjQuery 1.4.2は1.4.4でこの問題を回避するために持っているいくつかの魔法を欠いように見えます。

のjQuery 1.4.2

if (set) { 
    style[ name ] = value; 
} 

のjQuery 1.4.4

// Wrapped to prevent IE from throwing errors when 'invalid' values are provided 
// Fixes bug #5509 
try { 
    style[ name ] = value; 
} catch(e) {} 

ソリューション:

  • initial valueある、normalに設定し、inheritにそれを設定しないでください。