Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to disable scrolling of body element?

Tags:

jquery

How to disable scrolling of body? $('body').css('overflow','hidden'); only hides the scrollbars but it does not disable the scrolling. I want to disable the scrolling of the body.

But I want to keep the scrolling of other division intact.

like image 915
Starx Avatar asked May 07 '10 14:05

Starx


People also ask

How do I turn off body scroll?

The most straightforward way for disabling scrolling on websites is to add overflow: hidden on the <body> tag.

What prevents the body from scrolling when overlay is on?

Approach: To prevent body scrolling but allow overlay scrolling we have to switch the overflow to be hidden when the overlay is being shown.

How do I disable scroll behavior in CSS?

To hide the scrollbar and disable scrolling, we can use the CSS overflow property. This property determines what to do with content that extends beyond the boundaries of its container. To prevent scrolling with this property, just apply the rule overflow: hidden to the body (for the entire page) or a container element.

How do I make a div not scrollable?

On top of this for browser compatibility on the parent element you will need to apply text-align: center; which will apply the needed centering of the element. As for preventing scrolling on the div, all you need to apply on the footer is overflow: hidden; and that should do the trick.


1 Answers

Try this CSS, no jQuery needed for this:

<style type="text/css">
    html { overflow: hidden; }
</style>

[UPDATE after comment]

Try specifying the height of the body too:

<style type="text/css">
    html, body { overflow: hidden; height: 100% }
    body { margin:0; padding:0; }
</style>
like image 159
Makram Saleh Avatar answered Oct 11 '22 10:10

Makram Saleh