1.打开新页面时需要禁止鼠标滚轮,禁止页面滑动;

1
2
3
4
在调用显示层时加上这句js代码就可以了:
document.documentElement.style.overflow = "hidden";
关闭层的时间别忘了在加上这句:
document.documentElement.style.overflow = "scroll";

2.设置滚轮原来位置

var top_temp = $(document).scrollTop()||document.documentElement.scrollTop || document.body.scrollTop;
window.parent.scrollTo(0,top_value);
本文出自 “路漫漫兮” 博客,请务必保留此出处http://wangxin88.blog.51cto.com/3228434/1613296

HTML JS 弹层后底部页面禁止滚动处理的更多相关文章

  1. js 弹层下面的body禁止滚动

    弹窗是一种常见的交互方式,而蒙层是弹窗必不可少的元素,用于隔断页面与弹窗区块,暂时阻断页面的交互.但是,在蒙层元素中滑动的时候,滑到内容的尽头时,再继续滑动,蒙层底部的页面会开始滚动,显然这不是我们想 ...

  2. 微信小程序-06-详解介绍.js 逻辑层文件-注册页面

    上一篇介绍的是 app.js 逻辑层文件中注册程序,对应的每个分页面都会有的 js 文件中 page() 函数注册页面 微信小程序-06-详解介绍.js 逻辑层文件-注册页面 宝典官方文档: http ...

  3. web页面弹出遮罩层,通过js或css禁止蒙层底部页面跟随滚动

    场景概述 弹窗是一种常见的交互方式,而蒙层是弹窗必不可少的元素,用于隔断页面与弹窗区块,暂时阻断页面的交互.但是,在蒙层元素中滑动的时候,滑到内容的尽头时,再继续滑动,蒙层底部的页面会开始滚动,显然这 ...

  4. 移动端和PC端弹出遮罩层后,页面禁止滚动的解决方法及探究

    PC端解决方案 pc端的解决思路就是在弹出遮罩层的时候取消已经存在的滚动条,达到无法滚动的效果. 也就是说给body添加overflow:hidden属性即可,IE6.7下不会生效,需要给html增加 ...

  5. Layer.js弹层的一些简单的使用

    //-----------这里只是简单的做一下记录,没有封装,作为笔记防止忘记了 //----contentMsg 里面是可以传入 HTML代码的 top.layer.alert(contentMsg ...

  6. 弹层,iframe页面

    前台页面: <img src="chb/老玩家 好礼送.jpg" border="0" width="202" height=&quo ...

  7. 跳出弹窗页面禁止滚动(PC端和手机端)

    pc端如何实现 1.当弹窗显示时,为body元素添加属性:overflow:hidden, 当关闭弹窗时移除该属性即可2.在弹窗的div上设置 @scroll.stop.prevent 3.前端页面弹 ...

  8. vue-蒙层弹窗里的内容滚动。外层大页面禁止滚动

      此需求 有两种方法,第一种,这种方法适用于,底层 和弹窗是两个平行的没有关系的两部分.重叠(https://blog.csdn.net/yuhk231/article/details/741717 ...

  9. ASP.NET后台JS弹框使前台页面样式丢失 解决办法

    Response.Write("<script>alert('您还没有上传相关图片!');</script>");是向前台输出js 应该用下面的方法 Cli ...

随机推荐

  1. Eureka【支持Remote Region】

    工程公共pom依赖 <properties> <project.build.sourceEncoding>UTF-8</project.build.sourceEncod ...

  2. C++ Primer练习题day1

    /* 练习1.1略 练习1.2.改写程序,让他返回-1. 练习1.3.编写程序,在标准的输出上打印Hello,World. */ #include<iostream> int main() ...

  3. 剑指offer26:将二叉搜索树转换成一个排序的双向链表。要求不能创建任何新的结点,只能调整树中结点指针的指向。

    1 题目描述 输入一棵二叉搜索树,将该二叉搜索树转换成一个排序的双向链表.要求不能创建任何新的结点,只能调整树中结点指针的指向. 2 思路和方法 在二叉搜索树中,每个结点都有两个分别指向其左.右子树的 ...

  4. 社工工具包 SEToolkit

    社会工程学(Social Engineering)简称社工,其通过分析攻击对象的心理弱点,利用人性的本能反应,以及任何好奇心,贪婪等心理特征进行的,使用诸如假冒,欺骗,引诱等多种手段来达成攻击目标的一 ...

  5. 怎样限制第三方Cookie

    使用Cookie的 SameSite 属性. 1. SameSite=Strict; 这个模式下, 服务器将会完全禁止第三方Cookie, 在跨站点时, 任何情况下都不会发送Cookie, 也就是说, ...

  6. python3 多线程 采集 xpath

    #!/usr/bin/python # -*- coding: UTF-8 -*- '''Thread3 多线程测试采集''' import threading,time,queue,Mongo_ut ...

  7. bootstrap 处理警告

    $("#id").bootstrapValidator({}).on('success.field.bv', function (e, data) { })

  8. 如何对Nginx日志文件进行切割保存

    日积月累下,日志文件会越来越大,日志文件太大严重影响服务器效率,须要定时对日志文件进行切割. 切割的方式有按月切割.按天切割.按小时切割,一般都是按天切割. 那么如何进行切割呢? 思路: 创建日志文件 ...

  9. linux MD5使用

    # define MD5_LONG unsigned int # define MD5_CBLOCK 64 # define MD5_LBLOCK (MD5_CBLOCK/4) # define MD ...

  10. Tomcat 输出日志出现中文乱码

    Tomcat 输出日志出现中文乱码 解决方案: 打开到tomcat安装目录下的conf/文件夹 修改logging.properties文件,找到 java.util.logging.ConsoleH ...