原文:

地址:http://hao.jser.com/archive/8030/

作者:segmentfault

问题:

动态循环生成swiper-slide类,在swiper-wrapper里生成6个以上的滑动页,可是就是划不到第二页。

解决:

在查阅Swiper的API时发现,有这样两个参数:observerobserveParents,前者启动动态检查器,当改变swiper的样式(例如隐藏/显示)或者修改swiper的子元素时,自动初始化swiper。后者原理和前者一样,只是将observe应用于Swiper的父元素。两者默认值都为false
所以在原来的swiper初始化代码中加上这两行即可。

var mySwiper = new Swiper('.swiper-container',{
pagination : '.swiper-pagination',
paginationClickable: true,
longSwipesRatio: 0.3,
touchRatio:1,
observer:true,//修改swiper自己或子元素时,自动初始化swiper
observeParents:true,//修改swiper的父元素时,自动初始化swiper
})

动态模板中 SWIPER 划不动问题的更多相关文章

  1. 走进AngularJs(二) ng模板中常用指令的使用方式

    通过使用模板,我们可以把model和controller中的数据组装起来呈现给浏览器,还可以通过数据绑定,实时更新视图,让我们的页面变成动态的.ng的模板真是让我爱不释手.学习ng道路还很漫长,从模板 ...

  2. vert.x学习(六),动态模板与静态文件的结合

    这篇学习在动态模板里面引入css,把动态模板与静态文件结合起来使用. 编写DynamicReference.java package com.javafm.vertx.helloworld; impo ...

  3. 迷你MVVM框架 avalonjs 沉思录 第3节 动态模板

    模板的发明是编程史上的一大里程碑,让我们摆脱了烦锁且易出错的字符串拼接,维护性大大提高. 都在JSP,ASP时代,人们已经学会使用include等语句,将多个页面片断拼接成一个页面. 此外,为了将数据 ...

  4. 模板中的 TemplateBinding 问题

    昨天一个朋友向我求助一个自定义水印控件绑定的问题,问题出在文本框中输入的文本,不能绑定到 相应的依赖属性上(自定义的依赖属性 PassText),他纠结了很久找不出问题所在.问题帮他解决后,这里稍 做 ...

  5. elasticsearch 动态模板

    在elasticsearch中,如果你有一类相似的数据字段,想要统一设置其映射,就可以用到一项功能:动态模板映射(dynamic_templates). 每个模板都有一个名字用于描述这个模板的用途,一 ...

  6. Logstash动态模板映射收集Nginx的Json格式日志

    Logstash传输给ES的数据会自动映射为5索引,5备份,字段都为text的的索引.这样基本上无法进行数据分析.所以必须将Logstash的数据按照既定的格式存储在ES中,这时候就要使用到ES模板技 ...

  7. Elasticsearch7.X 入门学习第八课笔记-----索引模板和动态模板

    原文:Elasticsearch7.X 入门学习第八课笔记-----索引模板和动态模板 版权声明:本文为博主原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明. 本文链接: ...

  8. 使用FreeMarker配置动态模板

    FreeMarker动态模板 目录 FreeMarker动态模板 前言 准备工作 FreeMarker 代码构建 项目结构 创建 Configuration 实例 调用 模板文件 调用结果 Tips ...

  9. ThinkPHP+Smarty模板中截取包含中英文混合的字符串乱码的解决方案

    好几天没写博客了,其实有好多需要总结的,因为最近一直在忙着做项目,但是困惑了几天的Smarty模板中截取包含中英文混合的字符串乱码的问题,终于解决了,所以记录下来,需要的朋友看一下: 出现乱码的原因: ...

随机推荐

  1. Java之累加和

    所谓累加算法,就是数学中数列求的算法,这都是司空见惯了的.下面我们用java求: package com.cdp.leijiahe; import java.util.Scanner; public ...

  2. log4Net 简单配置实用

    <configSections> <section name="log4net" type="log4net.Config.Log4NetConfigu ...

  3. Google Play支付校验

    关于Google Play支付校验我之前在网上也找过大量的相关资料,发现大多数都是采用publicKey的方式来校验订单,但是在Google Play提供的官方实例中publicKey其实在客户端也是 ...

  4. Cocos2d-x坐标系介绍

    在图形图像和游戏应用开发中坐标系是非常重要的,我们在Android和iOS等平台应用开发的时候使用的二维坐标系它的原点是在左上角的.而在Cocos2d-x坐标系中它原点是在左下角的,而且Cocos2d ...

  5. Apple Watch开发之界面之间的正向传值

    主要分两种,一种是故事板中通过segue进行的传值,第二种是使用代码. 贴代码 24行代码是代码进行传值 35是故事板中的

  6. Java关键字及其作用

    Java关键字及其作用 一. 关键字总览 访问控制 private protected public             类,方法和变量修饰符 abstract class extends fin ...

  7. UI3_ViewController初步

    // // AppDelegate.m // UI3_ViewController初步 // // Created by zhangxueming on 15/6/30. // Copyright ( ...

  8. 用java发送email邮件例子

    package com.hzk.mail; import java.net.MalformedURLException; import java.net.URL; import java.text.S ...

  9. 解决IE8打开默认弹出开发者工具的问题

    有一次开发用ie调试后再次打开总是自动弹出ie开发者工具,而且在网页的上一层弹出.点击X关闭后再次打开还是会弹出! 找ie的设置也没有找到关闭的选项. 在网上搜了很多资料才找到解决的办法,在这里分享一 ...

  10. CSS制作彩虹效果

    今天看到一篇文章,说到margin的塌陷的问题,并提供了好几个例子. 自己之前还没怎么遇到过这个问题,正好来研究一下. <div class="box1"></d ...