Applying onscroll to an <input> tag in FF

bizt · Sep 2, 2009

Hi,

I have a site that Im working on where we have an input tag which has
a numeric value. Say that value is 1, I want to apply an event handler
where if the mouse scroll wheel is scrolled up it will go 2. If they
do a long scroll it will go 2,3,4,5,6,7,8... Obviously this involved
me capturing the event and direction.

In IE, we use something like:

<input onmousewheel="doInputScroll(event, this);"...

... allows me to capture the event but onmousewheel is only supported
by IE. In Firefox I found onscroll as well as some functions on how to
capture the direction but event handler can only be applied to certain
HTML elements however the only element I had any luck with was <body>.
I did consider wrapping my input element in a <div> and applying the
event handler to that but it didn't seem to work either for some
reason anyway.

Does anyone have any ideas how I might get this working? Its not
common functionality I know but many of our web users are used to this
feature in IE and it would be great to put this over to FF too

Cheers
Burnsy

abozhilov · Sep 2, 2009

Hi,

I have a site that Im working on where we have an input tag which has
a numeric value. Say that value is 1, I want to apply an event handler
where if the mouse scroll wheel is scrolled up it will go 2. If they
do a long scroll it will go 2,3,4,5,6,7,8... Obviously this involved
me capturing the event and direction.

In IE, we use something like:

<input onmousewheel="doInputScroll(event, this);"...

.. allows me to capture the event but onmousewheel is only supported
by IE. In Firefox I found onscroll as well as some functions on how to
capture the direction but event handler can only be applied to certain
HTML elements however the only element I had any luck with was <body>.
I did consider wrapping my input element in a <div> and applying the
event handler to that but it didn't seem to work either for some
reason anyway.

Does anyone have any ideas how I might get this working? Its not
common functionality I know but many of our web users are used to this
feature in IE and it would be great to put this over to FF too

Cheers
Burnsy

Actually mousewheel not only supported from IE. Chrome and Opera too
dispatched.
In FF you have DOMMouseScroll.
https://developer.mozilla.org/en/Gecko-Specific_DOM_Events#section_8

abozhilov · Sep 2, 2009

And mousewheel is a part from DOM Level 3 events type.
http://www.w3.org/TR/DOM-Level-3-Events/events.html#event-mousewheel

SAM · Sep 2, 2009

Le 9/2/09 4:35 PM, bizt a écrit :

Hi,

I have a site that Im working on where we have an input tag which has
a numeric value. Say that value is 1, I want to apply an event handler
where if the mouse scroll wheel is scrolled up it will go 2. If they
do a long scroll it will go 2,3,4,5,6,7,8... Obviously this involved
me capturing the event and direction.

In IE, we use something like:

<input onmousewheel="doInputScroll(event, this);"...

.. allows me to capture the event but onmousewheel is only supported
by IE. In Firefox I found onscroll as well as some functions on how to

capture the direction but event handler can only be applied to certain
HTML elements however the only element I had any luck with was <body>.
I did consider wrapping my input element in a <div> and applying the
event handler to that but it didn't seem to work either for some
reason anyway.

seems you need to use :
- an addEventListener catching the target scrolled
- and the DOMMouseScroll (insteed of mouseWheeel)

How to use the last user input in Text widget in an If/Else statement after Enter is pressed?	0	Mar 31, 2019
Problem: script works in IE but not FF	5	May 16, 2011
onscroll event in iframe in IE	2	Jun 26, 2005
I am trying to make an audio player, how do I get the selected file to be playable?	5	Mar 29, 2022
Problem with submit in IE and FF	5	Feb 11, 2008
onscroll Event Not Firing in ASP.NET 2.0	2	Sep 29, 2006
Selecting Text in Input in FF and/or Safari (replacement for TypeAheadSelect)	1	Oct 31, 2006
ff event problem	1	Feb 27, 2006

Applying onscroll to an <input> tag in FF

bizt

abozhilov

abozhilov

SAM

Ask a Question

Similar Threads

Members online

Forum statistics

Latest Threads