animate
必需的 params 參數(shù)定義形成動畫的 CSS 屬性。
可選的 speed 參數(shù)規(guī)定效果的時長。它可以取以下值："slow"、"fast" 或毫秒。
jQuery提供了以下幾種方法來操作動畫隊列。
stop([clearQuery],[gotoEnd]):停止當前jQuery對象里每個DOM元素上正在執(zhí)行的動畫。
queue([queueName,]callback):將callback動畫數(shù)添加到當前jQuery對象里所有DOM元素的動畫函數(shù)隊列的尾部气破。
queue([queueName,]naeQueue):用newQueue動畫函數(shù)隊列代替當前jQuery對象里所的DOM元素的動畫函數(shù)隊列。
dequeue():執(zhí)行動畫函數(shù)隊列頭的第一個動畫函數(shù)餐抢，并將該動畫函數(shù)移出隊列现使。
clearQueue([queueName]):清空動畫函數(shù)隊列中的所有動畫函數(shù)。
可選的 callback 參數(shù)是動畫完成后所執(zhí)行的函數(shù)名稱旷痕。
<style>
div {
width: 60px;
height: 60px;
position:absolute;
top:60px;
background: #f0f;
display:none;
}
</style>
</head>
<body>
<script type="text/javascript" src="../jquery-1.8.0.js">
</script>
<p>動畫隊列的長度是：<span></span></p>
<div></div>
<script type="text/javascript">
var div = $("div");
function runIt()
{
// 第1個動畫：顯示出來
div.show("slow");
// 第2個動畫：自動動畫碳锈，水平左移300px
div.animate({left:'+=300'},2000);
// 第3個動畫：卷起來
div.slideToggle(1000);
// 第4個動畫：放下來
div.slideToggle("fast");
// 第5個動畫：自動動畫，水平右移300px
div.animate({left:'-=300'},1500);
// 第6個動畫：隱藏出來
div.hide("slow");
// 第7個動畫：顯示出來
div.show(1200);
// 第8個動畫：卷起來欺抗，動畫完成后回調(diào)runIt
div.slideUp("normal", runIt);
}
// 控制每0.1秒調(diào)用一次該方法售碳，該方法用于顯示動畫隊列的長度
function showIt()
{
var n = div.queue();
$("span").text(n.length);
setTimeout(showIt, 100);
}
runIt();
showIt();
</script>
隊列是一種列表，不同的是隊列只能在末尾插入元素绞呈，在隊首刪除元素贸人。隊列用于存儲按順序排列的數(shù)據(jù)。先進先出佃声。這點和棧不一樣艺智，在棧中，最后入棧的元素反被優(yōu)先處理圾亏∈穑可以將隊列想象成銀行排隊辦理業(yè)務(wù)的人，排隊在第一個的人先辦理業(yè)務(wù)志鹃，其它人只能排著父晶，直到輪到他們?yōu)橹埂?自定義動畫
上面幾個簡單的動畫不能滿足需求的時候，jquery提供了自定義動畫行為的方法
.animate( properties [, duration ] [, easing ] [, complete ] )
properties是一個CSS屬性和值的對象,動畫將根據(jù)這組對象移動弄跌。
$('#clickme').click(function() {
$('#book').animate({
opacity: 0.25,
left: '+=50',
height: 'toggle'
}, 5000, function() {
// Animation complete.
});
});
.clearQueue
清除動畫隊列中未執(zhí)行的動畫
.finish
停止當前動畫，并清除動畫隊列中所有未完成的動畫,最終展示動畫隊列最后一幀的最終狀態(tài)
.stop( [clearQueue ] [, jumpToEnd ] )
停止當前正在運行的動畫
- clearQueue(default: false)
- jumpToEnd(default: false)
