zoukankan      html  css  js  c++  java
  • swiper页面刷新布局和指示点错乱

    swiper轮播时,用到定时请求后台数据的场景,造成页面刷新时轮播图的指示点和轮播内容错乱。

    解决方法是:

    声明一个全局变量,轮播时进行销毁  这里我是把轮播为方法

    var mySwiper = 0; 
                   function play(){
                                if (mySwiper !== 0) {
                                    mySwiper.destroy();
                                }
                                mySwiper = new Swiper('.swiper-container', {
                                    observer: true,
                                    observeParents: true,
                                    // direction: 'vertical', // 垂直切换选项
                                    loop: true, // 循环模式选项
                                    autoplay: {
                                        delay: 3000,
                                        stopOnLastSlide: false,
                                        disableOnInteraction: false,
                                    },
                                    pagination: {
                                        el: '.swiper-pagination',
                                        clickable: true
                                    },
                                    // 如果需要前进后退按钮
                                    navigation: {
                                        nextEl: '.next',
                                        prevEl: '.prev'
                                    },
                                })
                            }
  • 相关阅读:
    冲刺会议第七天
    冲刺会议第六天
    冲刺会议第五天
    冲刺会议第四天
    题目
    关于小程序开发者和体验者的数据请求问题
    focus、blur事件的事件委托处理(兼容各个流浏览器)
    收集的一些技术论坛博客
    ios下fixed回复框bug的解决方案
    jQuery的13个优点
  • 原文地址:https://www.cnblogs.com/shiraly/p/13139823.html
Copyright © 2011-2022 走看看