jquery-mousewheel

A jQuery plugin that adds cross-browser mouse wheel support.

  • Owner: jquery/jquery-mousewheel
  • Platform:
  • License:: Other
  • Category::
  • Topic:
  • Like:
    0
      Compare:

Github stars Tracking Chart

jQuery Mouse Wheel Plugin

A jQuery plugin that adds cross-browser mouse wheel support with delta normalization.

In order to use the plugin, simply bind the mousewheel event to an element.

It also provides two helper methods called mousewheel and unmousewheel
that act just like other event helper methods in jQuery.

The event object is updated with the normalized deltaX and deltaY properties.
In addition there is a new property on the event object called deltaFactor. Multiply
the deltaFactor by deltaX or deltaY to get the scroll distance that the browser
has reported.

Here is an example of using both the bind and helper method syntax:

// using on
$('#my_elem').on('mousewheel', function(event) {
    console.log(event.deltaX, event.deltaY, event.deltaFactor);
});

// using the event helper
$('#my_elem').mousewheel(function(event) {
    console.log(event.deltaX, event.deltaY, event.deltaFactor);
});

The old behavior of adding three arguments (delta, deltaX, and deltaY) to the
event handler is now deprecated and will be removed in later releases.

The Deltas...

The combination of browsers, operating systems, and devices offer a huge range of possible delta values. In fact if the user
uses a trackpad and then a physical mouse wheel the delta values can differ wildly. This plugin normalizes those
values so you get a whole number starting at +-1 and going up in increments of +-1 according to the force or
acceleration that is used. This number has the potential to be in the thousands depending on the device.
Check out some of the data collected from users here.

Getting the scroll distance

In some use-cases we prefer to have the normalized delta but in others we want to know how far the browser should
scroll based on the users input. This can be done by multiplying the deltaFactor by the deltaX or deltaY
event property to find the scroll distance the browser reported.

The deltaFactor property was added to the event object in 3.1.5 so that the actual reported delta value can be
extracted. This is a non-standard property.

Building the code in the repo

$ git clone git@github.com:jquery/jquery-mousewheel.git
$ cd jquery-mousewheel/
$ npm install
$ npm run build
$ npm run karma

The unit tests run by karma are very basic sanity checks; improvements welcome.
To fully test the plugin, load test/index.html in each supported
browser and follow the instructions at the top of the file after the unit tests finish.

Main metrics

Overview
Name With Ownerjquery/jquery-mousewheel
Primary LanguageHTML
Program languageJavaScript (Language Count: 3)
Platform
License:Other
所有者活动
Created At2008-10-16 01:30:34
Pushed At2025-05-15 16:03:05
Last Commit At
Release Count21
Last Release Name3.2.2 (Posted on 2025-03-17 23:54:30)
First Release Name3.0.3 (Posted on )
用户参与
Stargazers Count3.9k
Watchers Count170
Fork Count1.7k
Commits Count205
Has Issues Enabled
Issues Count161
Issue Open Count4
Pull Requests Count48
Pull Requests Open Count6
Pull Requests Close Count33
项目设置
Has Wiki Enabled
Is Archived
Is Fork
Is Locked
Is Mirror
Is Private