mouse wheel event

need:

The number increase or decrease operation in a form can be realized by the mouse wheel, or different events are triggered after the wheel controls a button to scroll up and down.

accomplish:

Monitor mouse wheel events through js.

describe:

First, different browsers have different scroll wheel events. There are mainly two types, onmousewheel (not supported by firefox) and DOMMouseScroll (only supported by firefox). These two events are not described in detail here. For those who want to know more, please move: mousewheel (mousewheel) and DOMMouseScroll events.
Specific implementation: 1. Need to add event listener, the code is as follows: Compatible with firefox, use addEventListener to listen

 

/* Listen for mouse scroll events  
         * 1. Firefox is: DOMMouseScroll;  
         * 2. IE/Opera/Chrome: add events directly */  
        if(document.addEventListener){  
            document.addEventListener('DOMMouseScroll',scrollFunc,false);  
        } // W3C  
        window.onmousewheel=document.onmousewheel=scrollFunc;//IE/Opera/Chrome

　

var scrollFunc=function(e){  
            e = e || window.event;  
            if(e.wheelDelta){//IE/Opera/Chrome  
                //Custom event: write specific implementation logic  
                mouseScroll();  
            }else if(e.detail){//Firefox  
                //Custom event: write specific implementation logic  
                mouseScroll();  
            }  
        }

　

Note: (Brief description:

Compatibility should also be considered in the browser to judge whether the scroll wheel is up or down. At present, among the five major browsers (IE, Opera, Safari, Firefox, and Chrome), Firefox uses detail, and the other four use wheelDelta; the two are only inconsistent in value. , which means the same meaning, detail and wheelDelta only take two values ​​each, detail only takes ±3, and wheelDelta only takes ±150, in which a positive number means down, and a negative number means up) This is an explanation on the article I read, But when I tested it, I found that both IE and Google displayed +-120, and sometimes Google also displayed 240. To be certified.