Question

我可以让这个画廊无问题地工作，但我在扩展功能以包括播放和暂停按钮时遇到了麻烦。 I've set up a fiddle我目前正在制作并运行幻灯片。

我认为重要的是这里：

_startSlideshow: function() {
  var _self = this;

  this.slideshow = setTimeout(function() {
    _self._navigate('next');

    if (_self.options.autoplay) {
      _self._startSlideshow();
    }
  }, this.options.interval);
}

从我收集的内容来看，我需要做的就是更新gallery对象的autoplay属性，以便下次它到达开始幻灯片放映功能时，它只是暂停。我遇到的问题是，一旦我开始幻灯片放映，我就不知道如何访问它。只是为了对事物有更多的控制，我甚至从小提琴中取出javascript并将其输入Chrome控制台以在那里运行它，这样我就可以看到所有工作位，仍然无法更新它。最后一点，似乎唯一的公共功能是destroy，在开始幻灯片放映后我也无法调用我的对象。如果我能做到这一点，我绝对会写一个setAutoplay（bool）函数。

我认为这只是某种范围问题，加上我对新手语法的理解，但我肯定会感谢一些帮助。

- 这是一个更新的小提琴，其中包括我试图访问/更新自动播放内容的一些方法，没有工作。同时显示破坏功能正在进行清理。 https://jsfiddle.net/wzrooqof/2/

Answer 1

我看了一下图书馆的代码。您无需更改其代码即可完成此操作。它是暴露的，所以你可以使用它来调整并保留源代码。

在你的JS代码中，在使用它之前添加它：

$.Gallery.prototype.pause = function() {
    clearTimeout(this.slideshow);
    this.options.autoplay = false;
}

$.Gallery.prototype.resume = function() {
    this.options.autoplay = true;
    this._startSlideshow();
}

然后您可以暂停/恢复幻灯片放映：

var slideshow = $('#dg-container').gallery({autoplay: true});

slideshow.data("gallery").pause();

slideshow.data("gallery").resume();

JSFiddle example

调用初始函数后访问jQuery对象

1 个答案: