javascript - 关于swpier的问题
本文介绍了javascript - 关于swpier的问题的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
问 题
页面引入swiper,初始状态。
<div class="swiper-wrapper">
<div class="swiper-slide"><img src="images/banner4.jpg" alt="杯子"/></div>
<div class="swiper-slide"><img src="images/banner1.jpg" alt="杯子"/></div>
<div class="swiper-slide"><img src="images/banner2.jpg" alt="杯子"/></div>
<div class="swiper-slide"><img src="images/banner3.jpg" alt="杯子"/></div>
</div>
</div>
<script type="text/javascript">
var mySwiper = new Swiper('.swiper-container',{
loop: true,
autoplay: 3000,
});
</script>
自己没有在这块加任何CSS样式,每个滑块的<img>图片高度都是350px;可是打开页面,每个swiper-slide的height就自动变成2000多px,这是怎么回事啊。
高度2000多px,都把下面内容挤到底部了。
解决方案
检查样式
swiper.min.css
是否引入确定
swiper
父级元素定位问题,是否有脱离文档流图片可以设置一下
img { max-width: 100%; }
更具体问题,需要看过CSS才能知道了,希望以上建议能帮到你
这篇关于javascript - 关于swpier的问题的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文