The method of judging the direction of mouse wheel in JS

Objective

Liudap

Recently bored, in doing their own personal station, which used a mouse wheel direction to judge the method, today idle to boring, to introduce you!!!!

Before introducing the mouse event case, let's take a little look at the event object in JS

The event object in JS

Event object: It represents the state of the events, such as the position of the mouse, the state of the mouse button, the state of the keyboard key, and so on.

>>> events are often used in conjunction with functions, and functions are not executed before the event occurs!

Second, JS how to determine the mouse wheel direction

To determine the direction of the mouse wheel, there are two factions: one is Google, ie faction (this time IE did not engage in special); the other is the Firefox faction

>>> in Google, IE faction, provides us with the OnMouseWheel method, which gives us a Wheeldelta property, the return value of the property: positive and negative values, where positive values indicate that the wheel scrolls upward, and a negative value indicates that the wheel scrolls down.

>>> in Firefox, we provide the Dommousescroll method, which gives us a detail property that returns the value: positive and negative, where positive values scroll down, and negative values that scroll up the wheel.

　　>>> Note that the return value of the Wheeldelta property and the detail property are positive and negative, but both indicate that the wheel is in the opposite direction ...

1varScrollmouse=function(e) {2 E=e | |window.event; 3if(E.wheeldelta) {//Judging browser ie, Google pulley events4if(e.wheeldelta>0) {//When the pulley is rolling up5 Alert ("Roller roll Up"); 6             }   7if(e.wheeldelta<0) {//When the pulley is rolling down8 Alert ("Pulley scroll down"); 9         } 10}Else if(E.detail) {//Firefox pulley events11if(e.detail>0) {//When the pulley is rolling downAlert ("Pulley scroll down"); 13         }  14if(e.detail<0) {//When the pulley is rolling upAlert ("Roller roll Up"); 16         }  17         }  18 }  19//to bind a page to a pulley scroll event20if(Document.addeventlistener) {//FirefoxDocument.addeventlistener ("Dommousescroll", Scrollfunc,false); 22 }  23//rolling pulley triggering Scrollfunc method//ie GoogleWindow.onmousewheel=scrollmouse;

Editor's note

This weekend because of too many things, I would like to share here, I hope this little bit of knowledge can bring a little help to everyone.

The method of judging the direction of mouse wheel in JS