Is there anyway to hide web browser's scroll bars, jquery or css? I still want to scroll inside an element therefore i do not want to use
overflow: hidden
Thanks in advance.
3
-
2How are people supposed to scroll if there are not scrollbars?Quentin– Quentin2013-11-14 14:08:15 +00:00Commented Nov 14, 2013 at 14:08
-
1overflow hidden on the page, overflow auto on the containermplungjan– mplungjan2013-11-14 14:08:40 +00:00Commented Nov 14, 2013 at 14:08
-
1Why would you want to do this, other than to annoy your users?Rory McCrossan– Rory McCrossan2013-11-14 14:08:46 +00:00Commented Nov 14, 2013 at 14:08
Add a comment
|
2 Answers
overflow: hidden; applied to body will disable scrollbars only in browser, in your inner elements you can still use them.
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.
EDITED:
I guess you wrote it chaotic :)
If you were not talking about browser's scrollbars, but about hiding element's scrollbars, but still be able to scroll inside, than check this link: http://hynchrstn.wordpress.com/2012/06/10/hide-scrollbar-but-still-scrollable-using-css/
Comments
Applying overflow: hidden to the body is the only reliable / cross-browser method of removing the main window scrollbar.
You can still apply overflow: scroll or overflow: auto to descendant elements to allow for internal scrolling. It would help to have more details about your specific case.
3 Comments
Antegeia
Yes but applying overflow hidden i can't scroll inside an element (without showing the scroll bar)
Ennui
You could use
overflow:hidden to hide the default scrollbars and then scroll your content inside whatever element using Javascript (you could do it with custom jQuery pretty easily, or use something like jScrollPane). Otherwise I'm not sure what you expect here - you need a scroll bar of some kind to scroll!
Legionar
so you are not talking about hiding browser's scrollbars, but about hiding element's scrollbars. Then check my edit...