1 前言

移动端网页,发现ios平台的iphone或者ipad,网页可以上下左右移动,而Android版则不会。仅作为记录使用。

2 代码

var mo=function(e){e.preventDefault();};
function stop(){
document.body.style.overflow='hidden';
document.addEventListener("touchmove",mo,{passive:false});//禁止页面滑动
}
//直接默认不让滑动
stop(); /***取消滑动限制***/
function move(){
document.body.style.overflow='';//出现滚动条
document.removeEventListener("touchmove",mo,{passive:false});
}

3 参考

1.移动端禁止页面滑动(有效)

4 扩展

1.js开启和禁止页面滑动

2.webApp中防止页面出现上下滑动的方法(测试无效)

3.移动端上下滑动事件之--坑爹的touch.js

javascript移动端禁止页面滑动的解决方案的更多相关文章

  1. 【移动端】js禁止页面滑动与允许滑动

    禁止页面滑动 通常静止滑动方案:(阻止滑动事件) window.ontouchmove=function(e){ e.preventDefault && e.preventDefaul ...

  2. H5禁止页面滑动/滚动

    禁止页面滚动--完美解决方案,滚动条显示与否,手持设备兼容与否 禁止页面滚动 有三种方法 1,依靠css 将页面 document.documentElement.style.overflow='hi ...

  3. 常见的H5移动端Web页面Bug问题解决方案总汇

    解决jquery ajax调用远程接口的跨域问题 首先,接口必须允许远程调用.这是后端或者运维的事情.你必须保证你得到的一个接口是允许远程调用的.否则,就没啥了. $.ajax({ type:'get ...

  4. 移动端禁止页面拖动 h5禁止拖动页面

    PC上css控制滚动仅css("overflow","hidden")已足够. 但是,如果在Mobile上还是可以拖动的!所以需要监听touchmove事件. ...

  5. 移动端弹出层加遮罩后禁止body滑动

    //实现滚动条无法滚动 var mo=function(e){e.preventDefault();}; /***禁止滑动***/ function stop(){ document.body.sty ...

  6. 移动端H5页面惯性滑动监听

    移动端H5页面惯性滑动监听 在移动端,当你快速滑动有滚动条的页面时,当你手指离开屏幕时,滚动条并不会立即停止,而是会随着"惯性"继续滑动一段距离. 在做项目的过程中,需要监听惯性滑 ...

  7. 移动端web页面滚动不流畅,卡顿闪烁解决方案

    移动端web页面滚动不流畅,卡顿闪烁解决方案   1.ios端的-webkit-overflow-scrolling属性可控制页面滚动效果,设置如下实现惯性滚动和弹性效果: -webkit-overf ...

  8. 用javascript实现禁止页面后退返回上一页的代码

    用javascript实现禁止页面后退返回上一页的代码:  有时候我们需要用户在点击了如下一步的按钮时,页面跳转到了下一个页面,这时想不允许用户返回后退到上一页,可以采用下面的方法:  在需要跳转的页 ...

  9. 移动端vue页面禁止移动/滚动

    当需要在移动端中禁止页面滚动,加入:@touchmove.prevent即可,例子如下 <template> <div @touchmove.prevent> <h3 c ...

随机推荐

  1. linux_添加图标

    sudo gedit /usr/share/applications/Pycharm.desktop [Desktop Entry] Type=Application Name=Pycharm Gen ...

  2. HTTP method constants

    HTTP method constants ngx.HTTP_GET ngx.HTTP_HEAD ngx.HTTP_PUT ngx.HTTP_POST ngx.HTTP_DELETE ngx.HTTP ...

  3. 【八】虚拟机工具 01 jps命令详解

    JPS 名称: jps - Java Virtual Machine Process Status Tool 命令用法: jps [options] [hostid] options:命令选项,用来对 ...

  4. [设计模式] javascript 之 命令模式

    模式定义: [定义]: 将一个请求封装成一个对象,使得你用不同的请求把客户端参数化,对请求排队或者记录请求日志,可以提供命令的撤销和恢复功能. 组成: 调用者(Invoker),命令请求(Comman ...

  5. linux系统下python升级安装

    1.安装gcc gcc-c++ yum install -y gcc gcc-c++ #提前检查是否安装 2.下载python3.5.2安装包 cd /usr/local/src/ wget http ...

  6. 「SHOI2015」(LOJ2038)超能粒子炮・改

    传送门:Here 一句话题意:给定$ t$次询问,每次读入$n,k,$求$ \sum_{i=0}^kC_n^k\ mod\ 2333$, 其中$ t \leq 100000$,$n,k \leq 10 ...

  7. netty长链接保存方案

    架构 client router server zk redis 对于router: 保存客户端和服务器对 redis clientid : serverip & port 对于server ...

  8. renren-security旧版本 分模块 的模块之间关系浅析

    Maven结构,一个父模块 六个子模块 七个pom.xml: \git\renren-security\pom.xml <modules> <module>renren-com ...

  9. Javascript - ExtJs - ToolTip组件

    一个浮动的提示信息组件…… Ext,                               //可选 指定箭头的位置     anchor: 'buttom',                  ...

  10. Javascript - ExtJs - Toolbar - 工具栏

    Toolbar组件 创建工具栏 Toolbar类是一种子组件,它不能独立存在,需要依附在其它组件上面.很多容器组件都具备tbar(顶部工具栏).bbar(底部工具栏)的配置,所以可以像下面那样使用它. ...