汇盛国际注册:javascript 鼠标滚轮事件

标签:新闻动态    日期:2018-02-09 14:34    录入:汇盛国际平台    浏览:

  

[javascript,鼠标,滚轮,事件]javascript 鼠标滚轮事件

  今天在网上找来了响应滚轮的函数并改写成下面的类  
代码如下:
  
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 实现滚动条的功能

★★★小编:汇盛国际注册 整理文章,欢迎大家转载 ★★★
相关文章阅读
点击右上角的分享按钮即可收藏汇盛国际平台注册 随时随地与好友一起分享精彩内容噢
最近更新
热门排行