Shrink Items

This option causes a carousel to only show whole slides.

With shrinkItems set to true

With shrinkItems set to false

JS:

  $('#demoSlider').mbSlider({
    slideWidth: 350,
    minSlides: 2,
    maxSlides: 3,
    slideMargin: 10,
    shrinkItems: true
  });
});

HTML:

<div id="demoSlider" class="mbslider">
  <div class="slide"><img src="https://unsplash.it/1280/720?random&p=3050066325"></div>
  <div class="slide"><img src="https://unsplash.it/1280/720?random&p=9891560408"></div>
  <div class="slide"><img src="https://unsplash.it/1280/720?random&p=6363058898"></div>
  <div class="slide"><img src="https://unsplash.it/1280/720?random&p=2236685637"></div>
  <div class="slide"><img src="https://unsplash.it/1280/720?random&p=3267281243"></div>
  <div class="slide"><img src="https://unsplash.it/1280/720?random&p=6789115225"></div>
  <div class="slide"><img src="https://unsplash.it/1280/720?random&p=7712847488"></div>
  <div class="slide"><img src="https://unsplash.it/1280/720?random&p=1818529697"></div>
  <div class="slide"><img src="https://unsplash.it/1280/720?random&p=3214593638"></div>
</div>
Torna all'inizio