jph99354325 发表于 2017-7-31 22:09:17

swiper-slide 之间的间距 和 宽度如何设置

swiper-slide 之间的间距和 宽度如何设置

菜鸟龙小仙 发表于 2017-8-11 14:55:37

有些问题真心不想回答，API多翻几遍就可以找到答案了：
http://www.swiper.com.cn/api/Slides_grid/2015/0308/198.html。
还有另外一种方法更优：
swiper设置slidesPerView :'auto'，
用样式给swiper-slide设置左右margin值

scriptemmmm 发表于 2017-8-8 17:51:35

同问，有人知道怎么弄吗

kerwin_swiper 发表于 2018-6-14 16:17:59

楼上是 3 的用法，2呢？

kerwin_swiper 发表于 2018-6-14 16:18:25

菜鸟龙小仙 发表于 2017-8-11 14:55
有些问题真心不想回答，API多翻几遍就可以找到答案了：
http://www.swiper.com.cn/api/Slides_grid/2015/03 ...

2呢？ 我没找到

chenbaixu123 发表于 2018-8-20 21:11:27

设定slide与左边框的预设偏移量（单位px）。

slidesOffsetBefore

<script language="javascript">
var mySwiper = new Swiper('.swiper-container',{
slidesOffsetBefore : 100,
})
</script>

曹宇的swiper 发表于 2018-8-30 14:52:07

这个好像不太好用， swiper3可以 2不可以， 2可以兼容IE78头疼

飞尽堂前燕 发表于 2018-9-6 16:31:49

swiper2的话 可以这样(我是一行显示三个的)
css //调整间距
div.swiper-slide-active+div{
    margin: 0px 15px;
}

js
//热门新闻 swiper
var newsSwiper = new Swiper('#newsSwiper', {
          loop: true,
          slidesPerView: 3.08,//这里可以设置小数，不过需要自己做调整了
        })
                               

Raymondjay 发表于 2018-11-5 09:22:35

宽度自适应的话 应该怎么做呢，
var swiper = new Swiper('.swiper-container', {
    slidesPerView: 'auto',
    spaceBetween: 0,
    freeMode: true,
   
});
这样虽然自适应 但是不能滑动了

小白一枚ZZqq 发表于 2020-1-7 15:02:14

var swiper = new Swiper('.swiper-container', {
          slidesPerView: 2,
          spaceBetween: 40,
          centeredSlides: true,
          loop: false,
          pagination: {
            el: '.swiper-pagination',
            clickable: true,
          },
      });

第一个就是，第二个是间距
页: [1] 2
查看完整版本: swiper-slide 之间的间距 和 宽度如何设置