Mouse wheel handler in Javascript
July 29, 2006 by Emanuele Feronato
Filed Under Javascript •
Filed Under Javascript •
I found this very very interesting script by Adomas Paltanavičius to determine if you are using mousewheel.
It returns a delta value, +1 or -1, according to scroll direction.
Scroll mouse wheel to see delta here.
I am publishing it here, and very soon I will start to use it to code games, form handlers, and so on.
Meanwhile, check the original script.
It needs some improvements due to some strange delta values on some browsers.
HTML:
-
<script type="text/javascript">
-
function handle(delta) {
-
var s = delta + ": ";
-
if (delta <0)
-
s += "down";
-
else
-
s += "up";
-
document.getElementById('delta').innerHTML = s;
-
}
-
-
function wheel(event){
-
var delta = 0;
-
if (!event) event = window.event;
-
if (event.wheelDelta) {
-
delta = event.wheelDelta/120;
-
if (window.opera) delta = -delta;
-
} else if (event.detail) {
-
delta = -event.detail/3;
-
}
-
if (delta)
-
handle(delta);
-
}
-
-
/* Initialization code. */
-
if (window.addEventListener)
-
window.addEventListener('DOMMouseScroll', wheel, false);
-
window.onmousewheel = document.onmousewheel = wheel;
-
-
</script>
-
</head>
-
<div id="delta">Scroll mouse wheel to see delta here.</div>
-
</body>
-
</html>
Do you have an idea about how to use mouse wheel handling? Let me know, and I will (try to) code it.
Improve the blog rating this post
Tell me what do you think about this post. I'll write better and better entries.
Tell me what do you think about this post. I'll write better and better entries.
5 Responses to “Mouse wheel handler in Javascript”
Leave a Reply

Realy very nice. Thank you so much. is it possible to track the speed of click or scroll? I think possible.
not bad … not bad… :D
I believe this is the (somewhat) same code used in games made for ipods.
[italian, right?]
bello bello, c’è modo per caso di creare un javascript o qualcosa del genere che mi cambi la direzione di spostamento di una pagina web, in modo che usando la wheel la pagina vada a destra e a sinistra invece che su e giù?
Sto costruendo un sito in “horizontal way” e mi servirebbe proprio…
Hi.
Any idea how to get a mouse scroll wheel to make a page move left/right rather than up/down. I know you can do this by pressing extra buttons but I would like to program this straight into my code if possible.
Thanks.