PC上css控制滚动仅css("overflow","hidden")已足够。

但是，如果在Mobile上还是可以拖动的！所以需要监听touchmove事件。

页面禁止拖动、滚动：

$("html,body").css("overflow","hidden").css("height","100%");

                        document.body.addEventListener('touchmove', self.welcomeShowedListener, false);

恢复页面拖动、滚动：

$("html,body").css("overflow","").css("height","");

                    document.body.removeEventListener('touchmove', detail.welcomeShowedListener, false);

参考：

在移动端设置overflow:hidden为什么页面还能滚？要怎么禁止

移动端的touch事件处理

addEventListener()与removeEventListener() 用法详解

移动端禁止页面拖动 h5禁止拖动页面的更多相关文章

  1. bootsrtap h5 移动版页面 在苹果手机ios滑动上下拉动滚动卡顿问题解决方法

    bootsrtap h5 移动版页面 在苹果手机ios滑动上下拉动滚动卡顿问题解决方法 bootsrtap框架做的h5页面,在android手机下没有卡顿问题,在苹果手机就一直存在这问题,开始毫无头绪 ...

  2. js 禁止右击保存图片，禁止拖拽图片

    禁止鼠标右键保存图片 <img src="" oncontextmenu="return false;"> 禁止鼠标拖动图片 <img src ...

  3. 基于react hooks,zarm组件库配置开发h5表单页面

    最近使用React Hooks结合zarm组件库,基于js对象配置方式开发了大量的h5表单页面.大家都知道h5表单功能无非就是表单数据的收集,验证,提交,回显编辑,通常排列方式也是自上向下一行一列的方 ...

  4. PC端和手机访问调用不同的页面，JS和PHP不同方法

    js方法: var urlqr = location.href;    urlqr = urlqr.replace(/iphoneF_/, "pc")这里写正则替换页面地址 if( ...

  5. HTML，JS禁止鼠标右键、禁止全选、复制、粘贴的方法

    禁止鼠标右键.禁止全选.复制.粘贴: oncontextmenu事件禁用右键菜单: js代码: document.oncontextmenu = function(){ event.returnVal ...

  6. APP中的 H5和原生页面如何分辨、何时使用

    一.APP内嵌H5和原生的区别 1.原生的页面运行速度快,比较流畅. H5页面相对原生的运行性能低,特别是一些动画效果有明显卡顿. 2.H5页面的很多交互都没有原生的好,比如弹层.输入时候的页面滑动 ...

  7. 实现可调整宽高的DIV（左右拖动和上下拖动）

    前言 本例是在React中实现,不过改一改通过原生js也很好实现,另外兼容性也做到了IE9.(IE8讲道理也是可以的). 首先看一下需要实现的需求: 要拖动图中的白色横条调整绿色和蓝色区域的高度,要拖 ...

  8. Hybrid App中原生页面 VS H5页面（分享）

    本文部分转自  http://www.jianshu.com/p/00ff5664e000 现有3类主流APP,分别为:Web App.Hybrid App(混合模式移动应用,Hybrid有“混合的” ...

  9. APP中的 H5和原生页面如何分辨？

    一.APP内嵌H5和原生的区别 1.原生的页面运行速度快,比较流畅.H5页面相对原生的运行性能低,特别是一些动画效果有明显卡顿. 2.H5页面的很多交互都没有原生的好,比如弹层.输入时候的页面滑动 等 ...

随机推荐

  1. Nginx 关闭防火墙

    关闭防火墙 1) 重启后生效  开启: chkconfig iptables on  关闭: chkconfig iptables off    2) 即时生效,重启后失效  开启: service ...

  2. UDF、UDAF、UDTF函数编写

    一.UDF函数编写 1.步骤 1.继承UDF类 2.重写evalute方法 .继承GenericUDF .实现initialize.evaluate.getDisplayString方法 2.案例 实 ...

  3. 剑指offer 1,输入一个字符串,将字符串的空格替换成%20

    剑指offer 1,输入一个字符串,将字符串的空格替换成%20    function replaceSpace(str){      return str.replace(/\s/g,"% ...

  4. AspectJ 切面注解中五种通知注解：@Before、@After、@AfterRunning、@AfterThrowing、@Around

    https://blog.csdn.net/u010502101/article/details/78823056

  5. UVA 220 Othello

    题意:输入n,代表次数,每次输入8*8的棋盘,处理3种命令:①L:打印所有合法操作,②M:放棋子,③Q:打印棋盘然后退出. 思路:①用字符数组存棋盘,整型数组存合法位置. ②查找的方法:当前玩家为cu ...

  6. BZOJ.5093.[Lydsy1711月赛]图的价值(NTT 斯特林数)

    题目链接 对于单独一个点,我们枚举它的度数(有多少条边)来计算它的贡献:\[\sum_{i=0}^{n-1}i^kC_{n-1}^i2^{\frac{(n-2)(n-1)}{2}}\] 每个点是一样的 ...

  7. php 生成随机字符串

    /**     * 获取随机字符串     * @param $lenth     * @return string     */     function getRandStr($lenth = 2 ...

  8. 潭州课堂25班：Ph201805201 django 项目 第二十课 数据库分析设计图 (课堂笔记）

    https://www.dbdesigner.net/

  9. 执行npm run build之后显示空白页面

    最近在学习使用webpack,在项目最后打包过程,执行npm run build之后得到的dist目录放到服务器上打开,显示空白页面,但是标题能正常显示,查看控制台发现是数据位置请求报错,查阅资料后知 ...

  10. BZOJ3070 : [Pa2011]Prime prime power 质数的质数次方

    对于$a^b$,如果$b=2$,那么在$[\sqrt{n},\sqrt{n}+k\log k]$内必定能找到$k$个质数作为$a$. 筛出$n^{\frac{1}{4}}$内的所有质数,暴力枚举所有落 ...