如何阻止重寫內聯樣式的jQuery動畫？

Question

我的問題有點複雜。

我有一個導航菜單，下拉菜單依賴於slideDown()動畫功能。由於我的樣式，我的下拉列表必須有margin-top，但是我必須在基於用戶的字體，縮放等設置的窗口加載後使用jQuery設置margin-top。爲此，我使用attr("style","margin-top: -22px !important")。這使得我的下拉菜單完全按照它的原樣工作。但是，當我使用slideDown()時，jQuery刪除了我的!important，這對於下拉動畫非常重要。如果我不使用!important，則slideDown()將爲margin-top和height設置動畫，這看起來不太好。

我的問題是：有什麼辦法阻止jQuery覆蓋我的內聯樣式？

實施例：http://jsfiddle.net/Sy9dC/3/

Answer 1

使用CSS（{}）改變元件的CSS propertie值：

$(".navigation-secondary-submenu").css('margin-top'," -10px"); 

或可以使用：

$(".navigation-secondary-submenu").removeClass('old_class').addClass('new_class') 

其中new_class有你的CSS屬性。

.new_class{ 
    ****** 
    margin-top: -10px !important; 
} 

或該CSS屬性將被添加動態：

$(docyment).ready(function(){ 
     $(".navigation-secondary-submenu").attr('style','margin-top:-22px !important'); 

    $("button").click(function() { 
     $(".navigation-secondary-submenu").attr('style','margin-top:-10px !important'); 
     }); 
});