CODEWITHSUNDEEP
jquerybxslider
Riddhi Shah
Riddhi Shah

Reputation: 73

custom pause option value in bxslider on each slide

I have applied bxslider on ul element. But i want to have different pause attribute value for each slide.

slider = $('.bxslider').bxSlider({
    speed:500,
    pause:5000,
    onSlideBefore: function(){
    },
    onSlideAfter: function(){
    }
});

Inside onSlideBefore or onSlideAfter i want to set pause value of the next (if code is inside onSlideBefore) or current slide (if code is inside onSlideAfter) so that each image slide will be having their own transition value.

Appreciate your help in any way.

Upvotes: 0

Views: 5191

Answers (1)

Riddhi Shah
Riddhi Shah

Reputation: 73

I resolved my problem with below code. Not sure if this is the correct way to do so. Try it out if it helps you.
I added a new public method inside jquery.bxslider.min.js as below.

n.setPause = function (t) {
    if(s.settings.auto){
        clearInterval(s.interval);
        s.interval = setInterval(function () {
        s.settings.autoDirection=="next"?n.goToNextSlide() : n.goToPrevSlide()}, t)
    }
};

where, t is the milliseconds for each individual image slide.

In my JSP, i added onSlideAfter function where $slider is the jQuery element on which bxslider is applied. 

onSlideAfter: function(){
    $slider.setPause(current image pause in milliseconds);
}

Upvotes: 2

Related Questions