jQuery動畫CSS，設置後退懸停狀態

Question

我有一個更新按鈕，在更新我的內容時，我想在其中引起注意。我正在做這個動畫顏色淡入淡出，並添加一些箭頭字符。

當動畫完成後，我想我的CSS：懸停狀態返回。
這是可能的還是我失去了原有的CSS和我必須與重置這些jQuery的hover()

小提琴：http://jsfiddle.net/K6fd2/

CSS

a.btn { padding: 5px 20px; color: white; background-color: #4188FB; } 
a.btn:hover { background: #FFCC00;} 

HTML

<a href="#" class="btn">Update</a> 
<br /><br /> 
<a href="#" class="change">change content</a> 

JS

var oriBtnTxt = $(".btn").html(); // store original text 

$(".change").click(function() { 
    $(".btn") 
    .css("background-color","#FFCC00") 
    .html(oriBtnTxt + " »") 
    .animate({backgroundColor: "#4188FB"}, 2000, "swing", function() { 
     // set back hover state 
     $("a.btn:hover").css("background-color", "#FFCC00"); 
    }); 
}) 

Answer 1

這可能不是最完美的解決方案，但你可以嘗試以下方法：

$(this).removeAttr('style'); 

您$.animate()回調函數中。

編輯：我懷疑你正在失去:hover樣式，因爲$.animate()使用內嵌樣式，它是在樣式表規則被評估後設置的;因此它們優先於樣式表中定義的樣式。