jquery调用animate()方法制作动画效果

导语 jquery调用animate()方法制作动画效果调用animate()方法可以创建自定义动画效果,它的调用格式为:$(selector) animate({params},speed,[callback])其中,params参数为制作动画效果的CSS属性名与值,speed参数为
jquery调用animate()方法制作动画效果

调用animate()方法可以创建自定义动画效果,它的调用格式为:

$(selector).animate({params},speed,[callback])

其中,params参数为制作动画效果的CSS属性名与值,speed参数为动画的效果的速度,单位为毫秒,可选项callback参数为动画完成时执行的回调函数名。

调用animate()方法不仅可以制作简单渐渐变大的动画效果,而且还能制作移动位置的动画,在移动位置之前,必须将被移元素的“position”属性值设为“absolute”或“relative”,否则,该元素移动不了。

CSS样式

  1. span 
  2.     position:absolute
  3.     width:80px
  4.     height:80px
  5.     bordersolid 1px #ccc
  6.     margin0px 8px
  7.     background-color: Red; 
  8.     color:White; 
  9.     vertical-align:middle 
  1. <body> 
  2.      <h3>制作移动位置的动画</h3> 
  3.      <span></span> 
  4.      <div id="tip"></div> 
  5.       
  6.      <script type="text/javascript"
  7.          $(function () { 
  8.              $("span").animate({ 
  9.                  left: "+=100px" 
  10.              }, 3000, function () { 
  11.                  $(this).animate({ 
  12.                      height: '+=30px'
  13.                      width: '+=30px' 
  14.                  }, 3000, function () { 
  15.                      $("#tip").html("执行完成!"); 
  16.                  }); 
  17.              }); 
  18.          }); 
  19.      </script> 
  20.  </body> 
  21. tml> 

 

http://www.aseoe.com/ true jquery调用animate()方法制作动画效果 http://www.aseoe.com/show-13-488-1.html report 2716.5 jquery调用animate()方法制作动画效果调用animate()方法可以创建自定义动画效果,它的调用格式为:$(selector) animate({params},speed,[callback])其中,params参数为制作动画效果的CSS属性名与值,speed参数为
TAG:jquery animate()
本站欢迎任何形式的转载,但请务必注明出处,尊重他人劳动成果
转载请注明: 文章转载自:爱思资源网 http://www.aseoe.com/show-13-488-1.html

[前端插件推荐] Plugin

1 2 3 4
  • jQuery实现逐字逐句显示插件l-by-l.min.js
  • jQuery带方向感知的鼠标滑过图片边框特效插件
  • jQuery HotKeys监听键盘按下事件keydown插件
  • 响应式无限轮播jQuery旋转木马插件
响应式无限轮播jQuery旋转木马插件
web前端开发
爱思资源网 Copyright 2012-2014 Www.Aseoe.Com All rights reserved.(晋ICP备13001436号-1)