Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Hide scrollbar while still being able to scroll with mouse/keyboard [duplicate]

Possible Duplicate:
How to disable browser or element scrollbar, but allow scrolling with wheel or arrow keys?

I want to know if it is possible to hide the scrollbar, while scrolling is still enabled with mouse/keyboard.

I tried to use CSS: overflow: hidden;. The effect is scrollbar disabled and scrolling disabled.

like image 453
Arthur Avatar asked Jul 20 '10 19:07

Arthur


2 Answers

For future reference there is also a solution without jQuery - just have the wrapper div style contain overflow:hidden and use this JavaScript two-liner:

// get the width of the textarea minus scrollbar var textareaWidth = document.getElementById("textarea").scrollWidth;  // width of our wrapper equals width of the inner part of the textarea document.getElementById("wrapper").style.width = textareaWidth + "px"; 

See demo or complete HOWTO.

Update: you can use the same principle to create scrollable div without scrollbar: demo.

like image 56
honzzz Avatar answered Sep 24 '22 00:09

honzzz


There is a jQuery plugin called Scrollable that does what you want.

like image 34
Peter Örneholm Avatar answered Sep 24 '22 00:09

Peter Örneholm