在移动端使用swiper的整屏滚动,如果slide里面有滚动内容的话,滚动的时候会整个页面一起滚动,如果想里面的滚动区域单独滚动的话,可以在初始化swiper的时候添加上 noSwipingClass 这个选项,值就是你想滚动的那个区域的class。

new Swiper('#Jswiper', {
direction: 'vertical',
noSwipingClass : 'scroll-wrap',
}

参考链接:http://caibaojian.com/swiper-iscroll.html

swiper 插件里面嵌套可滚动内容的更多相关文章

  1. 移动端网站的内容触摸滑动-Swiper插件

    手机平板等大多移动端站点都会有触摸滑动内容的功能,公司移动端站点(m.muzhiwan.com)的标题广告滑动以及轮播效果就是用的Swiper插件. Swiper就是常用于移动端网站的内容触摸滑动的一 ...

  2. 非常优秀的swiper插件————幻灯片播放、图片轮播

    http://www.idangero.us/ http://www.swiper.com.cn/ Swiper中文网 2015-10-15 SuperSlide2: (这是个PC用的滚屏插件,看着不 ...

  3. swiper插件几个容易忽略的地方

    以下内容为swiper4版本的 1.在我们用swiper插件做轮播的当我们左右滑动后会出现自动轮播停止了 此时我们需要在autoplay中 加上这个属性 autoplay:{ delay:1000, ...

  4. 实战:vue项目中导入swiper插件

    版本选择 swiper是个常用的插件,现在已经迭代到了第四代:swiper4.常用的版本是swiper3和swiper4,我选择的是swiper3. 安装 安装swiper3的最新版本3.4.2: n ...

  5. qrcode.js插件将你的内容转换成二维码格式

    ---qrcode.js插件将你的内容转换成二维码格式--- 我之前一直想知道二维码是怎么生成,所以就了解了一下, 最后还是不知道它的原理, 但是,我知道怎么生成. 现在就让我带你制作一个你喜爱的二维 ...

  6. swiper插件的简单使用,实现图片轮播

    移动端和p c端经常会遇到写轮播图的情况,这里只是简单的说一下swiper插件的简单用法(移动端为例). <!DOCTYPE html> <html lang="en&qu ...

  7. swiper插件遇上tab切换

    当swiper插件遇到tab切换,即display的显示与否属性时,失效,方法如下: <script language="javascript"> var mySwip ...

  8. ionic3 使用swiper插件 实现轮播效果

    由于app的更新迭代 我需要完成新版本设计图的开发 刚开始就遇到一个问题  首页的banner图需要实现某种效果 而ionic3自带的轮播图效果怎么改都改不到我想要的效果 效果图如下  自动播放 不断 ...

  9. 【react开发】使用swiper插件,loop:true时产生的问题解决方案

    这2天上班遇到的问题:react使用swiper3插件实现banner轮播,其中有个banner图有个click点击事件,而其他的是页面跳转.出现了一个问题: 就是向右滑动到该帧时的swiper,点击 ...

随机推荐

  1. 《人月神话》读书笔记 PB16110698 第七周(~4.19)

    每逢读书笔记上交作业时刻,班级blog页面上总能看到<人月神话>相关的读书笔记,本次软工课邓老师推荐的第一篇读书笔记也是写的<人月神话>,算是对它“耳濡目染”了.本周,我终于抽 ...

  2. item字母问题

    解决方法:复写toString方法 @Override public String toString() { return this.getBookTypeName(); } 将对象的toString ...

  3. PHP算法之回文数

    判断一个整数是否是回文数.回文数是指正序(从左向右)和倒序(从右向左)读都是一样的整数. 示例 1: 输入: 121输出: true示例 2: 输入: -121输出: false解释: 从左向右读, ...

  4. CF822F Madness

    题意:给你一棵边权都为1的树,要求选择互不相交的若干条路径,这些路径包含有所有点. 在每一条路径上选择一条边,放置一个动点,设置一个方向,它开始在该路径上来回运动,速度为1.每个点上都有一个停表,当有 ...

  5. [转]Nginx配置详解

    Nginx是lgor Sysoev为俄罗斯访问量第二的rambler.ru站点设计开发的.从2004年发布至今,凭借开源的力量,已经接近成熟与完善. Nginx功能丰富,可作为HTTP服务器,也可作为 ...

  6. div中内容可左右上下滑动

    在<table>外套一层<div>,并且声明overflow:scroll属性,如: <div style="width:1620px;height:680px ...

  7. 长链接生成短链接Java源码(调用百度接口)

    public static DefaultHttpClient httpclient; static { httpclient = new DefaultHttpClient(); //httpcli ...

  8. 新金融ABS如何做?听听这几十家券商、互金高管的经验之谈

    新金融ABS如何做?听听这几十家券商.互金高管的经验之谈 2016-11-24 零壹财经 ID:36104743 时间:2016年11月初 地点:北京东城区南湾子3号院(场地提供方:无讼.天同律师事务 ...

  9. 修改sql server表字段的字符串

    网站标题被注入黑链接,使用sql脚本update修改字段内的字符串截取UPDATE [qds0460132_db].[dbo].[Blood_News]   SET [Blood_Name] = SU ...

  10. HDU-1698-Just a Hook-区间更新+线段树成段更新

    In the game of DotA, Pudge’s meat hook is actually the most horrible thing for most of the heroes. T ...