【问题标题】:jcarousellite stop on clickjcarouselite 停止点击
【发布时间】:2011-04-06 15:00:25
【问题描述】:

嗨 我有一个带有 jcarouselite 的页面,每 5 秒显示一些图像并自动滚动我想在单击轮播中的任何图像时停止滚动

这就是我想要做的事情

$(document).ready(function() {
    $('.slider_images').jCarouselLite({
        btnNext: "#next",
        btnPrev: "#prev",
        auto:  3000         
    }); 

    $(".slider_images img").click(function(){


        $('.slider_images').jCarouselLite({
            btnNext: "#next",
            btnPrev: "#prev",
            scroll: false       
        }); 


    });
});

【问题讨论】:

    标签: javascript jquery jcarousellite


    【解决方案1】:

    对于这么晚的回复,我深表歉意。我的问题解决了。我们可以通过改变 jcarousellite 的 pauseOnHover 选项来很容易地实现 stop on click 属性。如果你看到 pauseOnHover 的实现,它是这样的:

    o.pauseOnHover ? ul.hover(function (){ paused == 1 }, function (){paused=0}) : "";
    

    我们可以通过将 ul.hover 更改为 ul.click 来实现点击停止

    o.pauseOnHover ? ul.click(function (){ paused == 1 }, function (){paused=0}) : "";
    

    祝你有美好的一天。

    【讨论】:

      【解决方案2】:

      看了一会儿代码,发现自动滚动是通过setTimeout实现的:

      if(o.auto)
          setInterval(function() {
              go(curr+o.scroll);
          }, o.auto+o.speed);
      

      如果您第二次使用jCarouselLite,它不会停止setTimeout。要停止 setTimout,您必须调用 window.clearTimeout

      var timeoutId = window.setTimeout(function(){...}, 100);
      
      window.clearTimeout(timeoutId);
      

      这是不可能的,因为 jcarousel 的代码没有为您提供这些timeoutId。您可以与开发人员交谈或自行修改代码。

      【讨论】:

        【解决方案3】:

        我想不同意 scheffield 和/或找到使用此插件的解决方法,但我必须同意他的意见 - 需要重写源代码才能完成您想要的操作。或者,您可能需要考虑jquery cycle。它已经有了“暂停”和“停止”方法。

        【讨论】:

          【解决方案4】:

          将此添加到文件顶部

          var timers = new Array();
          

          改变

          setInterval(function(){go(curr+o.scroll)},o.auto+o.speed)  
          

          timers.push(new Array( this.className, setInterval(function(){go(curr+o.scroll)},o.auto+o.speed)));
          

          停止滚动

          var classToStop = ".TestClass"; 
          
          for(var i=0; i < timers.length; i++)
          {
              if("."+timers[i][0] == uploadifyClass)
              window.clearInterval(timers[i][1])
          }
          

          【讨论】:

            【解决方案5】:

            这将停止页面上的所有轮播自动前进。我在这里杀死所有使用超时的东西。这对我有用:

            $(".slider_images img").click(function(){
                var x = setTimeout("");
                for (var i = 0 ; i < x ; i++)
                clearTimeout(i);
            }
            

            【讨论】:

            • 这可能适用于大多数浏览器,但它使用的是未定义的行为。 setTimeout的返回数字规范只规定必须是数字,不要求连续。
            【解决方案6】:
            $(".mycarousel").trigger('stopCarousel');
            

            如果您使用的是最新的 jcarousel https://github.com/kswedberg/jquery-carousel-lite/

            尽管 pauseCarousel 存在,但由于某种原因,此事件不在他们的文档中。

            【讨论】:

              猜你喜欢
              • 2014-04-09
              • 2021-03-25
              • 1970-01-01
              • 1970-01-01
              • 2014-01-07
              • 1970-01-01
              • 1970-01-01
              • 1970-01-01
              • 2022-01-11
              相关资源
              最近更新 更多