javascript – 除非页面调整大小,否则Swiper滑块无法正常工作

前端之家收集整理的这篇文章主要介绍了javascript – 除非页面调整大小,否则Swiper滑块无法正常工作前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

我试图将Swiper插件添加到我的一个页面.我试图实现的是整合在这里获得carousal滑块http://idangero.us/swiper/demos/05-slides-per-view.html

HTML

 

JS

var swiper = new Swiper('.swiper-container',{
        pagination: '.swiper-pagination',slidesPerView: 3,paginationClickable: true,spaceBetween: 30,// Navigation arrows
    nextButton: '.swiper-button-next',prevButton: '.swiper-button-prev',});

当我将它添加到小提琴时它可以工作但是当我添加到我的html页面时,swiper无法工作,直到我打开firebug或调整页面大小(http://vidznet.com/ng1/swiper/swipe.html)我不确定它是否在初始化时发生冲突因为控制台中没有错误.

花了一些时间后,我认为它可能是一个jquery问题,并将编码包装在一个

pagebeforecreate

 $(document).on( "pagebeforecreate","#new_",function( event ) { 

但仍然是一样的,

我还添加了以下代码

swiper.updateContainerSize();

这应该更新容器大小,但仍然无法正常工作.

任何帮助都感激不尽.

最佳答案
使用此代码

swiper.update();

猜你在找的jQuery相关文章