Scroll mouse zoom-in image effect based on jquery_jquery

Today we are going to launch a mouse scrolling function to zoom in and out pictures. It seems very simple. After searching on the Internet, all the examples that appear are onmousewheel examples. All of them only support IE browser. It turns out that Firefox has a corresponding DOMMouseScroll to handle this function. The code is as follows, with the following comments:

Copy the code 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 picture
else
resizeImg(this,true);//Reduce the image
window.event.returnValue = false;//Remove the browser's default scroll 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 browser default scroll event

//event.stopPropagation(); })
}
});
function resizeImg(node,isSmall){
if(!isSmall){
$(node).height($(node).height() *1.2);
}else
{
$(node).height($(node).height()*0.8);
}
}
});

For the demo of this article, please click here: Roll the mouse to zoom in and out the picture effect