在页面上显示一个遮罩层,这是非常常见的操作,在遮罩层上操作,下层也会默认跟随手指滚动

此处就是要在显示遮罩的时候禁止下层滚动。

首先设置一个全局变量

var canScroll=false;

页面初始化的时候添加事件监听

document.addEventListener('touchmove',function(e){
            if(!canScroll){
                e.preventDefault()
            }
        })

下面只要设置canScroll这个变量就可以控制页面是否跟随手指滚动了

H5页面遮罩弹框下层还能滚动的问题的更多相关文章

  1. js+css jQuery实现页面后退执行 & 遮罩弹框

    JS部分 <script src="http://libs.baidu.com/jquery/2.0.0/jquery.js"></script> < ...

  2. iOS bug 之 H5 页面没有弹出提示框

    描述:在安卓上有提示框,但是在iOS上没有提示框. step 1: 失误,是我没有在正确的位置设置网址. step 2: 修改之后,测试页能弹出提示框,但是正式的页面没有提示框. step 3: 我输 ...

  3. ionic2.1.0 --beta3版本新建页面做弹框时遇到的问题

    新建的页面需要在app.module.ts文件中定义.不然制作页面弹出效果是会报错.

  4. css+JS实现遮罩弹框

    <!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta nam ...

  5. div遮罩弹框口

    <html> <head> <meta http-equiv="Content-Type" content="text/html; char ...

  6. js页面的弹框怎么关闭啊

    1.单纯的关闭window.opener.location.reload(); //刷新父窗口中的网页window.close();//关闭当前窗窗口2.提交后关闭 function save(){d ...

  7. 利用layer实现MVC页面数据互交提示弹框

    需求说明: 一个表单页面,点击提交之后,进入后台进行一系列数据交互,然后将交互信息返回至页面中,并以弹框形式展示 应用场景: 添加.修改.删除数据后,返回数据操作是否成功,以及一些其他信息 前期准备: ...

  8. 移动端ios升级到11及以上时,手机弹框输入光标出现错位问题

    引起原因:弹框的定位采取position:fixed,而ios(safari)对定位属性position:fixed的解析不一致导致. 解决方案: 方案一 一开始上网找解决方案,找到如下处理方式.但存 ...

  9. 阻止微信浏览器/QQ浏览器长按弹框“在浏览器打开”

    这个弹框实际上等同于PC环境下的鼠标右键的弹框,因此只要禁止页面的弹框事件就能完美屏蔽该弹框对我们功能带来的影响.程序代码如下: document.oncontextmenu=function(e){ ...

随机推荐

  1. Unity新版本VR以及SteamVR基础

    一.Unity2018新版本VR Unity 简单VRDemo搭建 Unity环境搭建: PlayerSetting设置如下: 启动虚拟现实驱动,sdk选择OpenVR.HTC  Vive只支持Ope ...

  2. Unity扩展编辑器二

    Unity支持自行创建窗口,也支持自定义窗口布局,在Project视图中创建一个Editor文件夹,在文件夹中创建一条脚本 自定义窗口需要让脚本继承EditorWindow在设置MenuItem,此时 ...

  3. python3安装与环境配置和pip的基本使用

    本文环境 系统: Windows10 Python版本: 3.6 安装 python安装包下载 可以选择安装版和解压版 安装版一键安装, 安装过程注意选择安装位置, xx To Path选项(勾选), ...

  4. 微信小程序自定义 tabbar

    一定的需求情况下,无法使用小程序原生的 tabbar 的时候,需要自行实现一个和 tabbar 功能一模一样的自制组件. 查阅了海量的博客和文档之后,亲自踩坑.总结了三种在不使用微信小程序原生 tab ...

  5. 使用cors解决跨域遇到浏览器发出options嗅探

    前言: 本地开发起的服务器,通过修改hosts文件设置域名映射到本地,接口在测试环境 1. 服务器端设置cors, 配置access-control-allow-origin 头部 使用蚂蚁金服的up ...

  6. "prefs:root" or "App-Prefs:root"

    iOS 苹果审核也是看心情的吗?已经上线几个版本了,新版本提交审核居然被查出来了! Guideline 2.5.1 - Performance - Software Requirements Your ...

  7. HTML基础学习总结

    一.HTML的一些基本描述 全称:Hyper Text Markup Language 定义:超文本标记语言,是标记语言而不是编程语言,使用标记标签来描述网页,所以也被称为网页 格式:标签对里面放纯文 ...

  8. 冲刺One之站立会议6 /2015-5-19

    2015-5-19 今天把服务器端的界面完善了一下,然后大家查了好多资料,实现了登陆界面实际连接的功能,开始加了一个它和服务器的的跳转,但是分析过后发现这是个没有必要的跳转.登录应该直接转到聊天室的主 ...

  9. 图文转换NABCD

    作为图文转化还是有很多优点的,在这里我就分析一下它的方便快捷 Need:有些非电子版的文字不方便我们编辑,图文转换可以轻而易举达到目的. Approach:现在技术手段应该还有点难度,应该可以换个方法 ...

  10. Task 1 四则运算

    第一节课作业 1.设计思想:随机产生30道题目,主体是一个for循环,在循环体中加上相应的内容,包括随机数函数得到两个运算数值以及运算符号,再利用switch,case结构输出相应的题目即可. 2.源 ...