首页 > 其他 > 详细

Swiper 轮播插件 之 动态加载无法滑动

时间:2018-04-02 10:53:19      阅读:224      评论:0      收藏:0      [点我收藏+]

1、原因:轮播图未完全动态加载完成,即初始化

2、方法一:ajax链式编程

$.ajax({
    type: "get",
    url: serviceURL + "/listBanner"
}).done(function(data){
    //动态覆盖轮播图父元素中内容
}).done(function(data){
    new Swiper(.swiper-container, {
        autoplay: true, //可选选项,自动滑动  initialSlide :0,
        pagination: {
            el: .swiper-pagination,
            clickable: true,
        }
    })
});

方法二、Swiper提供方法

new Swiper(.swiper-container, {
    autoplay: true, //可选选项,自动滑动  initialSlide :0,
    observer:true,//修改swiper自己或子元素时,自动初始化swiper
    observeParents:true,//修改swiper的父元素时,自动初始化swiper
    pagination: {
        el: .swiper-pagination,
        clickable: true,
    }
})

 

Swiper 轮播插件 之 动态加载无法滑动

原文:https://www.cnblogs.com/zxguan/p/8690449.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!