JavaScript

禁用鼠标滚轮事件

接到一个需求,要在flash里面使用鼠标滚轮控制壁纸地板的替换,这本身是一个小需求,但是在网页测试中发现滚动鼠标滚轮时,网页也会跟着滚动,这样鼠标就没法固定在滚动元件的上面,对用户体验造成了不良影响。

然后开始尝试阻止鼠标滚轮影响页面,先试用这段代码:

function disabledMouseWheel() {
  if (document.addEventListener) {
    document.addEventListener('DOMMouseScroll', scrollFunc, false);
  }//W3C
  window.onmousewheel = document.onmousewheel = scrollFunc;//IE/Opera/Chrome
}
function scrollFunc(evt) {
  return false;
}
window.onload=disabledMouseWheel;

发现ie9、chrome、opera都好使,唯独特殊处理的Firefox 6不行,经过反复调试发现其它浏览器在事件处理函数中return false就行了,Firefox比较特殊,使用以下代码后测试通过:

function disabledMouseWheel() {
  if (document.addEventListener) {
    document.addEventListener('DOMMouseScroll', scrollFunc, false);
  }//W3C
  window.onmousewheel = document.onmousewheel = scrollFunc;//IE/Opera/Chrome
}
function scrollFunc(evt) {
  evt = evt || window.event;
    if(evt.preventDefault) {
    // Firefox
      evt.preventDefault();
      evt.stopPropagation();
    } else {
      // IE
      evt.cancelBubble=true;
      evt.returnValue = false;
  }
  return false;
}
window.onload=disabledMouseWheel;

如果您觉得文章内容对您有用,不妨支持我创作更多有价值的分享:


已发布

分类

,

来自

评论

《“禁用鼠标滚轮事件”》 有 1 条评论

  1. […] 禁用鼠标滚轮事件 […]

欢迎吐槽,共同进步

此站点使用Akismet来减少垃圾评论。了解我们如何处理您的评论数据