1、調用animate()方法可以創建自定義動畫效果
它的調用格式爲:
$(selector).animate({params},speed,[callback])
其中,params參數爲製作動畫效果的CSS屬性名與值,speed參數爲動畫的效果的速度,單位爲毫秒,可選項callback參數爲動畫完成時執行的回調函數名。
調用animate()方法不僅可以製作簡單漸漸變大的動畫效果,而且還能製作移動位置的動畫,在移動位置之前,必須將被移元素的“position”屬性值設爲“absolute”或“relative
<body>
<h3>製作移動位置的動畫</h3>
<span></span>
<div id="tip"></div>
<script type="text/javascript">
$(function () {
$("span").animate({
left: "+=100px"
}, 3000, function () {
$("span").animate({
height: '+=30px',
width: '+=30px'
}, 3000, function () {
$("#tip").html("執行完成!");
});
});
});
</script>
</body>
2、調用stop()方法停止當前所有動畫效果
在動畫完成之前,停止當前正在執行的動畫效果,這些效果包括滑動、淡入淡出和自定義的動畫,它的調用格式爲:
$(selector).stop([clearQueue],[goToEnd])
3、delay()方法延時執行動畫效果
調用格式爲:
$(selector).delay(duration)