Event事件-3:mousewheel、DOMMouseScroll事件 / mousedown、mouseup鼠标按下抬起 / mousewheel、DOMMouseScroll鼠标滚动 /...

mousewheel 和 DOMMouseScroll 事件

        mousewheel 监听滚轮发生滚动 (IE/chrome)

                e.wheelDelta 120 up | -120 down

        DOMMouseScroll 监听滚轮发生滚动 (firefox);

                e.detail -3 up | 3 down

e.wheelDelta 和 e.detail 滚轮方向

---

兼容版滚轮事件

function mouseScroll({el,up,down}){

    el.addEventListener("mousewheel",(e)=>{

        if(e.wheelDelta > 0){

            up&&up.call(el,e);

        } else {

            down&&down.call(el,e);

        }

    });

    el.addEventListener("DOMMouseScroll",(e)=>{

        if(e.detail < 0){

            up&&up.call(el,e);

        } else {

            down&&down.call(el,e);

        }

    });

}

{

    mouseScroll({

        el: document,

        up(){

            console.log("向上滚动",this);

        },down(){

            console.log("向下滚动");

        }}) 

}

---

mousedown、mouseup 鼠标按下抬起

        拖拽案例

---

mousewheel、DOMMouseScroll 鼠标滚动事件

        e.wheelDelta       （谷歌、IE）

        e.detail          （火狐）

---

dblclick 双击

---

鼠标按键

---

长按事件

        dispatchEvent(event)

---