mousewheel plugin not working in firefox

Question

I've been using brandon aarons mousewheel plugin and is working on webkit browsers HOWEVER it doesn't work on firefox.

this was the original code for brandon aaron's which is great on webkit

$('body').on('mousewheel', function(event, delta){
  this.scrollLeft -= (delta*30);
  event.preventDefault();
});

so i switched to http://cobbweb.me/blog/2012/03/30/jquery-mousewheel-plugin-version-2/ which is supposed to work on firefox, tried the code which is this

$('body').on('mousewheel', function(event, delta, deltaX, deltaY){

  event.preventDefault();
});

I tried to put the scrollLeft in there with deltaY replaced and DOMMouseScroll or MozMousePixelScroll but still to no avail. How do I make this work to bind on mousewheel so that my page scrolls horizontally on firefox?

thanks!

score 1 · Answer 1 · edited May 23 '17 at 12:09

1

You should check out scrollLeft on body not working in firefox

They fix it with changing $('body')... to $('html, body')...

edited May 23 '17 at 12:09

Community

1
1

answered Dec 02 '13 at 10:34

Daniel Lind

11
1

Cat · Answer 2 · 2012-09-18T00:43:32.163

0

You can fix this by handling the DOM events yourself (with and without the plugin).

Like so:

$('body').on('mousewheel DOMMouseScroll MozMousePixelScroll', function(event, delta, deltaX, deltaY){
    event.preventDefault();
});

You can see it in action here (tested in Chrome and Firefox).

However, scrollLeft and scrollTop do not seem to work in Firefox (in either jQuery or basic JavaScript). See this fiddle (should output "5"; does so on Chrome, but spits out "0" on Firefox).

edited Sep 18 '12 at 00:43

answered Sep 18 '12 at 00:25

Cat

66,919
24
133
141

yes it works with the plugin. logs proper values. I think the problem is with the scrollLeft... when i pass any delta value in firefox it doesnt work at all. it logs proper any delta values. so question is, how do i bind it to scroll horizontally (scrollLeft) and work on firefox? – Sep 18 '12 at 00:31
also firefox doesn't seem to compute delta*number... hmm why? it just returns NaN. webkit does fine – Sep 18 '12 at 00:39
Actually, it seems the issue you're facing has to do with `scrollLeft` and `scrollTop` not working in Firefox. [This fiddle](http://jsfiddle.net/7PSyn/3/) spits out "0" in Firefox, "5" in Chrome. This would be a bug for Mozilla, if it's not already in their queue. – Cat Sep 18 '12 at 00:42
As for `delta*number`, output the values of both. If they're both numeric (which I doubt), one may be a string. – Cat Sep 18 '12 at 00:44
It's possible Firefox is receiving some botched `delta` value? This does seem very much like a Firefox bug of some kind. – Cat Sep 18 '12 at 00:55
well hopefully they sort it. just puzzled. oh well, i suppose i just need to standby. further investigate tomorrow when i've slept O_O Thanks eric! – Sep 18 '12 at 00:59
Interesting, your site example runs, but when I add to my page it says `TypeError: $(...).on is not a function` – The Student May 03 '13 at 22:38
@TomBrito Older versions of jQuery do not support `$(...).on()`. I believe it was introduced in 1.7. – Cat May 03 '13 at 23:19
@Eric thanks! It worked when I changed to the google version of jquery :) – The Student May 04 '13 at 14:03

score 0 · Answer 3 · answered Jan 06 '17 at 18:48

0

Try: (1) event 'mousewheel', (2) function(event), and (3) use event.deltaFactor * event.deltaX to detect the scroll distance.

Check https://github.com/jquery/jquery-mousewheel, very short section "Getting the scroll distance".

answered Jan 06 '17 at 18:48

Sergii Shcherbak

837
1
11
12

mousewheel plugin not working in firefox

3 Answers3