Skip to content

Commit 33eeed6

Browse files
committed
Update file: jquery-mousewheel-by-jquery.html
1 parent cf88871 commit 33eeed6

File tree

1 file changed

+64
-2
lines changed

1 file changed

+64
-2
lines changed

jquery-plugins/jquery-mousewheel-by-jquery.html

Lines changed: 64 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -174,12 +174,74 @@ <h1 id="packageName">Jquery Mousewheel</h1>
174174
</div>
175175
<div class="tab-content mt-3" id="infoTabsContent">
176176
<div class="tab-pane fade show active" id="installation" role="tabpanel" aria-labelledby="installation-tab">
177-
No README available
177+
# jQuery Mouse Wheel Plugin
178+
179+
A [jQuery](http://jquery.com/) plugin that adds cross-browser mouse wheel support with delta normalization.
180+
181+
In order to use the plugin, simply bind the `mousewheel` event to an element.
182+
183+
It also provides two helper methods called `mousewheel` and `unmousewheel`
184+
that act just like other event helper methods in jQuery.
185+
186+
The event object is updated with the normalized `deltaX` and `deltaY` properties.
187+
In addition there is a new property on the event object called `deltaFactor`. Multiply
188+
the `deltaFactor` by `deltaX` or `deltaY` to get the scroll distance that the browser
189+
has reported.
190+
191+
Here is an example of using both the bind and helper method syntax:
192+
193+
```js
194+
// using on
195+
$('#my_elem').on('mousewheel', function(event) {
196+
console.log(event.deltaX, event.deltaY, event.deltaFactor);
197+
});
198+
199+
// using the event helper
200+
$('#my_elem').mousewheel(function(event) {
201+
console.log(event.deltaX, event.deltaY, event.deltaFactor);
202+
});
203+
```
204+
205+
The old behavior of adding three arguments (`delta`, `deltaX`, and `deltaY`) to the
206+
event handler is now deprecated and will be removed in later releases.
207+
208+
209+
## The Deltas...
210+
211+
The combination of browsers, operating systems, and devices offer a huge range of possible delta values. In fact if the user
212+
uses a trackpad and then a physical mouse wheel the delta values can differ wildly. This plugin normalizes those
213+
values so you get a whole number starting at +-1 and going up in increments of +-1 according to the force or
214+
acceleration that is used. This number has the potential to be in the thousands depending on the device.
215+
Check out some of the data collected from users [here](http://mousewheeldatacollector.herokuapp.com/).
216+
217+
### Getting the scroll distance
218+
219+
In some use-cases we prefer to have the normalized delta but in others we want to know how far the browser should
220+
scroll based on the users input. This can be done by multiplying the `deltaFactor` by the `deltaX` or `deltaY`
221+
event property to find the scroll distance the browser reported.
222+
223+
The `deltaFactor` property was added to the event object in 3.1.5 so that the actual reported delta value can be
224+
extracted. This is a non-standard property.
225+
226+
## Building the code in the repo
227+
228+
```sh
229+
$ git clone git@github.com:jquery/jquery-mousewheel.git
230+
$ cd jquery-mousewheel/
231+
$ npm install
232+
$ npm run build
233+
$ npm run karma
234+
```
235+
236+
The unit tests run by karma are _very_ basic sanity checks; improvements welcome.
237+
To fully test the plugin, load [test/index.html](test/index.html) in each supported
238+
browser and follow the instructions at the top of the file after the unit tests finish.
239+
178240
</div>
179241

180242
<div class="tab-pane fade" id="changelog" role="tabpanel" aria-labelledby="changelog-tab">
181243
<ul id="changelogList">
182-
No changelog available.
244+
{"message":"Not Found","documentation_url":"https://docs.github.com/rest/repos/contents#get-repository-content","status":"404"}
183245
</ul>
184246
</div>
185247

0 commit comments

Comments
 (0)