首页 > web前端 > html教程 > 如何阻止遮罩层后页面滚动的实例

如何阻止遮罩层后页面滚动的实例

黄舟
发布: 2017-10-24 10:36:01
原创
2454 人浏览过


一:页面会初始化到顶端,而后静止
css代码:

.ovfHiden{overflow: hidden;height: 100%;}
登录后复制

jquery:

$(".header_right").click(function(){$('html,body').addClass('ovfHiden'); //使网页不可滚动
   $(".searchbox").show();
 })
 $(".yg-close").click(function(){
   $('html,body').removeClass('ovfHiden'); //使网页恢复可滚
   $(".searchbox").hide();
 })
登录后复制

二:页面正常静止
1.打开新页面时需要禁止鼠标滚轮,禁止页面滑动;
在调用显示层时加上这句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);
登录后复制

以上是如何阻止遮罩层后页面滚动的实例的详细内容。更多信息请关注PHP中文网其他相关文章!

相关标签:
来源:php.cn
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板