查看: 545|回复: 0

observer:true,observeParents:true初始化,循环播放初始化会无效

[复制链接]

该用户从未签到

1

主题

2

帖子

7

积分

新手上路

Rank: 1

积分
7
发表于 2019-5-22 09:14:08 | 显示全部楼层 |阅读模式
本帖最后由 愤路的小鸟 于 2019-5-22 09:25 编辑

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no">
    <title>首页</title>
    <link rel="stylesheet" href="swiper/swiper.css">
    <script src="jquery-2.0.0.js"></script>
    <script src="swiper/swiper.js"></script>

</head>
<body style="background: #f6f6f6;">
<h1>observer: true, observeParents: true 初始化不会将loop: true也一起初始化</h1>
<div class="swiper-container" style="height: 210px;">
    <div class="swiper-wrapper" id="slide"></div>
    <div class="swiper-pagination"></div>
</div>


</body>
<script>
    //模拟ajax
    setTimeout(function () {
        var aaa = [
            "http://zxpic.imtt.qq.com/zxpic_imtt/2019/05/21/1130/originalimage/113437_2017788197_1_600_400.jpg",
            "http://zxpic.imtt.qq.com/zxpic_imtt/2019/05/21/1130/originalimage/113437_2017788197_1_600_400.jpg",
            "http://zxpic.imtt.qq.com/zxpic_imtt/2019/05/21/1130/originalimage/113437_2017788197_1_600_400.jpg",
            "http://zxpic.imtt.qq.com/zxpic_imtt/2019/05/21/1130/originalimage/113437_2017788197_1_600_400.jpg",
            "http://zxpic.imtt.qq.com/zxpic_imtt/2019/05/21/1130/originalimage/113437_2017788197_1_600_400.jpg",
            "http://zxpic.imtt.qq.com/zxpic_imtt/2019/05/21/1130/originalimage/113437_2017788197_1_600_400.jpg",
            "http://zxpic.imtt.qq.com/zxpic_imtt/2019/05/21/1130/originalimage/113437_2017788197_1_600_400.jpg",
            "http://zxpic.imtt.qq.com/zxpic_imtt/2019/05/21/1130/originalimage/113437_2017788197_1_600_400.jpg",
        ];
        $("#slide").html(function () {
            var html = '';
            aaa.forEach(function (val) {
                html += "<div class=\"swiper-slide\"><img src=\""+val+"\"></div>"
            });
            return html;
        });
    },3000);

    new Swiper('.swiper-container', {
        loop: true,
        spaceBetween: 30,
        pagination: {
            el: '.swiper-pagination'
        },
        observer: true,//修改swiper自己或子元素时,自动初始化swiper
        observeParents: true //修改swiper的父元素时,自动初始化swiper
    });
</script>
</html>


H5.rar

64.28 KB, 下载次数: 2

标题

回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

Archiver|手机版|小黑屋|Swiper中文网 ( 粤ICP备15001020号

GMT+8, 2020-9-25 08:25 , Processed in 0.090436 second(s), 31 queries .

Powered by Discuz! X3.2

© 2001-2013 Comsenz Inc.

快速回复 返回顶部 返回列表