0

is there any way to hide/disable the browsers default vertical scroll bar but should be scrollable with mouse wheel in full screen view (When hitting F11 key). I tried overflow:hidden css attribute in body and html tag and i can hide/disable the scroll bar. but the content is not vertically scrollable too with mouse wheel. I want it to be scrollable with mouse wheel roling but no need of displaying the vertical bar when switching to full screen view. Any solution for this requirement? please help. Thanks in advance.

Mahesh A R
  • 179
  • 4
  • 15

2 Answers2

1

It can be achieved using css without javascript... there is property body::-webkit-scrollbar make its width to 0 ... Kindly check the following fiddle : https://jsfiddle.net/u6egeL2L/1/

just add:
CSS

body::-webkit-scrollbar {
    width: 0em;

}
RRR
  • 1,074
  • 8
  • 11
  • Its working in chrome. but not in firefox as well as in IE too. Any other option to work in IE and chrome? – Mahesh A R Feb 23 '16 at 14:11
  • And one more bug in this method is it is hiding vertical scroll bar always. i want to hide it ONLY if the user hits F11 key and switches to full screen view. – Mahesh A R Feb 23 '16 at 14:16
  • What exactly i am looking is something like maps.google.com. There we didnt see any vertical scrollbar. but can move the map area upwards and downwards with click and drag or mousewheel scroll. and it is working in mozilla, ie, chrome etc. – Mahesh A R Feb 23 '16 at 14:20
0

This will get you started. Basically, you'll need to capture the mouse events in javascript and manually scroll the div in order to do what you want.

Tim Jasko
  • 1,532
  • 1
  • 8
  • 12