如何为3个jQuery工具可滚动项目延迟或fireDelay [英] How to Delay or fireDelay for 3 jQuery Tools Scrollable Items

问题描述

我有3个jQuery Tools Scrollables设置.他们像冠军一样工作. 我似乎找不到或无法绕过的头是如何在开始滚动之前使它们延迟"其初始起点.

I have 3 jQuery Tools Scrollables setup. They work like a champ. What I can't seem to find or wrap my head around is how to make them "delay" their initial starting point before they start scrolling.

我不希望全部3个都在同一时间滚动.

What I don't want is for all 3 to scroll at the exact same time.

我希望左边的滚动条在加载时立即滚动.然后中间的开始第一次滚动800毫秒，然后右边的开始第一次滚动1600毫秒.

I want the left one to scroll immediately on load. Then the middle to start it's first time scrolling 800 milliseconds later, and then the right one to start it's first time scrolling 1600 milliseconds later.

这是到目前为止我得到的... fireDelay或只是Delay或InitialDelay等...似乎根本不起作用.

Here's what I got so far... fireDelay or just Delay or InitialDelay etc... seem not to work at all.

我正在使用此站点上的jQuery插件. http://www.jquerytools.org/demos/scrollable/plugins.html 它被称为滚动可操作插件".我正在使用此独立视图3次. http://www.jquerytools.org/demos/scrollable/plugins-navigator.htm 我给每个人一个自己的ID，以使其正常工作.

I'm using jQuery Plugins from this site. http://www.jquerytools.org/demos/scrollable/plugins.html It's called "Scrollable Plugins in Action". I'm using this Standalone View of it 3 times. http://www.jquerytools.org/demos/scrollable/plugins-navigator.htm I gave each one it's own ID to allow it to work.

对想法或想法表示赞赏！

Thoughts or ideas appreciated!

    <!-- javascript coding -->
    <script type="text/javascript">
    $(document).ready(function() {

    // heeeeeeeeeeere we go.
    $("#chained1").scrollable({circular: true, mousewheel: false}).navigator().autoscroll({
    fireDelay: 800,
    interval: 3000
    });

    $("#chained2").scrollable({circular: true, mousewheel: false}).navigator().autoscroll({
    fireDelay: 1600,
    interval: 3000
    });

    $("#chained3").scrollable({circular: true, mousewheel: false}).navigator().autoscroll({
    fireDelay: 3200,
    interval: 3000
    });

    });
    </script>

推荐答案

该插件中没有fireDelay属性，但是JavaScript可以使用setTimeout和clearTimeout函数进行计数.

There is no fireDelay property in that plugin, but JavaScript counts with setTimeout and clearTimeout functions which you can use.

$.fn.timeout = function(fn, delay){
  var self = this;
  setTimeout(function(){
    self.each(function(){
      fn.call(this);
    });
  }, delay);
  return this;
};

将autoplay设置为false，然后在要启动它时调用.play().

Set autoplay to false, and then call .play() whenever you want to start it.

$("#chained1")
  .scrollable({
    circular: true,
    mousewheel: false
  })
  .navigator()
  .autoscroll({
    interval: 3000,
    autoplay: false
  })
  .timeout(function(){
    $(this).data("scrollable").play();
  }, 800);​

这篇关于如何为3个jQuery工具可滚动项目延迟或fireDelay的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！