javascript 鼠标滚轮事件_Javascript教程-查字典教程网
javascript 鼠标滚轮事件
javascript 鼠标滚轮事件
发布时间:2016-12-30 来源:查字典编辑
摘要:今天在网上找来了响应滚轮的函数并改写成下面的类复制代码代码如下:functionwheelEvent(obj,handle){this.ha...

今天在网上找来了响应滚轮的函数并改写成下面的类

复制代码 代码如下:

function wheelEvent(obj, handle)

{

this.handle = handle;

// different events between Firefox and IE

window.addEventListener ? obj.addEventListener("DOMMouseScroll", this.wheel, false) : (obj.onmousewheel = this.wheel);

}

wheelEvent.prototype.wheel = function (event)

{

var ev = event || window.event;

var delta = ev.wheelDelta ? (ev.wheelDelta / 120) : (- ev.detail / 3); // Firefox using `wheelDelta` IE using `detail`

eval ('delta ? ' + parent.handle + '(delta) : null;');

}

在使用的时候需要定义一个执行函数,用以根据从上述类中获得的值进行操作,并为指定的网页元素添加事件。比如

复制代码 代码如下:

function handle(delta)

{

document.getElementById('text').scrollTop -= delta * 20;

}

new wheelEvent(document.getElementById('text'), 'handle');

在上例中第一个参数是添加滚轮事件的网页元素, id 为 text 的 div;第二个参数是执行函数的名字 handle。

其中 handle 函数必须有且只有一个参数delta,滚轮往上滚时 delta 大于 0,往下则小于 0。上例 handle 函数的作用是用滚轮对 div 实现滚动条的功能

相关阅读
推荐文章
猜你喜欢
附近的人在看
推荐阅读
拓展阅读
  • 大家都在看
  • 小编推荐
  • 猜你喜欢
  • 最新Javascript教程学习
    热门Javascript教程学习
    编程开发子分类