To hide the horizontal scrollbar and prevent horizontal scrolling, use overflow-x: hidden: HTML.
In case you need possibility to hide and show scrollbars dynamically you could use
$("body").css("overflow", "hidden");
and
$("body").css("overflow", "auto");
somewhere in your code.
function reloadScrollBars() {
document.documentElement.style.overflow = 'auto'; // firefox, chrome
document.body.scroll = "yes"; // ie only
}
function unloadScrollBars() {
document.documentElement.style.overflow = 'hidden'; // firefox, chrome
document.body.scroll = "no"; // ie only
}
Try CSS
<body style="overflow: hidden">
So far we have overflow:hidden on the body. However IE doesn't always honor that and you need to put scroll="no" on the body element as well and/or place overflow:hidden on the html element as well.
You can take this further when you need to 'take control' of the view port you can do this:-
<style>
body {width:100%; height:100%; overflow:hidden; margin:0; }
html {width:100%; height:100%; overflow:hidden; }
</style>
An element granted height 100% in the body has the full height of the window viewport, and element positioned absolutely using bottom:nnPX will be set nn pixels above the bottom edge of the window, etc.
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