Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

jQuery SlidesJS - Can't restart animation after clicking on navigation

I am using the new slideJS V3.0 but I can't seem to make the slide animation restart after it has been paused by clicking on the navigation. I saw someone who said they made it work with the pagination, so I tried using that, to no avail. Any help is greatly appreciated!

Here is the code I'm using (currently trying to just get it to work even with pagination)

<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>
like image 201
EPM Avatar asked Mar 24 '23 12:03

EPM


2 Answers

This can be done without modifying the plugin (using SlideJS 3.0). Just add the following complete callback in your options:

$('#slides').slidesjs({
    callback: {
        complete: function(number) {
            var pluginInstance = $('#slides').data('plugin_slidesjs');

            setTimeout(function() {
                pluginInstance.play(true);
            }, pluginInstance.options.play.interval);
        }
    }
});
like image 126
leconcepteur Avatar answered Apr 25 '23 16:04

leconcepteur


In your jquery.slides.js file do a search for _this.stop(true);

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

The problem i was having was the slider was stop sliding after click either previous, next or pagination. I needed the slider to restart.. so what i did was add a setTimeout to play()

_this.stop(true);

setTimeout(function ()
{ _this.play(true) }, 3000);
like image 22
Dally S Avatar answered Apr 25 '23 15:04

Dally S