Shulou(Shulou.com)06/01 Report--

This article mainly introduces jQuery how to achieve the bottom page under the pop-up window to prohibit sliding effect of the relevant knowledge, the content is detailed and easy to understand, the operation is simple and fast, has a certain reference value, I believe that after reading this jQuery how to achieve the bottom page under the pop-up window to prohibit sliding effect article will have a harvest, let's take a look.

The specific ideas are as follows:

1. When the pop-up window is triggered, get the position of the scroll bar.

two。 Set the position property of the bottom page to fixed.

3. Set the position of the bottom page to the initial position when the pop-up window is triggered.

4. When you close the pop-up window, restore the position property of the bottom page.

5. Restore the scroll bar height of the bottom page.

/ / trigger the bottom page of the pop-up window to disable sliding function fixed () {var scrollTop = document.body.scrollTop;// sets the position of the background element $('# content') .attr ('data-top',scrollTop); var contentStyle = document.getElementById ("content") .style;//content is the scrollable background element id name contentStyle.position =' fixed' / / contentStyle is the variable of step 2. Set the position attribute of the background element to 'fixed' contentStyle.top = "-" + scrollTop+ "px";} / / close the bottom page of the pop-up window and resume sliding function fixed_cancel () {var contentStyle = document.getElementById ("content"). Style; var scrollTop = $(' # content'). Attr ('data-top'); / / set the position of the background element contentStyle.top =' 0px' / / restore the initial position of the background element contentStyle.position = "static"; / / restore the position attribute of the background element (if the initial value is absolute, restore to absolute, and so on) $(document) .scrollTop (scrollTop); / / scrollTop, set the position of the scroll bar}

The fixed () method is executed when the pop-up window is triggered; the fixed_cancel () method is triggered when the pop-up window is closed; a better user experience is obtained.

This is the end of the article on "how to achieve the anti-sliding effect of the bottom page under the pop-up window by jQuery". Thank you for reading! I believe that everyone has a certain understanding of the knowledge of "how to achieve the anti-sliding effect of jQuery at the bottom of the pop-up window". If you want to learn more, you are welcome to follow the industry information channel.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.