11# jQuery Mouse Wheel Plugin
22
3- A [ jQuery] ( http ://jquery.com/) plugin that adds cross-browser mouse wheel support with delta normalization.
3+ A [ jQuery] ( https ://jquery.com/) plugin that adds cross-browser mouse wheel support with delta normalization.
44
55In order to use the plugin, simply bind the ` mousewheel ` event to an element.
66
7- It also provides two helper methods called ` mousewheel ` and ` unmousewheel `
7+ It also provides two deprecated helper methods called ` mousewheel ` and ` unmousewheel `
88that act just like other event helper methods in jQuery.
99
1010The event object is updated with the normalized ` deltaX ` and ` deltaY ` properties.
11- In addition there is a new property on the event object called ` deltaFactor ` . Multiply
11+ In addition, there is a new property on the event object called ` deltaFactor ` . Multiply
1212the ` deltaFactor ` by ` deltaX ` or ` deltaY ` to get the scroll distance that the browser
1313has reported.
1414
1515Here is an example of using both the bind and helper method syntax:
1616
1717``` js
1818// using on
19- $ (' #my_elem' ).on (' mousewheel' , function (event ) {
20- console .log (event .deltaX , event .deltaY , event .deltaFactor );
21- });
22-
23- // using the event helper
24- $ (' #my_elem' ).mousewheel (function (event ) {
25- console .log (event .deltaX , event .deltaY , event .deltaFactor );
26- });
19+ $ ( " #my_elem" ).on ( " mousewheel" , function ( event ) {
20+ console .log ( event .deltaX , event .deltaY , event .deltaFactor );
21+ } );
22+
23+ // using the event helper - not recommended!
24+ $ ( " #my_elem" ).mousewheel ( function ( event ) {
25+ console .log ( event .deltaX , event .deltaY , event .deltaFactor );
26+ } );
2727```
2828
2929The old behavior of adding three arguments (` delta ` , ` deltaX ` , and ` deltaY ` ) to the
@@ -36,7 +36,6 @@ The combination of browsers, operating systems, and devices offer a huge range o
3636uses a trackpad and then a physical mouse wheel the delta values can differ wildly. This plugin normalizes those
3737values so you get a whole number starting at +-1 and going up in increments of +-1 according to the force or
3838acceleration that is used. This number has the potential to be in the thousands depending on the device.
39- Check out some of the data collected from users [ here] ( http://mousewheeldatacollector.herokuapp.com/ ) .
4039
4140### Getting the scroll distance
4241
@@ -47,16 +46,15 @@ event property to find the scroll distance the browser reported.
4746The ` deltaFactor ` property was added to the event object in 3.1.5 so that the actual reported delta value can be
4847extracted. This is a non-standard property.
4948
50- ## Building the code in the repo
49+ ## Building the code in the repo & running tests
5150
5251``` sh
53- $ git clone git@github.com:jquery/jquery-mousewheel.git
54- $ cd jquery-mousewheel/
55- $ npm install
56- $ npm run build
57- $ npm run karma
52+ git clone git@github.com:jquery/jquery-mousewheel.git
53+ cd jquery-mousewheel/
54+ npm install
55+ npm test
5856```
5957
60- The unit tests run by karma are _ very_ basic sanity checks; improvements welcome.
58+ The unit tests are _ very_ basic sanity checks; improvements welcome.
6159To fully test the plugin, load [ test/index.html] ( test/index.html ) in each supported
6260browser and follow the instructions at the top of the file after the unit tests finish.
0 commit comments