Как автоматически играть в слайдер Owl Carousel 2 с помощью мыши?
Я хочу, чтобы моя сова-карусель начала прокручиваться, когда мышь входит в этот раздел HTML. Я использую приведенный ниже код. Я попытался с приведенным ниже кодом, но это, кажется, не работает должным образом. Это работает только для первого слайдера, а затем каждый раз, когда я заставляю свою мышь уходить и входить, чтобы скользить по элементам. Пожалуйста, обратитесь к моему фрагменту кода ниже:
var owl=$('#service-slider');
owl.owlCarousel( {
loop:true, autoplayTimeout:100, autoplayHoverPause:false, margin:0, nav:true, items:3, rewind:false, dots:false, navText:['<span><img src="images/slider-arrow.png" alt="slider arrow"></span>', '<span><img src="images/slider-arrow.png" alt="slider arrow"></span>'], responsive: {
0: {
items: 1, nav: true, dots: false, autoHeight: true,
}
, 600: {
items: 2, autoHeight: true,
}
, 768: {
items: 2
}
, 1025: {
items: 3
}
}
}
);
$('.service-slider').on('mouseenter', function() {
owl.trigger('play.owl.autoplay', [100]);
}
);
$('.service-slider').on('mouseleave', function() {
owl.trigger('stop.owl.autoplay');
}
Любая помощь приветствуется...
1 ответ
Я просмотрел ваш код. Я не знаю, почему вы вызываете.service-slider check, класс существует или нет. По умолчанию сова использует карусель.owl-stage, и вы можете использовать этот класс.
$('.owl-stage').on('mouseenter', function() {
owl.trigger ("play.owl.autoplay", [100]);
});
$ ('. owl-stage'). on ('mouseleave', function () {
owl.trigger ('stop.owl.autoplay');
});