1.)show()和hide(),会显示和隐藏DOM元素。但是,只要传递一个时间参数进去,就变成了动画,从左上角逐渐展开或收缩的:
div.hide(3000); // 在3秒钟内逐渐消失
toggle()方法则根据当前状态决定是show()还是hide()
2.)slideUp()和slideDown()是在垂直方向逐渐展开或收缩的。slideToggle()则根据元素是否可见来决定下一步动作:
div.slideUp(3000); // 在3秒钟内逐渐向上消失
3.)fadeIn()和fadeOut()的动画效果是淡入淡出,也就是通过不断设置DOM元素的opacity属性来实现,而fadeToggle()则根据元素是否可见来决定下一步动作:
div.fadeOut('slow'); // 在0.6秒内淡出
jQuery的动画效果还可以串行执行,通过delay()方法还可以实现暂停,这样,我们可以实现更复杂的动画效果,而代码却相当简单:
// 动画效果:slideDown - 暂停 - 放大 - 暂停 - 缩小
1 div.slideDown(2000) .delay(1000) .animate({ '256px', height: '256px' }, 2000) .delay(1000) .animate({ '128px', height: '128px' }, 2000); }