Bx slider start / stop function

Question

I use the bxslider plugin and created some external controls for the previous and next function, although I cannot figure out how to do the same with start / stop controls.

Basically I want to use this as a play / pause function for a slider.

Does anyone have any experience with this plugin?

Here is what I still have, without a start / stop function:

http://jsfiddle.net/WaWLN/1/

In addition, I want the slider to be “automatic” and also have external controls. I just noticed that clicking on any of my links seems to turn off automatic playback, and I have to refresh the page to get it back.

Answer 1

I don’t know if you still need an answer to this question, but if you update your code before this, it should work:

var slider = $('#bxslider').bxSlider({ auto: true, controls: false }); $('#go-prev').click(function(){ slider.goToPreviousSlide(); slider.startShow(); //added this line return false; }); $('#go-next').click(function(){ slider.goToNextSlide(); slider.startShow(); //added this line return false; }); $('#my-start-stop').click(function(){ /* added a class to your #my-start-start a tag called "stopShow", note: would recommend that you also change the text to say "Stop" when the show is active and "Start" when the show is not. :) */ if($('#my-start-stop').attr('class') == 'stopShow'){ slider.stopShow(); $('#my-start-stop').removeClass('stopShow'); } else { slider.startShow(); $('#my-start-stop').addClass('stopShow'); } return false; });