CODEWITHSUNDEEP
jquery
soccer7
soccer7

Reputation: 4005

Get current Slide number from BxSlider

I am using jQuery bxslider.

I want to get currentslidenumber when I click on next, here is my code 

function slider() {
 $('.recent_articles').bxSlider({
        slideWidth: 223,
        minSlides: 2,
        maxSlides: 8,
        moveSlides: 1,
        slideMargin: 18,
           infiniteLoop: false,
           pager:false,

       });
}


$(document).on('click','.bx-next', function() {
 var total = slider.getCurrentSlide();
 alert(total);
});

slider();

Now when I click, I get this error:

TypeError: slider.getCurrentSlide is not a function

Anybody tells me how to do this

Thanks

Upvotes: 1

Views: 9756

Answers (2)

VIshal
VIshal

Reputation: 1

$('.stepslider').bxSlider({
minSlides: 1,
maxSlides: 1,
moveSlides: 1,
slideWidth: 1280,
slideMargin: 5,
infiniteLoop: false,
auto: false,
hideControlOnEnd: true,
pager: false,
onSlideBefore: function (currentSlideNumber, totalSlideQty, currentSlideHtmlObject) {
var gosteps = currentSlideHtmlObject+1; //get current slide index you can add class this is working in mobile touch also
$(".steps-count span").text(gosteps);
console.log(currentSlideHtmlObject+1); //get current slide
}
});

using currentSlideHtmlObject element you can get current slide before sliding you have to update currentSlideHtmlObject+1 as current slide.

Upvotes: 0

Viswanath Donthi
Viswanath Donthi

Reputation: 1821

Here's the code:

var mySider = $('.recent_articles').bxSlider({
                   slideWidth: 223,
                   minSlides: 2,
                   maxSlides: 8,
                   moveSlides: 1,

                   ------
                   ------
               });

And, call getCurrentSlide() as:

$(document).on('click','.bx-next', function(){
    var total = mySider.getCurrentSlide();
    alert(total);
});

Upvotes: 4

Related Questions