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. python位运算

    什么是位运算 位运算就是把数字当成二进制来进行计算,位运算有六种:&(与), |(或), ^(异或), ~(非), <<(左移), >>(右移) &(与) &a ...

  2. 使用phpexcel上传下载excel文件

    1. 下载 <?php /** * Created by lonm.shi. * Date: 2012-02-09 * Time: 下午4:54 * To change this templat ...

  3. Git 命令解释优秀博文转摘

    git rebase http://blog.csdn.net/hudashi/article/details/7664631 git merge git reset http://www.cnblo ...

  4. [译]ES6特性

    原文 作用域 使用let/const替代var. var有什么错? var说明的变量会产生作用于提升的概念. ES5: var x = 'outer'; function test(inner) { ...

  5. wordpress网站分类目录怎么排序

    1.插件实现分类目录排序.安装插件My Category Order 启用插件,在控制面板的文章菜单下就出现如下图所示的目录调整选项,可以用鼠标随意拖曳调整目录排列顺序. 2.修改代码完成wordpr ...

  6. luogu P3899 [湖南集训]谈笑风生

    传送门 nmyzd,mgdhls,bnmbzdgdnlql,a,wgttxfs 对于一个点\(a\),点\(b\)只有可能是他的祖先或者在\(a\)子树里 如果点\(b\)是\(a\)祖先,那么答案为 ...

  7. ubuntu 18.04/18.10解决create-react-app:command not found问题

    npm config set prefix /usr/local sudo npm install -g create-react-app create-react-app my-app

  8. mui单选和多选框

    具体见代码: <!doctype html> <html> <head> <meta charset="UTF-8"> <ti ...

  9. vue框架导入百度地图API接口的方法

    百度请求API接口:

  10. linux 开发板上的调试

    1.需要命令 ulimit 进行设置core file size ,  看 core file size. cat /proc/pid/limits,  这个暂时不用 2.需要有gdb命令 , 需要g ...