jQuery的链式动画写法中加入setTimeout

今日闲逛,看到一个简单的封装,用于在两次animate之间,加入一定的时间间隔的等待。
原文地址:http://docs.jquery.com/Cookbook/wait
你还可以在里边看到demo

  1. $.fn.wait = function(time, type) {
  2.     time = time || 1000;
  3.     type = type || "fx";
  4.     return this.queue(type, function() {
  5.         var self = this;
  6.         setTimeout(function() {
  7.             $(self).dequeue();
  8.         }, time);
  9.     });
  10. };

具体用法是,.wait( [time], [type] )
第一个参数是时间,默认是1000毫秒。
第二个参数是类型,默认是fx即动画效果

  1. function runIt() {
  2.     $("div").wait()
  3.         .animate({left:'+=200'},2000)
  4.         .wait()
  5.         .animate({left:'-=200'},1500,runIt);
  6.     }
  7. runIt();

由于我对对queue这个函数用法不是很熟,所以我也不太清楚第二个参数还能设置除了fx之外的其他什么。
有熟悉的朋友可以帮忙解释一下。

4 thoughts on “jQuery的链式动画写法中加入setTimeout

  1. Pingback: jQuery中queue和dequeue的用法 | 走走停停看看

  2. 看了下代码,实际上fx是指jQuery.fx

    如果你的动画是用默认的animate做的,那么自然就是fx

    如果是用自己的扩展实现的,例如myfx.animate,那么就用myfx

    不过一般不会自己去写fx,所以可以无视这个参数了

发表评论

电子邮件地址不会被公开。 必填项已用 * 标注

*

您可以使用这些 HTML 标签和属性: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>