如何在應用jquery樣式之後獲取樣式表樣式？

我想從jquery應用樣式之後獲得樣式表文檔中定義的默認樣式。經過大量的嘗試，我發現這個解決方案是我們可以刪除jQuery中應用的樣式，並通過.attr('style', ' ')方法獲得樣式表中應用的默認樣式，但現在我被困住了，我該如何動畫呢？對我來說幾乎是不可能的。那麼，有沒有辦法通過jquery解決方案來做到這一點？如何在應用jquery樣式之後獲取樣式表樣式？

demo

$('#one').on('click',function(){ 
    $('#test').animate({ 
     'top':'0%', 
     'left': '0%', 
     'width': '100%', 
     'height': '20%' 
    },5000); 
}); 
$('#two').on('click',function(){ 
    $('#test').attr('style',' '); // I want to animate as previous but without 
});       // placing the values defined in stylesheet manually 
       // but get the default style of stylesheet while animating.

來源

2014-01-20 Bhojendra Nepal

你想塊動畫回到這是在CSS定義的_original_形狀？ –

@SalmanA是的，沒錯。 –

試試這個，節省了previus值到變量時，頂部是0：

var top, left, width, height = ''; 
$('#one').on('click',function(){ 
    if($('#test').css('top') != 0){ 
     top = $('#test').css('top'); 
     left = $('#test').css('left'); 
     width = $('#test').css('width');  
     height = $('#test').css('height'); 
    } 
    $('#test').animate({ 
     'top':'0%', 
     'left': '0%', 
     'width': '100%', 
     'height': '20%' 
    },5000); 
}); 
$('#two').on('click',function(){ 
    $('#test').animate({ 
     'top': top, 
     'left': left, 
     'width': width, 
     'height': height 
    },5000); 
});

來源

2014-01-20 08:53:37

您可以使用.switchClass()。你想要的風格創建2個班，並使用switchClass

$('#one').on('click',function(){ 
    $('#test').switchClass("class1","class2",5000); 
}); 
$('#two').on('click',function(){ 
    $('#test').switchClass("class2","class1",5000); 
});

注：您需要的jQuery UI

DEMO

來源

2014-01-20 08:54:24 Anton

+1使用類;比硬編碼值更好。 –

如何在應用jquery樣式之後獲取樣式表樣式？

回答

相關問題