1、css

.swiper-slide {

    overflow: auto;
}

2、js

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);

完美解决

swiper插件 纵向内容超出一屏解决办法的更多相关文章

  1. CentOS7安装vncserver(启动失败及连接黑屏解决办法)

    CentOS7安装vncserver(启动失败及连接黑屏解决办法) 转载weixin_34167043 最后发布于2017-11-09 15:11:00 阅读数 42  收藏 展开 AutoSAR入门 ...

  2. Mac开机黑屏解决办法

    开机黑屏问题 *:first-child { margin-top: 0 !important; } body > *:last-child { margin-bottom: 0 !import ...

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

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

  4. ubuntu16.04命令行模式黑屏解决办法

    ubuntu16.04命令行模式黑屏解决办法 问题描述 在ubuntu上装Nvidia的显卡驱动,需要关闭图形界面才能安装驱动,但是,出现如下情况: 使用“ctrl+alt+F1”命令进入命令行界面是 ...

  5. X5内核浏览器video自动全屏解决办法-canvas

    最近在做手机端上面播放视频的项目,但是在安卓上面,video的播放是脱离页面,置于最顶层的,所以带来了很多问题,为了解决这个问题,查看了多方资料,写了下面简单的demo,方便以后使用. 下面就是运用c ...

  6. 遨游maxthon打开页面一片黑色,百度地图等黑屏解决办法

    遨游maxthon使用webkit极速核心,打开百度地图等页面一片黑色,黑屏了. 找了好久,不知道什么问题. 版本一样,都是4.4.xxx版本.另外一台机器又正常. 后来上傲游社区,好多人也有这个问题 ...

  7. thinkcentre m8380t黑屏 解决办法

    问题: 开机后,显示器上显示“无信号输入”,一直黑屏,但是主机的风扇.硬盘声音都正常. 解决办法: 把vga线等加紧了一些,屏幕还是不亮,然后我关掉插排电源,给cmos放了电,再重启就可以了. 这时需 ...

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

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

  9. postman插件部分Header设置无效的解决办法

    在使用chrome的postman插件模拟http请求的时候,碰到了设置的部分Headers无效的问题,比如说Referer设置后就无效,经过查询发现了问题原因,原因的具体说明参考postman官网的 ...

随机推荐

  1. 非旋treap模板

    bzoj3580 非旋转treap 在大神教导下发现split一段区间时先split右边再split左边比较好写 #include <cstdio> #include <cstdli ...

  2. 订货(bzoj 2424)

    Description 某公司估计市场在第i个月对某产品的需求量为Ui,已知在第i月该产品的订货单价为di,上个月月底未销完的单位产品要付存贮费用m,假定第一月月初的库存量为零,第n月月底的库存量也为 ...

  3. ora 01722无效数字

    SQL语句里面,看看有没有字符串的,没加单引号. 后面经查,发现有字段对比时候,一个是字符串,一个是数值型,使用了ORACLE隐式转换,字符串里面有包含非数字型的,所以导致报错

  4. ***HTML +CSS 总结与归纳

    一.首先W3C标准 结构.表现.动作  与  html.css.javascript相对应,它本意是结构表现分离,而且按照html规范编写结构. 标签方面: -所有标签都要小写.关闭.并且合理嵌套,i ...

  5. Enterprise Achitect使用与类的关系的简单介绍

    本文作为Enterprise Achitect初步使用,另外也是类图基本介绍,是设计模式的基础.  类的关系有泛化(Generalization).实现(Realization).依赖(Depende ...

  6. 在Linux下配置多线路ADSL的方法

    经过一段时间的观察,证明运行良好,现把设置过程及方法总结一下,欢迎指正.此文档可以说明双ADSL及多ADSL增加线路的配置过程. 实验环境: 操作系统: RedHat7.3 两条ADSL,长期观察线路 ...

  7. 批量下载小说网站上的小说(python爬虫)

    随便说点什么 因为在学python,所有自然而然的就掉进了爬虫这个坑里,好吧,主要是因为我觉得爬虫比较酷,才入坑的. 想想看,你可以批量自动的采集互联网上海量的资料数据,是多么令人激动啊! 所以我就被 ...

  8. Myeclipse下的struts2.3.8 配置 保证绝对好用

    转自:http://blog.csdn.net/oxuannishi/article/details/8538386 1.建立web project工程,我的结构如下: 2.这一步非常重要:引入必要的 ...

  9. SQL谜题(加减符号替代)

    问题:将以下字符串”.1.2.3.4.5.6.7.8.9 = 1“中的符号点(.)更改为符号加(+)或符号(-),有多少种方法?请用SQL解决此问题 计算过程: CREATE TABLE #(VAL ...

  10. 用 IIS 实现请求转发

    最近部门要开发一个简单的APP,部分数据是现有项目已经存在的,为了方便维护,希望只提供一个交互的入口,并且协议的规则不变. 基于这个需求,有两套解决方案: 1.用代码将现有的api封装一层,对请求数据 ...