Question

我使用swiper来显示一系列相同高度但宽度不同的图像，因此使用不同的宽度方法。但是，我需要一个循环的解决方案。不同宽度的演示代码是： https://github.com/nolimits4web/Swiper/blob/master/demos/14-different-widths.html

<div class="swiper-container">
  <div class="swiper-wrapper">
    <div class="swiper-slide red-slide" style="width:200px;">
      <div class="title">Slide 1</div>
    </div>
    <div class="swiper-slide blue-slide" style="width:150px;">
      <div class="title">Slide 2</div>
    </div>
    <div class="swiper-slide orange-slide" style="width:250px;">
      <div class="title">Slide 3</div>
    </div>
    <div class="swiper-slide blue-slide" style="width:415px;">
      <div class="title">Slide 4</div>
    </div>
    <div class="swiper-slide red-slide" style="width:510px;">
      <div class="title">Slide 5</div>
    </div>
    <div class="swiper-slide green-slide" style="width:375px;">
      <div class="title">Slide 6</div>
    </div>
  </div>
  <div class="pagination"></div>
</div>
<script src="js/jquery-1.10.1.min.js"></script>
<script src="js/idangerous.swiper-2.1.min.js"></script>
<script>
var mySwiper = new Swiper('.swiper-container',{
  pagination: '.pagination',
  paginationClickable: true,
  slidesPerView: 'auto'
})
</script>

在脚本中添加循环参数并没有达到我想要的效果，例如

var mySwiper = new Swiper('.swiper-container',{
  pagination: '.pagination',
  paginationClickable: true,
  slidesPerView: 'auto',
  loop: true
})

或

var mySwiper = new Swiper('.swiper-container',{
  slidesPerView: 'auto',
  loop: true
})

由于

iDangerous Swiper-不同的宽度与循环问题

0 个答案: