Special mouse events in a browser: wheel, right-click?

Question

Google maps is an impressive display of what you can do with javascript and Ajaxy-goodness. Even my mouse scroll wheel and right-click works to provide specific functionality.

In the standard HTML spec, I don't see an "onmouserightclick" event or similar basic javascript handling for the mouse wheel. Maybe I am looking in the wrong places.

I presume these events are browser and platform specific (or "sensitive" instead of specific). And am wondering what the basic, plain HTML and Javascript is needed to exploit these events, in ALL browsers.

Naturally, when designing a site these features have to be extra, since some people still use the one-button mouse.

How to I use events with the mouse wheel and right-click? I'm looking for sample code.

EDIT: Thanks for the jQuery code guys! The system-developer in me still has questions and doubts though. Mainly I'm concerned about platform-limitations that would seem to apply here. Is there a browser that some of these features don't work in? Does the mouse wheel up and down events also allow for mouse wheel click events? I would just expect there to be some limitation out there and am wondering if it's officially documented. I want to know how it works at the low level. I am glad to see it is easy in jQuery, another reason for me to get into it.

Answer 1

you said cross-browser so you must mean jquery :P

http://www.ogonek.net/mousewheel/jquery-demo.html

http://abeautifulsite.net/notebook_files/68/demo/

I bet you can find javascript that do that, but i think its always better to go with component(or plugin), because it could have bugs(or maybe cross-browser bugs) and person that made it would get email from somebody that is using that and fix it. with pure javascript you always should check it in every version of every browser.

Answer 2

If you're using jQuery, it's extremely simple to do things with the right click menu :

$(document).bind("contextmenu",function(e){
    alert("You right clicked!");
    return false; //disable the context menu
});

Otherwise, you can use this script, provided by quirskmode: http://www.quirksmode.org/js/events_properties.html#link6

As for the mouse wheel, this a great script that I've used in the past:

http://adomas.org/javascript-mouse-wheel/

Answer 3

Mouse Wheel:
ol' no-jquery-or-prototype-library method: here

Prototype method: Here

JQuery method: Here