2008-10-15 20:35:05 -05:00
|
|
|
# jQuery Mouse Wheel Plugin
|
|
|
|
|
2013-11-13 13:33:53 -05:00
|
|
|
A [jQuery](http://jquery.com/) plugin that adds cross-browser mouse wheel support with delta normalization.
|
2008-10-15 20:35:05 -05:00
|
|
|
|
2013-02-24 12:38:36 +02:00
|
|
|
In order to use the plugin, simply bind the `mousewheel` event to an element.
|
2013-11-13 13:33:53 -05:00
|
|
|
|
2013-02-24 12:38:36 +02:00
|
|
|
It also provides two helper methods called `mousewheel` and `unmousewheel`
|
2013-11-13 13:33:53 -05:00
|
|
|
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.
|
2010-02-12 17:05:51 -06:00
|
|
|
|
2013-09-10 10:26:28 +03:00
|
|
|
Here is an example of using both the bind and helper method syntax:
|
2010-02-12 17:05:51 -06:00
|
|
|
|
2013-02-24 12:38:36 +02:00
|
|
|
```js
|
2013-11-13 13:33:53 -05:00
|
|
|
// using on
|
|
|
|
$('#my_elem').on('mousewheel', function(event) {
|
|
|
|
console.log(event.deltaX, event.deltaY, event.deltaFactor);
|
2013-02-24 12:38:36 +02:00
|
|
|
});
|
2013-02-22 09:48:58 -06:00
|
|
|
|
2013-02-24 12:38:36 +02:00
|
|
|
// using the event helper
|
2013-11-13 13:33:53 -05:00
|
|
|
$('#my_elem').mousewheel(function(event) {
|
|
|
|
console.log(event.deltaX, event.deltaY, event.deltaFactor);
|
2013-02-24 12:38:36 +02:00
|
|
|
});
|
|
|
|
```
|
2010-02-12 17:05:51 -06:00
|
|
|
|
2013-11-13 13:33:53 -05:00
|
|
|
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.
|
|
|
|
|
|
|
|
|
2012-08-20 13:04:55 -05:00
|
|
|
## See it in action
|
2013-10-18 18:42:06 +03:00
|
|
|
[See the tests on Github](http://brandonaaron.github.io/jquery-mousewheel/test).
|
2013-03-12 09:21:08 -05:00
|
|
|
|
|
|
|
## Using with [Browserify](http://browserify.org)
|
|
|
|
|
|
|
|
Support for browserify is baked in.
|
|
|
|
|
2013-10-18 18:42:06 +03:00
|
|
|
```bash
|
2013-03-12 09:21:08 -05:00
|
|
|
npm install jquery-mousewheel
|
|
|
|
npm install jquery-browserify
|
|
|
|
```
|
|
|
|
|
|
|
|
In your server-side node.js code:
|
|
|
|
|
|
|
|
```js
|
|
|
|
var express = require('express');
|
|
|
|
var app = express.createServer();
|
|
|
|
|
|
|
|
app.use(require('browserify')({
|
|
|
|
require : [ 'jquery-browserify', 'jquery-mousewheel' ]
|
|
|
|
}));
|
|
|
|
```
|
|
|
|
|
|
|
|
In your browser-side javascript:
|
|
|
|
|
|
|
|
```js
|
|
|
|
var $ = require('jquery-browserify');
|
|
|
|
require('jquery-mousewheel')($);
|
|
|
|
```
|
2008-10-15 20:35:05 -05:00
|
|
|
|
|
|
|
## License
|
|
|
|
|
2013-02-24 12:38:36 +02:00
|
|
|
This plugin is licensed under the [MIT License](LICENSE.txt).
|
2008-10-15 20:35:05 -05:00
|
|
|
|
2013-10-18 18:52:17 -05:00
|
|
|
Copyright (c) 2013 [Brandon Aaron](http://brandon.aaron.sh)
|