Skip to content

Instantly share code, notes, and snippets.

@daviddeutsch
Last active June 29, 2021 10:46
Show Gist options
  • Save daviddeutsch/07b8e5201652456e428c9e7e65729433 to your computer and use it in GitHub Desktop.
Save daviddeutsch/07b8e5201652456e428c9e7e65729433 to your computer and use it in GitHub Desktop.
/**
* Plugin for linking multiple owl instances
* @version 1.0.0
* @author David Deutsch
* @license The MIT License (MIT)
*/
;(function($, window, document, undefined) {
/**
* Creates the Linked plugin.
* @class The Linked Plugin
* @param {Owl} carousel - The Owl Carousel
*/
var Linked = function(carousel) {
/**
* Reference to the core.
* @protected
* @type {Owl}
*/
this._core = carousel;
/**
* All event handlers.
* @protected
* @type {Object}
*/
this._handlers = {
'dragged.owl.carousel changed.owl.carousel': $.proxy(function(e) {
if (e.namespace && this._core.settings.linked) {
this.update(e);
}
}, this),
'linked.to.owl.carousel': $.proxy(function(e, index, speed, standard, propagate) {
if (e.namespace && this._core.settings.linked) {
this.toSlide(index, speed, propagate);
}
}, this)
};
// register event handlers
this._core.$element.on(this._handlers);
// set default options
this._core.options = $.extend({}, Linked.Defaults, this._core.options);
};
/**
* Default options.
* @public
*/
Linked.Defaults = {
linked: false
};
Linked.prototype.toSlide = function(index, speed, propagate) {
if ( typeof propagate == 'undefined' ) {
propagate = true;
}
var id = this._core.$element.attr('id');
linked = this._core.settings.linked.split(',');
if ( index == null || typeof index == 'undefined' ) {
index = 0;
}
if ( propagate ) {
$.each(linked, function(i, el){
$(el).trigger('linked.to.owl.carousel', [index, 300, true, false]);
});
} else {
this._core.$element.trigger('to.owl.carousel', [index, 300, true]);
}
};
/**
* Updated linked instances
*/
Linked.prototype.update = function(e) {
if (e.page.size == 1) {
this.toSlide( e.relatedTarget.relative(e.item.index) );
}
};
/**
* Destroys the plugin.
* @protected
*/
Linked.prototype.destroy = function() {
var handler, property;
for (handler in this._handlers) {
this.$element.off(handler, this._handlers[handler]);
}
for (property in Object.getOwnPropertyNames(this)) {
typeof this[property] != 'function' && (this[property] = null);
}
};
$.fn.owlCarousel.Constructor.Plugins.linked = Linked;
})(window.Zepto || window.jQuery, window, document);
@johnhearfield
Copy link

This doesnt seem to support autoplayHoverPause: true

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment