swiper 用了loop后出现空白页
<div class="swiper-container" style=" style="width:100%;height: 300px;">
<div class="swiper-wrapper">
<div class="swiper-slide">
<img v-bind:src="Covers1" style="width:100%;height=100%;" />
</div>
<div class="swiper-slide">
<img v-bind:src="Covers2" style="width:100%;height=100%;" />
</div>
<div class="swiper-slide">
<img v-bind:src="Covers3" c style="width:100%;height=100%;" />
</div>
</div>
<div class="swiper-pagination"></div>
</div>
window.onload = function() {
var swiper = new Swiper('.swiper-container', {
pagination : '.swiper-pagination',
loop:true,
});
}
有3张图片的轮播,loop为false时能正常轮播,但当把loop改为true时,从第一张切换最后一张或者从最后一张切换到第一张时都会出现一张空白页?这种情况怎么解决呢?
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
发布评论
评论(4)
我很OK2022-09-12 23:01:19
上面那段div改为这样。
<div class="swiper-container" style=" style="width:100%;height: 300px;">
<div class="swiper-wrapper">
<div class="swiper-slide" style="background-image:***;...">
</div>
<div class="swiper-slide" style="background-image:***;...">
</div>
<div class="swiper-slide" style="background-image:***;...">
</div>
</div>
<div class="swiper-pagination"></div>
</div>
~没有更多了~
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
试试将pagination放在外边