Today I found a function that responds to the scroll wheel on the Internet and rewritten it into the following class
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;');
}
When using it, you need to define an execution function to operate based on the value obtained from the above class and provide Adds an event to the specified web page element. For example,
function handle(delta)
{
document.getElementById('text').scrollTop -= delta * 20;
}
new wheelEvent(document.getElementById('text'), 'handle');
In the above example The first parameter is the web element that adds the scroll wheel event, the div with the id of text; the second parameter is the name of the execution function, handle.
The handle function must have and has only one parameter delta. When the wheel rolls up, delta is greater than 0, and when it goes down, delta is less than 0. The function of the handle function in the above example is to use the scroll wheel to implement the scroll bar function on the div.