jQuery：動畫部分調整'點擊'

我有一個div用於顯示用戶的狀態。其寬度相對於百分比（0-100）。點擊一個按鈕後，我想動畫該div的寬度（以像素爲單位）。任何關於這方面的最佳途徑的意見？我已經在使用jQuery，我認爲它會使用它來動畫？（我的面板最初是隱藏的，因此.live功能）。jQuery：動畫部分調整'點擊'

$('#slider50').live("click", function() { 

    // Animate here 

    });

來源

2011-09-04 Zakman411

查看jQuery UI（http://jqueryui.com/）和'.animate（）'函數http://api.jquery.com/animate/。它會做你想做的。 – PeeHaa

@PeeHaa我不會建議整個用戶界面庫爲單個元素設置動畫，以及'.animate（）'在股票jQuery中可用。 – Bojangles

@JamWaffles：'.animate（）'有庫存？這是從1.6開始的嗎？ – PeeHaa

正如PeeHaa說，你可以使用.animate（）的jQuery

http://jsfiddle.net/DKjKP/1/

：如下圖所示的例子功能擴展你div的寬度

$("#button").click(function() { 
    $("#slider").animate({ 
     width: '+=30px' 
    }, 1000); 
});

來源

2011-09-04 02:03:54 Bassem

您可以使用jQuery特效[jQuery Effects文檔]（http://api.jquery.com/category/effects/）來緩解特效，此外，此庫還將$ .addClass（）/ $。removeClass（）函數擴展爲允許在可用於更改寬度的樣式更改之間進行轉換。 – Bassem

有沒有辦法設置絕對寬度？ Like'width：400px' – Zakman411

當然，只需將「+ = 30px」替換爲「400px」，這意味着它將從原始設置爲400px的值創建動畫。 '+ ='將永遠增加你的X px或百分比。 – Bassem

一個簡單的解決方案，我想會的工作將一些與此類似：

$("#slider50").live("click", function() { 
    $(this).slideDown(); 

    /* or something like this 
    $(this).animate({ 
     'width' : '500px', 
     'height': '500px' 
    }); 
    */ 
});

希望這有助於

來源

2011-09-04 02:00:06 GoGoGarrett

jQuery：動畫部分調整'點擊'

回答

相關問題