IE6上的removeAttr/addClass問題

Question

此問題被問到here，但問題未解決。

請參閱本IE6的jsfiddle：http://jsfiddle.net/RnsxM/2/

基本上是一個精靈圖像（不是PNG固定）將不會在IE6中正確更新。該類似乎被應用（和工作沒有JavaScript），但combinaison removeAttr + addClass似乎打破。

我想：

• !important CSS語句
• 使用background-position-x或background-position-y

是否有人知道一個解決方法嗎？

Answer 1

與腳本無關，這是一個簡單的CSS破碎。在IE6的選擇器引擎中的某些東西無法應對在單個樣式表上存在兩個#id.class規則並且具有相同#id的想法。這較短的示例演示：

<style type="text/css"> 
    #sprite.pos1 { background: red; } 
    #sprite.pos2 { background: yellow; } 
</style> 
<div id="sprite" class="pos2">Hello</div> <!-- White in IE6! --> 

您可以通過將不同元素的ID和類，或者只是打破樣式表成兩個避免：

<style type="text/css"> 
    #sprite.pos1 { background: red; } 
</style> 
<style type="text/css"> 
    #sprite.pos2 { background: yellow; } 
</style> 
<div id="sprite" class="pos2">Hello</div> 

Answer 2

@bobince是正確的。我做一個jsfiddle和IEtester運行它，我看到IE6不接受的選擇：

#sprite.pos1 

但接受：

.pos1 

我覺得基本上是，我建議你，使一個替代IE6選擇器，如下所示：

#sprite.pos1 { background-position: -120px 0; } 
.pos1 { _background-position: -120px 0; } 
#sprite.pos2 { background-position: -240px 0; } 
.pos2 { _background-position: -240px 0; }