太阳√1城集团网址查询

Try scrolling your mouse wheel (IE, Safari, and Opera).

以上代码使用前面创建的 client 对象检测了浏览器是不是早期版本的 Opera。
由于 mousewheel 事件非常流行，而且所有浏览器都支持它，所以 HTML 5也加入了该事件。
Firefox支持一个名为 DOMMouseScroll 的类似事件，也是在鼠标滚轮滚动时触发。与 mousewheel 事件一样，DOMMouseScroll 也被视为鼠标事件，因而包含与鼠标事件有关的所有属性。而有关鼠标滚轮的信息则保存在 detail 属性中，当向前滚动鼠标滚轮时，这个属性的值是-3 的倍数，当向后滚动鼠标滚轮时，这个属性的值是 3 的倍数。如图展示了这个属性。

当向前滚动鼠标滚轮时，这个属性的值是-3的倍数，当向后滚动鼠标滚轮时，这个属性的值是3的倍数

可以将 DOMMouseScroll 事件添加到页面中的任何元素，而且该事件会冒泡到 window 对象。因此，可以像下面这样针对这个事件来添加事件处理程序。
EventUtil.addHandler(window, "DOMMouseScroll", function(event){
event = EventUtil.getEvent(event);
alert(event.detail);
});
这个简单的事件处理程序会在鼠标滚轮滚动时显示 detail 属性的值。若要给出跨浏览器环境下的解决方案，第一步就是创建一个能够取得鼠标滚轮增量值（delta）的方法。下面是我们添加到 EventUtil 对象中的这个方法。

var EventUtil = {
//省略了其他代码
getWheelDelta: function(event){
if (event.wheelDelta){
return (client.engine.opera && client.engine.opera < 9.5 ? -event.wheelDelta : event.wheelDelta);
} else {
return -event.detail * 40;
}
},

//省略了其他代码 };

EventUtil.js 点击下载
或复制地址：http://www.jxbh.cn/uploads/images/20161221/EventUtil.js
client.js 点击下载
或复制地址：http://www.jxbh.cn/uploads/images/20161221/client.js

这里，getWheelDelta()方法首先检测了事件对象是否包含 wheelDelta 属性，如果是则通过浏览器检测代码确定正确的值。如果 wheelDelta 不存在，则假设相应的值保存在 detail 属性中。由于 Firefox 的值有所不同，因此首先要将这个值的符号反向，然后再乘以 40，就可以保证与其他浏览器的值相同了。有了这个方法之后，就可以将相同的事件处理程序指定给 mousewheel 和 DOMMouse- Scroll 事件了，例如：
(function(){

function handleMouseWheel(event){
event = EventUtil.getEvent(event);
var delta = EventUtil.getWheelDelta(event);
alert(delta);
}

EventUtil.addHandler(document, "mousewheel", handleMouseWheel);
EventUtil.addHandler(document, "DOMMouseScroll", handleMouseWheel);
})();

我们将相关代码放在了一个私有作用域中，从而不会让新定义的函数干扰全局作用域。这里定义的 handleMouseWheel()函数可以用作两个事件的处理程序（如果指定的事件不存在，则为该事件指定处理程序的代码就会静默地失败）。由于使用了 EventUtil.getWheelDelta()方法，我们定义的这个事件处理程序函数可以适用于任何一种情况。
本文仅限内部技术人员学习交流,不得作于其他商业用途.希望此文对广大技人员有所帮助。原创文章出自:南昌网站建设公司-百恒网络http://www.jxbh.cn/如转载请注明出处!

400-680-9298,0791-88117053

欢迎您的光顾，我们将竭诚为您服务×

售前咨询

售后服务