swiper.js在隐藏/显示切换时,轮播出现bug的解决办法
swiper在 swiper-container正常状态下显示,轮播是没有问题,但是当 swiper-container由隐藏切换至显示时(比如做图片查看时)会出现滑动bug,滑动卡顿而且最后一张可以移出可视区域,
出现问题的原因是分页器没有更新,所以要监控分页器的状态,官方提供一个属性 observe(observeParents)默认值false,修改为true即可,在切换container显示隐藏时便会回归正常。
这个问题官网提供了解决的方法,只需要设置一个属性就行,代码如下:
var mySwiper = new Swiper('.swiper-container', {
observer:true,//启动动态检查器,当改变swiper的样式(例如隐藏/显示)或者修改swiper的子元素时,自动初始化swiper
})
官方链接:http://3.swiper.com.cn/api/Observer/2015/0308/218.html
swiper.js在隐藏/显示切换时,轮播出现bug的解决办法的更多相关文章
- 【转】Android Fragment中使用SurfaceView切换时闪一下黑屏的解决办法
重构了下之前自己的一个新闻客户端,全部使用了Fragment来进行页面切换,只有一个入口Activity作为程序的启动Activity,其中有一个界面需要调用摄像头识别二维码, 于是就会用到Surfa ...
- springMVC+Mybatis(使用AbstractRoutingDataSource实现多数据源切换时)事务管理未生效的解决办法
业务场景: A.B两个单位,系统部署同一套代码: A.B两系统能相互访问: 要求将数据从A系统同步到B系统,再将反馈信息回发给A: 实际开发情况: 因为系统比较小,最开始设计架构的时候没有考虑到消息互 ...
- [Android Pro] Fragment中使用SurfaceView切换时闪一下黑屏的解决办法
方法一.在Activity的onCreate中添加如下代码 getWindow().setFormat(PixelFormat.TRANSLUCENT); reference to : http:/ ...
- VMware(Caps Lock键)切换大小写作用失效的Bug的解决办法
前言 第一种情况是:进入VMware虚拟机的时候,即使按了Capslock键开启大写,灯虽然亮了,但是,打出来的字母还是小写,没有有任何的效果,根本不能转换成大写. 只有按Shift+字母才能输入大写 ...
- Js实现图片点击切换与轮播
Js实现图片点击切换与轮播 图片点击切换 <!DOCTYPE html> <html> <head> <meta charset="UTF-8&qu ...
- JS图片自动和可控的轮播切换特效
点击这里查看效果:http://hovertree.com/texiao/js/1.htm HTML文件代码如下: <!DOCTYPE html> <html xmlns=" ...
- JS案例之2——cycle元素轮播
元素轮播效果是页面中经常会使用的一种效果.这个例子实现了通过元素的隐藏和显示来表现轮播效果.效果比较简单. 效果图如下: 源代码如下: <!DOCTYPE html> <html&g ...
- jQuery+html5实现的3D动态切换焦点轮播幻灯片
今天爱编程给网友们分享一款基于jQuery+html5实现的3D动态切换焦点轮播幻灯片,支持左右箭头和圆点按钮播放控制,支持多种不同的3D动态切换特效,自适应全屏显示,兼容360.FireFox.Ch ...
- vue.js学习之better-scroll封装的轮播图初始化失败
vue.js学习之better-scroll封装的轮播图初始化失败 问题一:slider组件初始化失败 原因:页面异步获取数据很慢,导致slider初始化之后,数据还未获取到,导致图片还未加载 解决方 ...
随机推荐
- HDU 5355 Cake
HDU 5355 Cake 更新后的代码: 今天又一次做这道题的时候想了非常多种思路 最后最终想出了自觉得完美的思路,结果却超时 真的是感觉自己没救了 最后加了记忆化搜索,AC了 好了先说下思路吧.不 ...
- 64位win7中使用vs2013为python3.4安装pycrypto-2.6.1插件报Unable to find vcvarsall.bat异常解决方式
问题描写叙述: 64位win7中使用vs2013为python3.4.2安装pycrypto-2.6.1插件报Unable to find vcvarsall.bat. 问题分析: 1.源代码分析,查 ...
- 怎样在QML中使用multitouch
在Qt QML中.它能够利用multitouch来做一些我们想做的事情.在今天的文章中.我们将介绍怎样使用multitouch来做一些我们想做的事. 事实上,在QML中利用多点触控是很easy的一件事 ...
- Cocos2d-x 3.0final 终结者系列教程13-贪食蛇游戏案例(全)
快过节了.谢谢了屈原,我们爱你. 应该多几个向屈大人一样跳江的,这样我们就能够放假纪念啦. ---------------------------------快过节了.弄个案例,大家最好还是假期做做, ...
- java,wavToMP3格式转换
这里须要用到一个jar包:jave-1.0.1.jar,下载地址的话自己百度吧. 废话不多说直接贴代码: import it.sauronsoftware.jave.AudioAttributes; ...
- explain 分析
EXPLAIN的结果中,有哪些关键信息值得注意呢? MySQL的EXPLAIN当然和ORACLE的没法比,不过我们从它输出的结果中,也可以得到很多有用的信息. 总的来说,我们只需要关注结果中的几列: ...
- 弗拉特利定律:Illumina怎样缔造基因革命
蕾妮·瓦林特(Renee Valint)的女儿谢尔碧(Shelby)在2000年出生时.看起来虚弱无力,就如同一仅仅耷拉着的布娃娃.谢尔碧学着走路和说话,但学得很慢.错过了儿童发展的重要阶段.到4岁时 ...
- androidstudio集成ijkplayer教程
介绍 ijkplayer是一款非常火的开源视频播放器,android和IOS通用.关于怎么编译怎么导入android Studio中自己的项目,其中坑很多,本篇记录下自己的操作记录.ijkplay ...
- k8s 安装并试用Istio service mesh
本文根据官网的文档整理而成,步骤包括安装istio 0.5.1并创建一个bookinfo的微服务来测试istio的功能. 文中使用的yaml文件可以在kubernetes-handbook的manif ...
- [Javascript] 轻量级的JavaScript日期处理类库xDate使用指南
XDate是一个请谅解的JavaScript的原生Date对象的封装库,提供增强的功能解析,格式化和日期处理.使用起来就和JavaScript自己的对象和方法一样,非常简单. XDate是一个请谅解的 ...