在使用Swiper组件时,遇到了垂直方向轮播图图片拉不到底的现象,代码如下

1 var verticalSwiper = new Swiper('.verticalSwiper', { 
2     direction: 'vertical',
3     slidesPerView: 'auto',
4     grabCursor: true
5 });

且不设置高度时,垂直轮播图单个slide默认高度占满了整个父容器高度,而我需要slidePerView设置auto时每个slide的高度就是图片的高度,所以初始化时加上

1 var verticalSwiper = new Swiper('.verticalSwiper', { 
2     direction: 'vertical',
3     slidesPerView: 'auto',
4     height: 177,// 这个高度就是每个slide的高度
5     grabCursor: true
6 });

然后就可以拉到底了,而且slide高度不是父元素slide-warpper的高度

 posted on 2020-05-29 15:57  莫得感情的浏览机器  阅读(775)  评论(0)    收藏  举报