Prevent horizontal touch pad scrolling on macbooks using Chrome?

Question

I would like to prevent horizontal scrolling on my site using the multitouch trackpad on Macbooks, magical mouse etc. This issue is solved for Firefox (using solution from here: Prevent horizontal touch pad scrolling on macbooks using Firefox?). But it still gives me trouble on Chrome.

Is there any way of preventing this functionality on Chrome (e.g. using eventlistener)? Thanks

Check out http://stackoverflow.com/questions/8737709/any-way-to-prevent-horizontal-scrolling-triggering-swipe-back-gesture-on-os-x-li — Jonathan, Jan 20 '12 at 13:00

score 1 · Answer 1 · edited Mar 22 '13 at 13:23

1

I had the same problem, and setting overflow to hidden in the CSS did not work too. My solution was using:

jQuery('html, body').css('overflow-x', 'hidden');

I dont know why, but in JavaScript it works.

edited Mar 22 '13 at 13:23

Alexander

23,432
11
63
73

answered Feb 28 '13 at 19:35

grogers

85
1
8

score 0 · Answer 2 · edited Mar 22 '13 at 13:23

0

In CSS, you can use overflow-x: hidden; to prevent scrolling. If you apply it to the body, or another element specifically that should do the trick.

edited Mar 22 '13 at 13:23

Alexander

23,432
11
63
73

answered Mar 17 '12 at 03:13

adam8810

721
1
7
22

1

Alternately you could do it through JQuery if you prefer. $(element).css('overflow', 'hidden') – adam8810 Mar 17 '12 at 03:15

Prevent horizontal touch pad scrolling on macbooks using Chrome?

2 Answers2