Home > Web Front-end > HTML Tutorial > How to prevent page scrolling behind mask layer

How to prevent page scrolling behind mask layer

黄舟
Release: 2017-10-24 10:36:01
Original
2444 people have browsed it


One: The page will be initialized to the top and then static
css code:

.ovfHiden{overflow: hidden;height: 100%;}
Copy after login

jquery:

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

Two: Page Normal stillness
1. When opening a new page, you need to disable the mouse wheel and page sliding;
Just add this js code when calling the display layer:

document.documentElement.style.overflow = "hidden";
Copy after login


Don’t forget to add this sentence when closing the layer:

document.documentElement.style.overflow = "scroll";
Copy after login



2. Set the original position of the scroll wheel

var top_temp = $(document).scrollTop()||document.documentElement.scrollTop || document.body.scrollTop;
window.parent.scrollTo(0,top_value);
Copy after login

The above is the detailed content of How to prevent page scrolling behind mask layer. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template