遇到这样的情况,一共5张slide,但是从第三个起再往右划就不动了。后来发现是已经初始化swiper后又追加了slide。(大概意思是这样。太久的程序了,也不想仔细捋了)

暂且用到的办法:

先定义好:

var ifInitSwiper = false; var mySwiper;

在获取数据后:

if($(".swiper-container").length>0){
  if(!ifInitSwiper){
    ifInitSwiper = true;
    mySwiper = new Swiper('.swiper-container', { //内部切换
      direction: 'horizontal', //水平显示
      updateOnImagesReady: true,
      // 如果需要分页器
      pagination: '.swiper-pagination', //分页
    })
   }else{
    mySwiper.update();
   }

}

swiper滑动异常的更多相关文章

  1. 在Vue中使用了Swiper ,动态从后台获取数据的之后,swiper滑动失效??

    在Vue中使用了Swiper ,动态从后台获取数据的之后,swiper滑动失效?? 是因为swiper提前初始化了,那时候数据还没有完全出来.这里有两种解决办法 1. 使用vue提供的$nextTic ...

  2. swiper滑动失效问题

    最近在写移动端的项目,页面有用的是swiper滑动的. 但是会发现在滑动时,不灵活,就是滑动时隐藏的数据会显示,但是不滑动数据又在初始那,隐藏的数据还是看不到. 于是各种排除问题,终于在pc端+移动端 ...

  3. Swiper滑动Html5手机浏览器自适应

    手机网页能通过window.screen.height, width获取屏幕分辨率,于是能够通过分辨率比率来计算高度. window.onload=function(){ var swiper = d ...

  4. Swiper 滑动

    1.http://www.swiper.com.cn/download/  下载Swiper.JS  Swiper.CSS 2.引入项目,添加html <div class="cont ...

  5. swiper 滑动插件,小屏单个显示滑动,大屏全部显示

    var currSwiperIndex=0; function widthHandle(){ var level = widthLevel(); if(level==1){ //单个显示,滑动 if( ...

  6. Swiper 滑动切换图片(可用于PC端,移动端)

    作为一名后端的普通程序猿, 你让我搞这种前端不是跟我玩命吗,所以用插件来搞,省事又简单,而且Swiper使用又简单是吧: 头皮发麻,不喜欢说废话,我更喜欢直接看到效果: 按Swiper官方文档来说, ...

  7. viewpager 无网络的时候滑动异常

    不知道大家有没有遇到过这种情况,就是框架是viewpager+fragment的架构.然后呢,fragment里面是webview.一般情况下,当没有网的时候,webviwe会说什么找不到网页,然后很 ...

  8. swiper 滑动获取当前第几页下标

  9. swiper、fullPage、hammer几种滑动插件对比

    1.使用hammer,自己实现滑动垂直切换页面 <!DOCTYPE html> <html lang="en"> <head> <titl ...

  10. swiper 实现滑动解锁

    最近项目中有这样一个需求,研究了两种写法一个原生,一个使用框架 原生写法: <!DOCTYPE html> <html> <head> <meta chars ...

随机推荐

  1. 运维、监控、AIOps的几个重要观点

    监控是整个运维乃至整个产品生命周期中最重要的一环,通过配置合理的告警机制,采集准确的监控指标,来提前或者尽早发现问题,解决问题,进而保证产品的稳定,提升用户的体验.『分布式实验室』特约记者艾尔斯兰(下 ...

  2. MySql索引下推知识分享

    作者:刘邓忠 Mysql 是大家最常用的数据库,下面为大家带来 mysql 索引下推知识点的分享,以便巩固 mysql 基础知识,如有错误,还请各位大佬们指正. 1 什么是索引下推 索引下推 (Ind ...

  3. Web初级——html常用标签归类

    标签分类 基础标签 <!DOCTPYE> 定义文档类型 <html> 定义html文档</html> <title>定义网页标题</title&g ...

  4. 《Effective C++》资源管理章节

    Item 13:以对象管理资源 关键的两个想法(这种方式其实在很多地方都可以看出影子,比如managing pool的模型): 1.获得资源后立刻放入管理对象(managing object):以对象 ...

  5. Java 进阶P-6.6+P-7.1

    接口设计模式 接口 接口是纯抽象类 所有的成员函数都是抽象函数 所有的成员变量都是public static final 接规定了长什么样,但是不管里面有什么 实现接口 类用extends,接口用im ...

  6. 10月31日ATM编写逻辑描述

    目录 ATM逻辑描述 三层框架简介 1.第一层(src.py) 2.第二层(interface文件夹下内容) 3.第三层(db_hanlder) 启动函数 用户注册功能 用户登录 common中的小功 ...

  7. Vue34 VueX

    1 简介 Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式 + 库.它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化. vue官方搭配,专属使用 ...

  8. *已解决 Javawe中servlet时出现空白页面,但又网站不报错的问题追溯(编码

    本次随笔内容为在学习过程中遇到问题不断排问题,不断查资料解决的过程,小菜鸟学习~相互交流(菜鸟互啄~) 遇到问题: Javawe中servlet时出现空白页面,但又网站不报错的问题追溯 解决: 1.t ...

  9. Debug时使用热部署修改代码

    今晚Debug的时候,一些语句怎么也不能debug,F8步过以下跳好多行,看起来很烦人.原来是有些行无法进入debug断点. 是因为Debug之前Tomcat已经编译Class文件,当插入注释/修改代 ...

  10. 使用java.util.Timer实现定时任务,详解Thread.sleep() in a loop, probably busy-waiting问题

    很多时候,我们需要定时任务实现一些诸如刷新,心跳,保活等功能.这些定时任务往往逻辑很简单,使用定时任务的框架(例如springboot @Scheduled)往往大材小用. 下面是一个定时任务的典型写 ...