阻止网页内部滚动条mousewheel事件冒泡

来源：互联网发布：校园网络诈骗是什么编辑：程序博客网时间：2024/05/16 09:01

利用鼠标滚轮对网页内部无素滚动条触发滚动事件，当滚动条到达元素顶部或底部时不触发浏览器窗口的滚动事件。

通过调用以下函数实现：

function preventScroll(id){var _this = document.getElementById(id);if(navigator.userAgent.indexOf("Firefox")>0){_this.addEventListener('DOMMouseScroll',function(e){_this.scrollTop += e.detail > 0 ? 60 : -60;   e.preventDefault();},false); }else{_this.onmousewheel = function(e){   e = e || window.event;   _this.scrollTop += e.wheelDelta > 0 ? -60 : 60;   return false;};}return this;}

参考资料：http://www.cnblogs.com/weekend001/archive/2011/05/11/2043474.html

IE9不支持类似 e.returnValue = false 这种写法，相应的地方改成return false即可。

demo下载：http://download.csdn.net/detail/jyy_12/3688776

jquery插件：

$.fn.extend({"preventScroll":function(){$(this).each(function(){var _this = this;if(navigator.userAgent.indexOf('Firefox') >= 0){   //firefox_this.addEventListener('DOMMouseScroll',function(e){_this.scrollTop += e.detail > 0 ? 60 : -60;   e.preventDefault();},false); }else{_this.onmousewheel = function(e){   e = e || window.event;   _this.scrollTop += e.wheelDelta > 0 ? -60 : 60;   return false;};}})}});$(".box").preventScroll();