jQuery中函数animate()作用是对被选元素执行之定义动画。
语法:
$(selector).animate({params},[duration],[easing],[callback]);
参数说明:
params:定义产生动画的CSS属性,可以定义多个params属性。
duration:定义用来应用的动画的时间。
easing:要使用的擦除效果的名称(需要插件支持).默认jQuery提供"linear" 和 "swing".
示例:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
<script type="text/javascript" src="jquery-1.6.4.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('#start').click(function(){
$("#box").animate({left:"100px"},"slow");
$("#box").animate({fontSize:"3em"},"slow");
$("#box").animate({fontSize:"1em"},"slow");
$("#box").animate({left:"0px"},"slow");
});
});
</script>
</HEAD>
<BODY>
<p><a href="#" id="start">Start Animation</a></p>
<div id="box" style="background:#98bf21;height:100px;width:200px;position:relative">Hello</div>
</BODY>
</HTML>