.swiper-slide {
overflow: auto;
}
 
var swiper = new Swiper('.swiper-container', {
direction: 'vertical',autoHeight:true
});
var startScroll, touchStart, touchCurrent;
swiper.slides.on('touchstart', function (e) {
startScroll = this.scrollTop;
touchStart = e.targetTouches[0].pageY;
}, true);
swiper.slides.on('touchmove', function (e) {
touchCurrent = e.targetTouches[0].pageY;
var touchesDiff = touchCurrent - touchStart;
var slide = this;
var onlyScrolling =
( slide.scrollHeight > slide.offsetHeight ) && //allow only when slide is scrollable
(
( touchesDiff < 0 && startScroll === 0 ) || //start from top edge to scroll bottom
( touchesDiff > 0 && startScroll === ( slide.scrollHeight - slide.offsetHeight ) ) || //start from bottom edge to scroll top
( startScroll > 0 && startScroll < ( slide.scrollHeight - slide.offsetHeight ) ) //start from the middle
);
if (onlyScrolling) {
e.stopPropagation();
}
}, true);

  来源:https://github.com/nolimits4web/Swiper/issues/1467

 

swiper 内容超出纵向滚动 解决办法的更多相关文章

  1. 整屏纵向切换超出整屏内容纵向滚动 解决办法-fullpage

    这个问题我也是研究了好久,百度了很多办法,swiper我始终没有找到合适的解决办法,所以我放弃了swiper,改用fullpage. fullpage里面有个scrollOverflow的属性: 并且 ...

  2. swiper插件 纵向内容超出一屏解决办法

    1.css .swiper-slide { overflow: auto; } 2.js var swiper = new Swiper('.swiper-container', { directio ...

  3. HTML中的select下拉框内容显示不全的解决办法

    HTML中的select下拉框内容显示不全的解决办法 今天,我遇到这样一个问题:查询栏中的下拉框中的内容过长,导致部分被覆盖了. 查询了一些资料,有的说用函数控制,有的说用事件控制,有的看不懂,有的实 ...

  4. ScrollView嵌套ListView显示不完全、嵌套TextView不能滚动解决办法

    目录: 一.情景说明 二.最初做法 三.解决办法 一.情景说明 1.情景       最近项目刚好有一个需求,需要在一个界面中用ScrollView嵌套一个滚动的TextView和一个listView ...

  5. bootstrap-table 表头和内容对不齐解决办法

    偶然机会学习bootstrap,表格利用bootstrap-table实现,使用bootstrap-table过程中,发现了一个非常棘手的问题,在ie浏览器中,表格的表头和内容对不齐,特别是列比较多且 ...

  6. ZXing二维码生成在Unity3D中出错,数组超出界限的解决办法

    错误截图: IndexOutOfRangeException: Array index is out of range.ZXing.Color32Renderer.Render (ZXing.Comm ...

  7. duv中内容不换行的解决办法

    <div style='width: 100px;display:block;word-break: break-all;word-wrap: break-word;'> 内容超出div宽 ...

  8. echarts的axisLabel的文字内容过长的解决办法

    通过查找资料学习,我总结了四种解决的办法,不一定是最好的,但是希望能够帮助到需要的童鞋,同时如果大家有什么更好的方法欢迎指导. 方法一:这种方法就是将文本内容转换为字符串数组,然后再按需求换行,需要每 ...

  9. Android SDK Manager无法更新,内容显示不全的解决办法

    最近在初学android开发,在更新SDK的时候遇到了麻烦. 发现Extras文件夹下为空,没有内容,包括sdk列表也不全面,更新也没有反应 解决方法: 1.在SDK Manager下Tools-&g ...

随机推荐

  1. ExtJs Panel 滚动条设置

    设置autoscroll:true同时出现横向和纵向滚动条. 不要设置autoscroll属性,或者autoscroll:false,然后设置bodyStyle : 'overflow-x:hidde ...

  2. 使用Jquery解析Json基础知识

    前言 在WEB数据传输过程中,json是以文本,即字符串的轻量级形式传递的,而客户端一般用JS操作的是接收到的JSON对象,所以,JSON对象和JSON字符串之间的相互转换.JSON数据的解析是关键. ...

  3. 【转】PowerShell入门(七):管道——在命令行上编程

    转至:http://www.cnblogs.com/ceachy/archive/2013/02/22/PowerShell_Pipeline.html 管道对于Shell来说是个化腐朽为神奇的东西, ...

  4. UnicodeDecodeError: 'utf8' codec can't decode byte 0xce in position 47: invalid continuation byte

  5. Asp.net 之Application

    using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.We ...

  6. Unity的旋转-四元数,欧拉角用法简介

    当初弄不明白旋转..居然找不到资料四元数应该用轴角相乘...后来自己摸明白了 通过两种旋转的配合,可以告别世界空间和本地空间矩阵转换了,大大提升效率. 每个轴相乘即可,可以任意轴,无限乘.无万向节锁问 ...

  7. 【SSO单点系列】(3):CAS4.0 登录页验证码的添加

    2016.08.23 更新 注意:这个教程只适合4.0版本的,4.1以及以上的版本的已经不试用了, 后面几篇有人提到过 源码网盘链接更新了下 : 链接: http://pan.baidu.com/s/ ...

  8. JAVA基础知识之JDBC——离线RowSet

    离线RowSet 如果直接使用ResultSet, 程序在得到ResultSet记录之后需要立即使用,否则一旦关闭Connection就不再可用,要解决这种情况要么将ResultSet的结果转换成Ja ...

  9. windows消息和消息队列

    windows消息和消息队列 转自:http://blog.163.com/zhangjie_0303/blog/static/990827062010113062446767/ 与基于MS - DO ...

  10. sourceforge免费空间申请及使用笔记

    sourceforge免费空间申请及使用笔记 sourceforge免费空间安装WordPress博客程序 WordPress博客程序安装文件的上传需要使用工具WinSCP. 你需要在FTP地址填写的 ...