本文最初發表於，並在github上持續更新前端的系列文章。歡迎在github上關注我，一起入門和高階前端。
以下是正文。jquery提供的一組網頁中常見的動畫效果，這些動畫是標準的、有規律的效果；同時還提供給我們了自定義動畫的功能。
方式一：
$("div").show();display: block;實現的。
方式二：
$("div").show(2000);效果如下：
方式三：
$("div").show("slow");解釋：和方式二類似，也是通過控制元素的寬高、透明度、display屬性，逐漸顯示。
方式四：
//show(毫秒值，**函式;
$("div").show(5000,function () );
總結：
上面的四種方式幾乎一致：引數可以有兩個，第乙個是動畫的執行時長，第二個是動畫結束後執行的**函式。
方式參照上面的show()方法的方式。如下：
$(selector).hide();
$(selector).hide(1000);
$(selector).hide("slow");
$(selector).hide(1000, function(){});
同樣是四種方式：
$(selector).toggle();$(selector).slidedown(speed, **函式);注意：省略引數或者傳入不合法的字串，那麼則使用預設值：400毫秒（同樣適用於fadein/slidedown/slideup）
2 滑出動畫效果：
$(selector).slideup(speed, **函式);3、滑入滑出切換動畫效果：
$(selector).slidetoggle(speed, **函式);舉例：
滑入滑出
切換
1、淡入動畫效果：
$(selector).fadein(speed, callback);2、淡出動畫效果：
$(selector).fadeout(1000);3、淡入淡出切換動畫效果：
$(selector).fadetoggle('fast', callback);引數的含義同show()方法。
**舉例：
淡入淡出
切換改透明度為0.5
$(selector).animate(, speed, callback);**舉例：
自定義動畫
$(selector).stop(true, false);第二個引數：
ps：引數如果都不寫，預設兩個都是false。實際工作中，直接寫stop()用的多。
效果演示：
當第二個引數為true時，效果如下：
當第二個引數為false時，效果如下：
這個後續動畫我們要好好理解，來看個例子。
案例：滑鼠懸停時，彈出下拉列表（下拉時帶動畫）
一級選單1
一級選單1
上方**中，關鍵的地方在於，用了stop函式，再執行動畫前，先停掉之前的動畫。
如果去掉stop()函式，效果如下：（不是我們期望的效果）
如果引數jumptoend被設定為true，那麼當前動畫會停止，但是參與動畫的每乙個css屬性將被立即設定為它們的目標值。比如：slideup()方法，那麼元素會立即隱藏掉。如果存在**函式，那麼**函式也會立即執行。
注意：如果元素動畫還沒有執行完，此時呼叫sotp()方法，那麼動畫將會停止。並且動畫沒有執行完成，那麼**函式也不會被執行。
想學習**之外的軟技能掃一掃，你將發現另乙個全新的世界，而這將是一場美麗的意外：
詳解jQuery動畫
jquery動畫分為內建動畫和自定義動畫 內建動畫 顯示show 隱藏hide 顯示隱藏切換toggle 上拉slideup 下拉slidedown 上拉下拉切換slidetoggle 淡入fadein 淡出fadeout 淡入淡出切換fadetoggle 透明度fadeto 自定義動畫 anima...
jquery動畫順序執行 JQuery動畫佇列詳解
jquery動畫存在乙個佇列，當在jquery物件上呼叫動畫方法時，如果物件正在執行某個動畫效果，那麼會把後面的動畫效果，放在乙個佇列裡面，然後按順序執行動畫佇列裡面的每乙個動畫。box.hide 1000,function box.show 1000,function box.fadeout sl...
jquery 動畫效果
首先，在做jquery 動畫效果之前，必須先知道jquery動畫效果的實現順序。jquery中，會把所有的動畫效果 如hide，show等 放入乙個佇列中 預設為 fx 然後依照先進先出的原則執行佇列中的動畫效果。其他的非動畫效果，都不會放入佇列中。並且jquery 會優先執行這些非動畫效果，然後再...