jQuery SlidesJS - 点击导航后无法重新启动动画

4

我正在使用新的slideJS V3.0,但似乎无法在通过导航点击暂停后重新启动幻灯片动画。我看到有人说他们通过分页使其工作,所以我尝试使用了分页,但仍然无济于事。非常感谢任何帮助!

这是我正在使用的代码(目前只尝试即使使用分页也让它起作用)

<script>

$(function() {

  $('#slides').slidesjs({

    width: 905,
    height: 310,
     navigation: false,
  play: {
    auto: true,
    pauseOnHover: true,
    effect: 'fade',
    restartDelay: 1500
  },
  pagination: {
    effect: 'fade',
    play: {          
      restartDelay: 1500
    }
  },
  effect: {
    fade: {
       speed: 1500
    },       
    crossfade: true
  }

  });
});

</script>
4个回答

6
这可以在不修改插件的情况下完成(使用SlideJS 3.0)。只需在您的选项中添加以下完整回调函数:
$('#slides').slidesjs({
    callback: {
        complete: function(number) {
            var pluginInstance = $('#slides').data('plugin_slidesjs');

            setTimeout(function() {
                pluginInstance.play(true);
            }, pluginInstance.options.play.interval);
        }
    }
});

我刚刚看到这个消息,不幸的是我们已经选择了另一个解决方案,但我希望早些尝试这个。非常感谢! - EPM

1
在您的jquery.slides.js文件中搜索_this.stop(true);
它会显示大约3-4次,下一个和上一个点击..您还将看到它显示为paginationLink.click
我遇到的问题是滑块在单击上一个、下一个或分页后停止滑动。我需要滑块重新启动。所以我添加了一个setTimeout来播放()。
_this.stop(true);

setTimeout(function ()
{ _this.play(true) }, 3000);

0

我今天遇到了同样的问题。

以下是解决方法:在jquery.sldes.js文件中转到第184行,并将其更改为以下内容

return _this.goto(($(e.currentTarget).attr("data-slidesjs-item") * 1) + 1) && _this.play();

希望这对你有用。

我尝试过这个,但如果您点击活动幻灯片,它不会重新启动动画,但如果您点击其他任何幻灯片,则可以正常工作。您知道如何修复单击同一幻灯片的问题吗? - suicidebilly

0

演示:http://jsbin.com/cujeqekate
旧版本或新版本:

$(function($) {
  var interval = 4000;
  var st = 0;
  var $slides = $('#slides');
  $slides.slidesjs({
    width: 800,
    height: 450,
    play: {
      active: true,
      auto: true,
      interval: interval,
      swap: true,
      pauseOnHover: true
    },
    callback: {
      start: function(number){
        if ( $slides.find('.slidesjs-play').is(':visible')) {
          clearTimeout(st);
          st = setTimeout(function() {
             $slides.find('.slidesjs-play').click();
          }, interval);
        }
      }
    }
  });
});


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接