：懸停屬性重寫jQuery效果後，如何讓它恢復？

Question

我有一個動畫功能...

 
    function flashGreen(e) { 
       backg = e.css('backgroundColor'); 
       e.animate({ backgroundColor: "#5ccc96" }, 1000); 
       e.animate({ backgroundColor: backg }, 500); 
      } 

，象這樣

 
.container { 
    padding:5px; 
    background:#eaeaea; 
} 
.containerr:hover { 
    border:1px #558ecb solid; 
    background:#7dcdf2; 
    padding:4px; 
}

懸停工作根據需要之前我所說的flashGreen功能，但一個css後之後，我打電話功能，背景顏色不再改變，但邊框仍然出現。

這是怎麼回事？我注意到jQuery在animate函數後面爲backgroundColor添加了一個「style」屬性。所以我認爲「風格」是壓倒類的屬性。

在backgroundColor上調用動畫後，如何讓背景顏色懸停工作。

Answer 1

正如您已經注意到的，jQuery爲您的元素添加了style屬性。動畫完成後，您可以簡單地將其刪除

e.animate({ backgroundColor: backg }, 500, function() { 
    e.removeAttr("style"); 
}); 

Answer 2

這是優先級/優先級問題。由於動畫給你的元素style="background-color"，這是優先於你的CSS文件。發生這種情況是因爲內聯樣式優先於任何非內聯樣式（至少在正常情況下）。

當我發佈解釋時，peirix發佈瞭解決方案。