Swiper stop autoplay
Type your search query and hit enter: All Rights ReservedView Non-AMP Version Type your search query and hit enter:
Categories: jQuery Stop swiper slide autoplay on mouse enter and start autoplay on mouse leaveHow to stop swiper slide autoplay on mouse enter and start autoplay on mouse leave? I have tried .stopAutoplay() and .startAutoplay() function but not worked for me. Show
thank you here is code. and i face console error
var swiper = new Swiper('.swiper-container', {
pagination: '.swiper-pagination',
paginationClickable: true,
nextButton: '.swiper-button-next',
prevButton: '.swiper-button-prev',
spaceBetween: 0,
loop: true,
effect: 'slide',
longSwipes: true,
autoplay:2000,
autoplayDisableOnInteraction:true,
});
$(".swiper-container").mouseenter(function(){
swiper.stopAutoplay();
});
$(".swiper-container").mouseleave(function(){
swiper.startAutoplay();
});
AnswerYou need to use the option disableOnInteraction: true rather than binding the events yourself see here for documentation. Optionally you can use the following for autoplay start stop
Edit Your mistake is how you are getting the instance for swiper. see below for demo $(document).ready(function() {
new Swiper('.swiper-container', {
speed: 400,
spaceBetween: 100,
autoplay: true,
disableOnInteraction: true,
});
var mySwiper = document.querySelector('.swiper-container').swiper
$(".swiper-container").mouseenter(function() {
mySwiper.autoplay.stop();
console.log('slider stopped');
});
$(".swiper-container").mouseleave(function() {
mySwiper.autoplay.start();
console.log('slider started again');
});
}); .swiper-slide {
text-align: center;
} admin Next C/C++ Sockets: IPv6 TCP connection fails if I do anything before it » Previous « jQuery file upload plugin, multiple files and form data Share Published by admin Tags: javascriptjqueryswiper
Related PostRecent Posts
React array map inside map value not renderingI have an object Array list and this array list includes duplicate values. So I 2 days ago
Should properties of constants be capitalized? [closed]I know that it is conventional to capitalize constant values in programming, but would you 3 days ago
How to looping trough an array of object when array name is not consistent?Consider below example: const obj ={ price:[{multiple items},{multiple items}], name:"", id:"", } i want to 3 days ago
Remove input value on backspace keyupI have a small canonical lottery search form comprising of 6 input fields. Currently when 3 days ago
How can i do onclick event with html,css,jsI want the css codes of the blog1popup class to change when the image is 3 days ago
Best practices writing JavaScript that uses AJAX call to decide if default action should be preventedI'm using JavaScript and jQuery to write a handler for my form being submitted. Based 3 days ago
All Rights ReservedView Non-AMP Version
This website uses cookies. Accept |
