开发者

Remove HTML scrollbars but allow mousewheel scrolling [duplicate]

This question already has answers here: Closed 10 years ago.

Possible Duplicate:

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

I was able to disable vertical scrollbars in a grid by setting the CSS property overflow-y: hidden. However, this removed the ability to scroll the contents with the mouse wheel as well.

Is there a way to not show the scrollbars but still allow the contents to be scrolled through mouse wheel or arrow ke开发者_运维百科ys?


There are Javascript methods, see the thread you duplicated.

A better solution is to set the target div to overflow:scroll, and wrap it inside a second element that is 8px narrower, who's overflow:hidden.

The target element will have a hidden scrollbar. The mousewheel will work, but the scroll bar will not show.

<div style='overflow:hidden; width:200px;'>
   <div style='overflow:scroll; width:208px'>
      My mousewheel scrollable content here....
   </div>
</div>

Note that 8px as the width of the scrollbar is a random number - it's probably a lot more, and it could require per browser CSS.

Still better than JS in my book.


You could use jScrollPane which allows you to replace the browser scrollbars with custom ones:

Since you can style these custom scrollbars with CSS you could easily make them disappear (try something like: .jScrollPaneTrack { display: none; })

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜