swipe.js怎么动态添加滑动元素

 我来答
美少女阿里可多
2018-04-11 · TA获得超过1万个赞
知道小有建树答主
回答量:44
采纳率:100%
帮助的人:5736
展开全部

这个注意看swiper的文档就可以了,可以使用jquery动态添加元素,然后调用swiper的update()方法即可。下面是一个小例子,记得把swiper和jquery引入进来。

Swiper常用于移动端网站的内容触摸滑动。

Swiper是纯javascript打造的滑动特效插件,面向手机、平板电脑等移动终端。

Swiper能实现触屏焦点图、触屏Tab切换、触屏多图切换等常用效果。

Swiper开源、免费、稳定、使用简单、功能强大,是架构移动终端网站的重要选择!

全栈达人老Y
2016-03-27 · TA获得超过1341个赞
知道小有建树答主
回答量:788
采纳率:33%
帮助的人:446万
展开全部

这个注意看swiper的文档就可以了,可以使用jquery动态添加元素,然后调用swiper的update()方法即可。下面是一个小例子,记得把swiper和jquery引入进来

<div id="content">
    <div class="swiper-container" id="swiper-container1" style="height:300px;">
        <div class="swiper-wrapper">
            <div class="swiper-slide blue-slide swiper-slide1">slider1</div>
            <div class="swiper-slide red-slide">slider2</div>
            <div class="swiper-slide orange-slide">slider3</div>
        </div>
        <div class="swiper-pagination">&nbsp;</div>
    </div>
    <div id="contrast">
        <script language="javascript"> 
                var mySwiper = new Swiper('.swiper-container',{
                pagination : '.swiper-pagination',
                })
                setInterval(function(){
                    $(".swiper-wrapper").append('<div class="swiper-slide orange-slide">slider3</div>');
                    mySwiper.update(true);
                },1000);
        </script>
     </div>
 </div>

更多前端知识,请微☆信搜搜"htmlfans"

已赞过 已踩过<
你对这个回答的评价是?
评论 收起
私属8573
2016-05-11
知道答主
回答量:2
采纳率:0%
帮助的人:2649
展开全部
只要在ajax执行结束执行swiper方法就行
var swipertj = $('.swiper-container').swiper({
observer: true,//修改swiper自己或子元素时,自动初始化swiper
observeParents: true,//修改swiper的父元素时,自动初始化swiper
slidesPerView: 3,
spaceBetween: 10,
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
百度网友2571d37bb
2016-03-15 · 知道合伙人软件行家
百度网友2571d37bb
知道合伙人软件行家
采纳数:1971 获赞数:7905
前端工程师

向TA提问 私信TA
展开全部
你直接百度,
就有demo供你参考的。
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
收起 1条折叠回答
收起 更多回答(2)
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式