注意此代码需要用到jquery的js文件,才可以用所以大家可以先下载一个jquery文件,注意调用路径。代码: 复制代码 代码如下: jQuery动画基础 <BR>.theImage{ <BR>position:relative; <BR>background:Green; <BR>width:100px; <BR>} <BR> <BR>$(function(){ <BR>$("#btnShow").click(function(){ <BR>//$("#block").show(1000);//没有参数则没有动画效果 <BR>//$("#block").fadeIn("slow");//根据透明度显示或隐藏 <BR>$("#block").slideDown();//拉下来。只改变高度 <BR>}); <BR>$("#btnHide").click(function(){ <BR>//$("#block").hide("normal");//slow,normal,fast <BR>//$("#block").fadeOut(5000); <BR>$("#block").slideUp(); <BR>}); <br><br>//自定义动画 <BR>$("#btnImage").click(function(){ <BR>$("#imageDiv").animate( <BR>//I <BR>//移动到的位置,这里的位置是相对与原来的位置 <BR>//top即相对原来的位置向上移动多少距离,没搞明白,结果是向下移动了。 <BR>//{left:"400px",top:"100px"}, <BR>//3000 <BR>//II <BR>{left:"+=50",width:"300px",height:"200px"},//改变位置的同时改变宽度高度 <BR>3000 <BR>); <BR>}); <BR>//同时执行两个动画,执行完一个,然后接着执行另一个。 <BR>$("#btnImage").click(function(){ <BR>$("#imageDiv").animate( <BR>{left:"100px",width:"30px",height:"20px"}, <BR>3000, <BR>function(){alert('callback函数');}//动画结束后要执行的函数 <BR>); <BR>}); <BR>}); <BR> Show Hide Hello! moveImage image hi