JQuery SlidesJS - Unable to restart animation after clicking navigation

I am using the new slide JS V3.0, but I cannot force the slide animation to restart after it has been paused by clicking on the navigation. I saw someone who said that it worked with pagination, so I tried to use this, but to no avail. Any help is much appreciated!

Here is the code I'm using (currently trying to just make it work even paginated)

<script> $(function() { $('#slides').slidesjs({ width: 905, height: 310, navigation: false, play: { auto: true, pauseOnHover: true, effect: 'fade', restartDelay: 1500 }, pagination: { effect: 'fade', play: { restartDelay: 1500 } }, effect: { fade: { speed: 1500 }, crossfade: true } }); }); </script> 
+4
source share
4 answers

This can be done without changing the plugin (using SlideJS 3.0). Just add the following full callback to your parameters:

 $('#slides').slidesjs({ callback: { complete: function(number) { var pluginInstance = $('#slides').data('plugin_slidesjs'); setTimeout(function() { pluginInstance.play(true); }, pluginInstance.options.play.interval); } } }); 
+6
source

In the jquery.slides.js file, search for _this.stop (true);

It shows about 3-4 times, next and previous click .. and you will also see that it shows paginationLink.click

The problem that I encountered was that the slider stopped sliding after clicking either the previous, next, or pagination. I needed a slider to restart. So what I did was add setTimeout to play ()

 _this.stop(true); setTimeout(function () { _this.play(true) }, 3000); 
+1
source

I had the same problem today.

Here's how to solve it: in the jquery.sldes.js file, go to line 184 and change it like this:

 return _this.goto(($(e.currentTarget).attr("data-slidesjs-item") * 1) + 1) && _this.play(); 

Hope this works for you.

0
source

DEMO: http://jsbin.com/cujeqekate
older version or newer version:

 $(function($) { var interval = 4000; var st = 0; var $slides = $('#slides'); $slides.slidesjs({ width: 800, height: 450, play: { active: true, auto: true, interval: interval, swap: true, pauseOnHover: true }, callback: { start: function(number){ if ( $slides.find('.slidesjs-play').is(':visible')) { clearTimeout(st); st = setTimeout(function() { $slides.find('.slidesjs-play').click(); }, interval); } } } }); }); 
0
source

Source: https://habr.com/ru/post/1487161/


All Articles