在jQuery中禁用窗口滚动

Question

I am using something like facebox , and want the main window scrolling bar to be disabled. One catch though, There is a scroll bar inside the facebox component, which needs to be able to scroll.

What I am trying to fix is the following case:

when scrolling the internal scrolling element (inside facebox ), when scroll ends, it scrolls the page down further.

Answer 1

do it in css:

body {
   overflow: hidden;
}

this would hide the scrollbar in the main window

Answer 2

i went into the facebox.js file and added

  $('body').css('overflow', 'hidden');

to

loading: function() {
      init()
      if ($('#facebox .loading').length == 1) return true
      showOverlay()
      $('#facebox .content').empty()
$('body').css('overflow', 'hidden');
      $('#facebox .body').children().hide().end().
        append('<div class="loading"><img src="'+$.facebox.settings.loadingImage+'"/></div>')

and added $('body').css('overflow', ''); to the end of the document

   * Bindings
   */

  $(document).bind('close.facebox', function() {
    $(document).unbind('keydown.facebox')
    $('#facebox').fadeOut(function() {
      $('#facebox .content').removeClass().addClass('content')
      $('#facebox .loading').remove()
      $(document).trigger('afterClose.facebox')
$('body').css('overflow', '');
    })
    hideOverlay()
  })

})(jQuery);

This stops the scroll when open and when closed put the scroll back in, it worked for me at http://www.vestedutility.com.au/home_electrical_saftey_check.php