如何刷新jquery carousel autoplay

时间:2012-06-03 13:04:48

标签: jquery carousel

我需要刷新div或者jQuery函数,当从页面加载后左侧列表中的多个实例中选择一个轮播时,它向左滚动但是当执行功能时,下一个滚动器停止。

代码为:

<script type="text/javascript">
  $(function() {
    $('#carousel_1').carouFredSel({
      width: '100%',
      auto: {
        items: 1
      },
      prev: '#prev1',
      next: '#next1'
    });

    $('#carousel_2').carouFredSel({
      width: '100%',
      auto: {
        items: 1
      },
      prev: '#prev2',
      next: '#next2'
    });

    $('#carousel_3').carouFredSel({
      width: '100%',
      auto: {
        items: 1
      },
      prev: '#prev3',
      next: '#next3'
    });

    var items = $('.list_switch>li>a').each(function () {
      $(this).click(function () {
        //remove previous class and add it to clicked tab
        items.removeClass('current');
        $(this).addClass('current');

        //hide all content divs and show current one
        $('.carousel').hide().eq(items.index($(this))).show('fast');
      });
    });

    // select the first tab on page load       
    items[0].click();
  });
</script>

演示页: http://blogillucent.alwaysdata.net/aaa/coolcarousel.html

1 个答案:

答案 0 :(得分:0)

您可以使用play事件恢复所选滑块上的滑动:

<强>如,

$("#foo").trigger("play");

请参阅文档here

特别是您的代码:

var items = $('.list_switch>li>a').each(function () {
  $(this).click(function () {
    //remove previous class and add it to clicked tab
    items.removeClass('current');
    $(this).addClass('current');

    //hide all content divs and show current one
    $('.carousel').hide().eq(items.index($(this))).show('fast');

    // resume the slide on the selected slider
    $('.carousel').eq(items.index($(this))).trigger("play");
  });
});

通过阅读文档,它应该暂停滑块以使用play事件,因此您应该在每个滑块初始化后暂停不可见的:

<强>如,

$("#foo").trigger("pause");

您可以查看carouFredSel插件的Code examples for the custom events