查看: 1652|回复: 0
打印 上一主题 下一主题

swiper跟canvas的冲突 求解

[复制链接]

该用户从未签到

1

主题

2

帖子

9

积分

新手上路

Rank: 1

积分
9
跳转到指定楼层
楼主
发表于 2020-8-31 19:27:07 | 只看该作者 回帖奖励 |倒序浏览 |阅读模式
canvas 动画,swiper正常轮播的时候不执行,反向就可以ca1()
ca2()
canvas
counTo也能正常运行
       var mySwiper = new Swiper('.swiper-container-i4', {
            loop: true,
            on: {
                slideChangeTransitionEnd: function () {
                    if (this.realIndex == 0) {
                        ca1()
                        ca2()
                        $(".swiper-slide-i4-1 .b-list li span").countTo({
                            lastSymbol: " ", //显示在最后的字符
                            from: 0, // 开始时的数字
                            speed: 2000, // 总时间
                            refreshInterval: 100, // 刷新一次的时间
                            beforeSize: 0, //小数点前最小显示位数,不足的话用0代替
                            decimals: 0, // 小数点后的位数,小数做四舍五入
                            onUpdate: function () { }, // 更新时回调函数
                            onComplete: function () {
                                for (i in arguments) {
                                    //console.log(arguments);
                                }
                            }
                        });
                    }
                    if (this.realIndex == 1) {
                        $(".swiper-slide-i4-2 .list1 li span").countTo({
                            lastSymbol: " ", //显示在最后的字符
                            from: 0, // 开始时的数字
                            speed: 2000, // 总时间
                            refreshInterval: 100, // 刷新一次的时间
                            beforeSize: 0, //小数点前最小显示位数,不足的话用0代替
                            decimals: 0, // 小数点后的位数,小数做四舍五入
                            onUpdate: function () { }, // 更新时回调函数
                            onComplete: function () {
                                for (i in arguments) {
                                    //console.log(arguments);
                                }
                            }
                        });
                    }
                },

            },
            effect: 'fade',
            navigation: {
                nextEl: '.swiper-button-next-i4',
                prevEl: '.swiper-button-prev-i4',
            },
            observer: true, //修改swiper自己或子元素时,自动初始化swiper
            observeParents: true, //修改swiper的父元素时,自动初始化swiper
        });


分享到:  QQ好友和群QQ好友和群 QQ空间QQ空间 腾讯微博腾讯微博 腾讯朋友腾讯朋友
收藏收藏 分享分享 分享淘帖
回复

使用道具 举报

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

本版积分规则

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

GMT+8, 2024-11-22 07:02 , Processed in 0.102287 second(s), 26 queries .

Powered by Discuz! X3.2

© 2001-2013 Comsenz Inc.

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