jQuery的addClass（）removeClass（）

我有jQuery方法.addClass（）.removeClassjQuery的addClass（）removeClass（）

的jsfiddle一個問題的方法：http://jsfiddle.net/HEM7Q/4/

$(document).ready(function() { 
    $(".button").click(function(e) { 
    $(".position1").animate({left:"400px"},2000, function(e){ 
    $(".position1").addClass("position2").removeClass("position1"); 
    }) 
    }); 
});

看到，最初，css.left是20像素（因爲它在類.position1中定義）。現在，我動畫div直到它的左邊變成400px。動畫完成後，我添加類位置2（其中左是50px）和我removeClass position1。

所以不應該在動畫完成之後div回到左邊== 50 px？爲什麼沒有發生，它的正確的代碼是什麼？

來源

2013-03-04 user1974333

我會說animate方法正在修改內聯樣式以獲得所需的效果，即使動畫完成時仍然存在（除非您主動恢復），並且這優先於您定義的樣式類。

來源

2013-03-04 13:34:54

是啊，我知道了！非常感謝 – user1974333 2013-03-04 13:43:13

由於內聯樣式具有比外部樣式更高的優先級。您可能需要將.position2中的left屬性更改爲left: 10px !imporant以強制使用屬性值。

http://jsfiddle.net/HEM7Q/6/

來源

2013-03-04 13:35:51 deadlock

那麼幫助。非常感謝，夥計！ – user1974333 2013-03-04 13:42:35

您需要從風格刪除內嵌left，如內嵌樣式優先於CSS類：

$(".position1").animate({left:"400px"},2000, function(e){ 
    $(".position1").css("left",""); //Removing 'left' which was added by animation 

    $(".position1").addClass("position2").removeClass("position1"); 
})

DEMO

來源

2013-03-04 13:38:27 Engineer

jQuery的addClass（）removeClass（）

回答

相關問題