bxSlider short PagerType and maxSlides counting issue

[daniellevautier]

I'm currently calling bxslider with both the pager and min/max slide options.

The issue I'm having is that it's not counting my slides correctly, it seems to be counting the current slide (correct) and the "next" amount of slides instead of the total.

https://jsfiddle.net/uLc6qrmn/

HTML:

<ul class="carousel-slider">
    <li><img src="assets/images/cms-images/gallery.jpg" alt=""/></li>
    <li><img src="assets/images/cms-images/gallery.jpg" alt=""/></li>
    <li><img src="assets/images/cms-images/gallery.jpg" alt=""/></li>
    <li><img src="assets/images/cms-images/gallery.jpg" alt=""/></li>
    <li><img src="assets/images/cms-images/gallery.jpg" alt=""/></li>
</ul>

bxSlider call:

 $('.carousel-slider').bxSlider({
    auto: false,
    pager: true,
    pagerType: 'short',
    minSlides: 3,
    maxSlides: 3,
    moveSlides:1,
    slideWidth: 800,
    slideMargin: 40
  });

[sn3ka]

Hello,

the thing is, in your case a slide contains 3 elements at a same time on a total of 5 elements. Which means 2 slides total: 1 slide of 3 elements, 1 slide of 2 elements. BxSlider is a bit bugging if in this special case because you move elements through your "3 elements" slides one by one. element 1 / out of 2 slides, element 2 / out of 2 slides etc... as you can see it is working if you use 1 element per slide: https://jsfiddle.net/uLc6qrmn/105/

What I can propose you is a bit of modification html and js sides:

https://jsfiddle.net/uLc6qrmn/122/

[paulparveen01]

Woow

Hello,

the thing is, in your case a slide contains 3 elements at a same time on a total of 5 elements. Which means 2 slides total: 1 slide of 3 elements, 1 slide of 2 elements. BxSlider is a bit bugging if in this special case because you move elements through your "3 elements" slides one by one. element 1 / out of 2 slides, element 2 / out of 2 slides etc... as you can see it is working if you use 1 element per slide: https://jsfiddle.net/uLc6qrmn/105/

What I can propose you is a bit of modification html and js sides:

https://jsfiddle.net/uLc6qrmn/122/

It worked thanks