Jquery-based scroll mouse to zoom in and zoom out image effects _ jquery-js tutorial

Jquery-based scroll mouse to zoom in and zoom out the image. For more information, see. Today, I want to scroll down and zoom out the image. It seems very simple. I searched the internet and found the onmousewheel example. All of them only support the IE browser, the result shows that Firefox has the corresponding DOMMouseScroll to process this function. The Code is as follows, and the notes are added:

The Code is as follows:

$ (Function (){
$ (". Body img"). each (function (){
If ($. browser. msie ){
$ (This). bind ("mousewheel", function (e ){
Var e = e | event, v = e. wheelDelta | e. detail;
If (v> 0)
ResizeImg (this, false); // enlarge the image.
Else
ResizeImg (this, true); // scale down the image
Window. event. returnValue = false; // remove the default browser scrolling event
// E. stopPropagation ();
Return false;
})
} Else {
$ (This). bind ("DOMMouseScroll", function (event ){
If (event. detail <0)
ResizeImg (this, false );
Else
ResizeImg (this, true );
Event. preventDefault () // remove the default browser rolling event

// Event. stopPropagation ();})
}
});
Function resizeImg (node, isSmall ){
If (! IsSmall ){
$ (Node). height ($ (node). height () * 1.2 );
} Else
{
$ (Node). height ($ (node). height () * 0.8 );
}
}
});

Click here for the demo in this article: Scroll the mouse to zoom in and out the image