在弹出页面加载时使用jquery或javascript隐藏背景网页垂直滚动条

Question

By clicking <a>click me</a> tag, the popup windows will get load. At the time background page vertical scroll bar is on visible state. How can i hide while my popup load and visible when it close.

I used below script only:

if($("#myModal").is(':visible')){  // here 'myModal' is div of popup.
   $("html").css("overflow", "hidden");  // here 'html' is a background page
   }
   else
  {
   $("html").css("overflow", "visible");
  }

Hide state is working properly, but visible state not working when i close the popup window.

Please give me a correct solutions.

Answer 1

Depends on the way you implement your modal... If for example you are using the jQuery UI Dialog Widget you would do something like:

$("a.mylink").dialog({
    open: function() {
        $("html").css("overflow", "hidden");
    },
    close: function() {
        $("html").css("overflow", "visible");
    }
});