移动端禁止页面拖动 h5禁止拖动页面
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为什么页面还能滚?要怎么禁止
addEventListener()与removeEventListener() 用法详解
移动端禁止页面拖动 h5禁止拖动页面的更多相关文章
- bootsrtap h5 移动版页面 在苹果手机ios滑动上下拉动滚动卡顿问题解决方法
bootsrtap h5 移动版页面 在苹果手机ios滑动上下拉动滚动卡顿问题解决方法 bootsrtap框架做的h5页面,在android手机下没有卡顿问题,在苹果手机就一直存在这问题,开始毫无头绪 ...
- js 禁止右击保存图片,禁止拖拽图片
禁止鼠标右键保存图片 <img src="" oncontextmenu="return false;"> 禁止鼠标拖动图片 <img src ...
- 基于react hooks,zarm组件库配置开发h5表单页面
最近使用React Hooks结合zarm组件库,基于js对象配置方式开发了大量的h5表单页面.大家都知道h5表单功能无非就是表单数据的收集,验证,提交,回显编辑,通常排列方式也是自上向下一行一列的方 ...
- PC端和手机访问调用不同的页面,JS和PHP不同方法
js方法: var urlqr = location.href; urlqr = urlqr.replace(/iphoneF_/, "pc")这里写正则替换页面地址 if( ...
- HTML,JS禁止鼠标右键、禁止全选、复制、粘贴的方法
禁止鼠标右键.禁止全选.复制.粘贴: oncontextmenu事件禁用右键菜单: js代码: document.oncontextmenu = function(){ event.returnVal ...
- APP中的 H5和原生页面如何分辨、何时使用
一.APP内嵌H5和原生的区别 1.原生的页面运行速度快,比较流畅. H5页面相对原生的运行性能低,特别是一些动画效果有明显卡顿. 2.H5页面的很多交互都没有原生的好,比如弹层.输入时候的页面滑动 ...
- 实现可调整宽高的DIV(左右拖动和上下拖动)
前言 本例是在React中实现,不过改一改通过原生js也很好实现,另外兼容性也做到了IE9.(IE8讲道理也是可以的). 首先看一下需要实现的需求: 要拖动图中的白色横条调整绿色和蓝色区域的高度,要拖 ...
- Hybrid App中原生页面 VS H5页面(分享)
本文部分转自 http://www.jianshu.com/p/00ff5664e000 现有3类主流APP,分别为:Web App.Hybrid App(混合模式移动应用,Hybrid有“混合的” ...
- APP中的 H5和原生页面如何分辨?
一.APP内嵌H5和原生的区别 1.原生的页面运行速度快,比较流畅.H5页面相对原生的运行性能低,特别是一些动画效果有明显卡顿. 2.H5页面的很多交互都没有原生的好,比如弹层.输入时候的页面滑动 等 ...
随机推荐
- miniui表格load数据成功后,回调函数,其中setData要用如下方法
init: function () { mini.parse(); this.grid = mini.get("jsDatagrid"); var grid1 = mini.get ...
- hive中的分桶表
桶表也是一种用于优化查询而设计的表类型.创建通表时,指定桶的个数.分桶的依据字段,hive就可以自动将数据分桶存储.查询时只需要遍历一个桶里的数据,或者遍历部分桶,这样就提高了查询效率 ------创 ...
- Booksort POJ - 3460 (IDA*)
Description The Leiden University Library has millions of books. When a student wants to borrow a ce ...
- 移动端滑屏全应用【三】requestAnimationFrame的兼容与使用
首先,传统做动画的方式有以下几种: 1. css的transition过度动画 2. css的animation动画 3. 使用setTimeout或setInterval模拟动画贞(js执行机制决定 ...
- Spring AOP 切面编程实战Demo项目
为什么会有此项目?在某日,我看博客时,看到了讲面向切面编程的内容,之前也知道spring是面向切面编程的,只是自己没有写过相关的代码,于是决定自己写一个test.但是url拦截器从外部看,和AOP有相 ...
- [洛谷P1880][NOI1995]石子合并
区间DP模板题 区间DP模板Code: ;len<=n;len++) { ;i<=*n-;i++) //区间左端点 { ; //区间右端点 for(int k=i;k<j;k++) ...
- 一道颇有难度的JavaScript题
上次分享了一道题,大家反响不错,很开心自己写的东西有人愿意花时间去看,也给了自己莫大的鼓舞,其实做题虽然不比真正的编程,但是也能够让你发现一些你之前没有注意到的语言层面的问题.所以,这次再分享一道稍微 ...
- Codeforces Round #517 (Div. 2)
A #include<queue> #include<cstdio> #include<cstring> #include<algorithm> #de ...
- spy(主席树)
题目链接 题目为某次雅礼集训... 对于\(\max\{a-A_i,\ A_i-a,\ b-B_i,\ B_i-b\}\),令\(x_1=\frac{a+b}{2},\ y_1=\frac{a-b}{ ...
- Mybatis的延迟加载和缓存
1. MyBatis中的延迟加载,也称为懒加载,是指在进行关联查询时,按照设置延迟加载规则推迟对关联对象的select查询.延迟加载可以有效的减少数据库压力. 注意:MyBatis的延迟加 ...