CODEWITHSUNDEEP
csstwitter-bootstrapscrollnavigation
3cfe5693
3cfe5693

Reputation: 57

How to scroll the menu, without scrolling the content of the page in the background?

On my site I have a menu on the right. When I scroll down the menu and I come down, the background page scrolls too.

I would like the page in the background does not scroll. How to do this ?

Here is a page of my site, click on the menu on the right:

https://www.s1biose.com/recette

enter image description here

Upvotes: 0

Views: 2788

Answers (1)

Robert Wolf
Robert Wolf

Reputation: 1312

You can disable scrolling in many ways:

With CSS:

$('html, body').css({
    overflow: 'hidden',
    height: '100%'
});

This will disable scrolling and bring you to the top of the page.

Alternatively, you can use JavaScript (jQuery) to:

$(document).ready(function(){
  $(".navbar-toggle-second[aria-expanded='false']").click(function(e) {
    e.preventDefault();
    $("body").css("overflow", "hidden");
  });

  $(".navbar-toggle-second[aria-expanded='true']").click(function(e) {
    e.preventDefault();
    $("body").css("overflow", "auto");
  });
});

For more information, see this:

How to programmatically disable page scrolling with jQuery

Upvotes: 2

Related Questions