为了账号安全,请及时绑定邮箱和手机立即绑定

swiper.js在内容高度小于屏幕高度的时候设置autoHeight不好用

swiper.js在内容高度小于屏幕高度的时候设置autoHeight不好用

四季花海 2018-11-16 14:11:30
使用swiper.js实现选卡项切换切换 但是各个选卡项的高度是不一样的 数据也是异步加载进去的为了swiper-container自适应高度 设置了autoHeight:true 但是发现当内容高度<屏幕高度的时候这个属性就不起作用了 通过js设置改变了 但是仍能向下滑动空白区域请问怎么解决
查看完整描述

1 回答

?
qq_遁去的一_1

TA贡献1725条经验 获得超7个赞

我之前也遇到过这个问题,因为swiper容器是个div盒子,所以会按各个子tab中高度最大的,作为自己的高度。所以只用css不行哦,要加点js判断。

解决方法:
1.首先监听tab切换事件的回调,在tab切换完成以后,获取当前tab内容的高度,然后js把外面的swiper容器设置成当前内容高度。
2.其次动态内容加载完成以后,原理也一样,也去手动获取内容高度,然后设置外面容器的height为当前内容高度。

具体代码不在身边,可以迟点贴给你,不过思路有了,相信你肯定可以实现出来的哦!


查看完整回答
反对 回复 2018-12-07
  • 1 回答
  • 0 关注
  • 1488 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信