How do I disable body
's scroll bar, but let it stay visible on screen? As an example see facebook's theatre mode:
Disabling scroll with only CSS. There's another way to disable scrolling that is commonly used when opening modals or scrollable floating elements. And it is simply by adding the CSS property overflow: hidden; on the element you want to prevent the scroll.
Hide Scrollbars But Keep Functionality IE and Edge supports the -ms-overflow-style: property, and Firefox supports the scrollbar-width property, which allows us to hide the scrollbar, but keep functionality.
scrolling = 'no'; or set the scrolling="no" attribute in your iframe's tag: <iframe src="some_url" scrolling="no"> . Save this answer.
This is the only CSS you will ned to force the scrollbars:
html{
overflow-y: scroll;
}
The scrollbars will be disabled if the content is smaller than the window, so you will have to use some script to resize the body to be at least 1px
less then the window height:
$("body").css({ "height" : ($(window).height() - 1) + 'px', "overflow": "hidden" });
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With