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

查看数: 39432 | 评论数: 10 | 收藏 0
关灯 | 提示:支持键盘翻页<-左 右->
    组图打开中,请稍候......
发布时间: 2017-7-31 22:09

正文摘要:

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值
zuzhichanglely 发表于 2020-2-9 15:06:14
贴合的图片在不同的数量下,有时候会出现1px的 缝隙,直接把图片赋给swiper-slide标签上就可以了;
小白一枚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,
          },
        });

第一个就是,第二个是间距
Raymondjay 发表于 2018-11-5 09:22:35
宽度自适应的话 应该怎么做呢,
var swiper = new Swiper('.swiper-container', {
    slidesPerView: 'auto',
    spaceBetween: 0,
    freeMode: true,
   
  });
这样虽然自适应 但是不能滑动了
飞尽堂前燕 发表于 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,//这里可以设置小数,不过需要自己做调整了
        })
                               
曹宇的swiper 发表于 2018-8-30 14:52:07
这个好像不太好用, swiper3可以 2不可以, 2可以兼容IE78  头疼
chenbaixu123 发表于 2018-8-20 21:11:27
设定slide与左边框的预设偏移量(单位px)。

slidesOffsetBefore

<script language="javascript">
var mySwiper = new Swiper('.swiper-container',{
slidesOffsetBefore : 100,
})
</script>
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呢? 我没找到
kerwin_swiper 发表于 2018-6-14 16:17:59
楼上是 3 的用法,2呢?

Archiver|手机版|小黑屋|Swiper中文网 ( 粤ICP备15001020号

GMT+8, 2024-11-27 16:23 , Processed in 0.070028 second(s), 32 queries .

Powered by Discuz! X3.2

© 2001-2013 Comsenz Inc.

快速回复 返回顶部 返回列表