2017-02-17 489 views
0

我想創建一個頁面,因爲我已經從[https://bootstrapthemes.co/item/tork-free-mobile-app-html-landing-page-template/][1]下載了模板,但是如圖所示,它有一個自己的carousal,不會自動播放。自動播放不適用於OWL Carousel動畫插件

MY JS的自動播放功能。

function(a, b, c) { 
 
    var d = function(b) { 
 
     this.core = b, this.core.options = a.extend({}, d.Defaults, this.core.options), this.handlers = { 
 
      "translated.owl.carousel refreshed.owl.carousel": a.proxy(function() { 
 
       this.autoplay() 
 
      }, this), 
 
      "play.owl.autoplay": a.proxy(function(a, b, c) { 
 
       this.play(b, c) 
 
      }, this), 
 
      "stop.owl.autoplay": a.proxy(function() { 
 
       this.stop() 
 
      }, this), 
 
      "mouseover.owl.autoplay": a.proxy(function() { 
 
       this.core.settings.autoplayHoverPause && this.pause() 
 
      }, this), 
 
      "mouseleave.owl.autoplay": a.proxy(function() { 
 
       this.core.settings.autoplayHoverPause && this.autoplay() 
 
      }, this) 
 
     }, this.core.$element.on(this.handlers) 
 
    }; 
 
    d.Defaults = { 
 
     autoplay: !1, 
 
     autoplayTimeout: 5e3, 
 
     autoplayHoverPause: !1, 
 
     autoplaySpeed: !1 
 
    }, d.prototype.autoplay = function() { 
 
     this.core.settings.autoplay && !this.core.state.videoPlay ? (b.clearInterval(this.interval), this.interval = b.setInterval(a.proxy(function() { 
 
      this.play() 
 
     }, this), this.core.settings.autoplayTimeout)) : b.clearInterval(this.interval) 
 
    }, d.prototype.play = function() { 
 
     return c.hidden === !0 || this.core.state.isTouch || this.core.state.isScrolling || this.core.state.isSwiping || this.core.state.inMotion ? void 0 : this.core.settings.autoplay === !1 ? void b.clearInterval(this.interval) : void this.core.next(this.core.settings.autoplaySpeed) 
 
    }, d.prototype.stop = function() { 
 
     b.clearInterval(this.interval) 
 
    }, d.prototype.pause = function() { 
 
     b.clearInterval(this.interval) 
 
    }, d.prototype.destroy = function() { 
 
     var a, c; 
 
     b.clearInterval(this.interval); 
 
     for (a in this.handlers) this.core.$element.off(a, this.handlers[a]); 
 
     for (c in Object.getOwnPropertyNames(this)) "function" != typeof this[c] && (this[c] = null) 
 
    }, a.fn.owlCarousel.Constructor.Plugins.autoplay = d 
 
}(window.Zepto || window.jQuery, window, document),

回答

0

試試這個:

$(document).ready(function(){ 
var owl = $(".owl-carousel"); 
owl.owlCarousel({ 
    items: 1, 
    loop:true, 
    autoplay: true, 
    autoPlaySpeed: 5000, 
    autoPlayTimeout: 5000 
    autoplayHoverPause: true 
}); 
});