JS鼠标事件大全

浏览: 286次 日期:2018年02月23日 20:42:31 作者:青格勒

今天遇到了需要使用鼠标事件的效果,然后查了一下鼠标事件,以后使用可以拿来使用了。

 

鼠标左右键事件:

click:点击事件

dbclick:双击事件

mousedown:鼠标按下时触发

mouseenter:鼠标移入时触发(不冒泡,后代元素不触发)

mouseleave:鼠标移出时触发(不冒泡,后代元素不触发)

mousemove:鼠标在元素内部移动时触发

mouseout:鼠标移入另一个元素时触发(包含子元素)

mouseover:鼠标移入元素时触发(包含子元素)

mouseup:释放鼠标按钮时触发

 

鼠标滚轮事件:

一、ie/chrome/safari/opera下的事件 : onmousewheel

向上滚动up:120

向下滚动down: -120

 

二、firefox 下的事件: DOMMouseScroll

向上滚动up: -3

向下滚动down: 3

JS鼠标点击事件所有浏览器都是一样的,但是鼠标滚轮事件有一些不一样的,下面是兼容写法

<script>
window.onload = function () {
    //ie/chrome/safari/opera
    document.onmousewheel = fn;
    if (document.addEventListener) {
        //firefox
        document.addEventListener('DOMMouseScroll', fn, false);
    }
    function fn(ev) {
        var ev = ev || event;
        var shubiao = true;
        if (ev.wheelDelta) {
            shubiao = ev.wheelDelta > 0 ? true : false;
        } else {
            shubiao = ev.detail < 0 ? true : false;
        }
        if (ev.preventDefault) {
            ev.preventDefault();
        }
        return false;
    }
    //取消document的默认事件
    //document.attachEvent('oncontextmenu', function () {
    //  return false;
    //});
}
</script>

 

希望对大家有帮助,别忘了点赞哦!

文章链接:http://cenggel.com/js/68.html

版权声明:文章《JS鼠标事件大全》由青格勒编写,转载请带上文章链接。

本章内容纯属乱讲,如有雷同,纯属巧合。如有借鉴之处已表明出处。

点击任意位置关闭窗口,感谢您的支持。


打赏规则 - 为了避免对于打赏模式产生误解,说明一下几点内容:

  • 1.打赏纯粹自愿,金额不限,别太多,1块就行;
  • 2.打赏不能作为解答疑问的理由;
  • 3.打赏不能帮你做毕业设计或论文;
  • 4.打赏不能帮你做工作中的项目;
  • 5.打赏就是这不能那不能,只是单纯打赏而已。
  • 5.最后谢谢支持。
关闭
相关文章

发表评论

电子邮件地址不会被公开。 必填项已用*标注