swiper.js在隱藏/顯示切換時,輪播出現bug的解決辦法


swiper在 swiper-container正常狀態下顯示,輪播是沒有問題,但是當 swiper-container由隱藏切換至顯示時(比如做圖片查看時)會出現滑動bug,滑動卡頓而且最后一張可以移出可視區域,

出現問題的原因是分頁器沒有更新,所以要監控分頁器的狀態,官方提供一個屬性 observe(observeParents)默認值false,修改為true即可,在切換container顯示隱藏時便會回歸正常。

這個問題官網提供了解決的方法,只需要設置一個屬性就行,代碼如下:

var mySwiper = new Swiper('.swiper-container', {                   
      observer:true,//啟動動態檢查器,當改變swiper的樣式(例如隱藏/顯示)或者修改swiper的子元素時,自動初始化swiper                  
                    
})

官方鏈接:http://3.swiper.com.cn/api/Observer/2015/0308/218.html


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM