├── .gitignore
├── test
    ├── browserify
    │   ├── main.js
    │   ├── index.html
    │   └── README.md
    ├── scroll.html
    └── index.html
├── bower.json
├── .jshintrc
├── package.json
├── Gruntfile.js
├── LICENSE.txt
├── jquery.mousewheel.min.js
├── README.md
├── ChangeLog.md
└── jquery.mousewheel.js


/.gitignore:
--------------------------------------------------------------------------------
1 | .DS_Store
2 | /npm-debug.log
3 | /node_modules
4 | /test/browserify/node_modules
5 | 


--------------------------------------------------------------------------------
/test/browserify/main.js:
--------------------------------------------------------------------------------
1 | var $ = require('jquery-browserify');
2 | require('../../jquery.mousewheel.js')($);
3 | 


--------------------------------------------------------------------------------
/test/browserify/index.html:
--------------------------------------------------------------------------------
1 | <script src="bundle.js"></script>
2 | <script>
3 |     $(document).bind('mousewheel', function(e) { console.log(e); });
4 | </script>
5 | 


--------------------------------------------------------------------------------
/test/browserify/README.md:
--------------------------------------------------------------------------------
 1 | # browserify test
 2 | 
 3 | First run
 4 | 
 5 | ```js
 6 | npm install jquery-browserify
 7 | ```
 8 | 
 9 | Then run
10 | 
11 | ```js
12 | browserify main.js > bundle.js
13 | ```
14 | 
15 | Then open index.html and console and scroll with the mousewheel. Should see the events being logged.
16 | 


--------------------------------------------------------------------------------
/bower.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "name": "jquery-mousewheel",
 3 |   "main": "./jquery.mousewheel.js",
 4 |   "ignore": [
 5 |     "*.json",
 6 |     "*.markdown",
 7 |     "*.txt",
 8 |     ".*",
 9 |     "!LICENSE.txt",
10 |     "Gruntfile.js",
11 |     "test"
12 |   ],
13 |   "dependencies": {
14 |     "jquery": ">=1.2.2"
15 |   }
16 | }
17 | 


--------------------------------------------------------------------------------
/.jshintrc:
--------------------------------------------------------------------------------
 1 | {
 2 |     "bitwise": true,
 3 |     "browser": true,
 4 |     "camelcase": true,
 5 |     "curly": true,
 6 |     "eqeqeq": true,
 7 |     "indent": 4,
 8 |     "jquery" : true,
 9 |     "latedef": true,
10 |     "noarg": true,
11 |     "node": true,
12 |     "noempty": true,
13 |     "plusplus": false,
14 |     "quotmark": "single",
15 |     "strict": false,
16 |     "trailing": true,
17 |     "unused": true,
18 |     "globals": { "define": true, "require": true }
19 | }
20 | 


--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "name": "jquery-mousewheel",
 3 |   "version": "3.1.13",
 4 |   "author": {
 5 |     "name": "jQuery Foundation and other contributors",
 6 |     "url": "https://github.com/jquery/jquery-mousewheel/blob/master/AUTHORS.txt"
 7 |   },
 8 |   "description": "A jQuery plugin that adds cross-browser mouse wheel support.",
 9 |   "licenses": [
10 |     {
11 |       "type": "MIT",
12 |       "url": "https://github.com/jquery/jquery-mousewheel/blob/master/LICENSE.txt"
13 |     }
14 |   ],
15 |   "homepage": "https://github.com/jquery/jquery-mousewheel",
16 |   "main": "./jquery.mousewheel.js",
17 |   "repository": {
18 |     "type": "git",
19 |     "url": "https://github.com/jquery/jquery-mousewheel.git"
20 |   },
21 |   "bugs": {
22 |     "url": "https://github.com/jquery/jquery-mousewheel/issues"
23 |   },
24 |   "keywords": [
25 |     "jquery",
26 |     "mouse",
27 |     "wheel",
28 |     "event",
29 |     "mousewheel",
30 |     "jquery-plugin",
31 |     "browser"
32 |   ],
33 |   "files": [
34 |     "ChangeLog.md",
35 |     "jquery.mousewheel.js",
36 |     "README.md",
37 |     "LICENSE.txt"
38 |   ],
39 |   "devDependencies": {
40 |     "grunt": "~0.4.1",
41 |     "grunt-contrib-connect": "~0.5.0",
42 |     "grunt-contrib-jshint": "~0.7.1",
43 |     "grunt-contrib-uglify": "~0.2.7"
44 |   },
45 |   "directories": {
46 |     "test": "test"
47 |   },
48 |   "jam": {
49 |     "dependencies": {
50 |       "jquery": ">=1.2.2"
51 |     }
52 |   }
53 | }
54 | 


--------------------------------------------------------------------------------
/Gruntfile.js:
--------------------------------------------------------------------------------
 1 | module.exports = function(grunt) {
 2 | 
 3 |     // Project configuration.
 4 |     grunt.initConfig({
 5 |         jshint: {
 6 |             options: {
 7 |                 jshintrc: '.jshintrc'
 8 |             },
 9 |             all: ['jquery.mousewheel.js']
10 |         },
11 |         uglify: {
12 |             options: {
13 |                 compress: true,
14 |                 mangle: true,
15 |                 preserveComments: 'some',
16 |                 report: 'gzip'
17 |             },
18 |             build: {
19 |                 src: 'jquery.mousewheel.js',
20 |                 dest: 'jquery.mousewheel.min.js'
21 |             }
22 |         },
23 |         connect: {
24 |             server: {
25 |                 options: {
26 |                     hostname: '*',
27 |                     keepalive: true,
28 |                     middleware: function(connect, options) {
29 |                         return [
30 |                             connect.static(options.base),
31 |                             connect.directory(options.base)
32 |                         ];
33 |                     }
34 |                 }
35 |             }
36 |         }
37 |     });
38 | 
39 |     // Load the plugin that provides the 'uglify' task.
40 |     grunt.loadNpmTasks('grunt-contrib-jshint');
41 |     grunt.loadNpmTasks('grunt-contrib-uglify');
42 |     grunt.loadNpmTasks('grunt-contrib-connect');
43 | 
44 |     // Default task(s).
45 |     grunt.registerTask('default', ['jshint', 'uglify']);
46 | 
47 | };
48 | 


--------------------------------------------------------------------------------
/LICENSE.txt:
--------------------------------------------------------------------------------
 1 | Copyright jQuery Foundation and other contributors
 2 | https://jquery.org/
 3 | 
 4 | This software consists of voluntary contributions made by many
 5 | individuals. For exact contribution history, see the revision history
 6 | available at https://github.com/jquery/jquery-mousewheel
 7 | 
 8 | The following license applies to all parts of this software except as
 9 | documented below:
10 | 
11 | ====
12 | 
13 | Permission is hereby granted, free of charge, to any person obtaining
14 | a copy of this software and associated documentation files (the
15 | "Software"), to deal in the Software without restriction, including
16 | without limitation the rights to use, copy, modify, merge, publish,
17 | distribute, sublicense, and/or sell copies of the Software, and to
18 | permit persons to whom the Software is furnished to do so, subject to
19 | the following conditions:
20 | 
21 | The above copyright notice and this permission notice shall be
22 | included in all copies or substantial portions of the Software.
23 | 
24 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
25 | EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
26 | MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
27 | NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
28 | LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
29 | OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
30 | WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
31 | 
32 | ====
33 | 
34 | All files located in the node_modules and external directories are
35 | externally maintained libraries used by this software which have their
36 | own licenses; we recommend you read them, as their terms may differ from
37 | the terms above.
38 | 


--------------------------------------------------------------------------------
/test/scroll.html:
--------------------------------------------------------------------------------
 1 | <!doctype html>
 2 | <html>
 3 |   <head>
 4 |     <title>Scroll Test</title>
 5 |     <style>
 6 |       html, body { margin: 0; padding: 0; width: 100%; height: 100%; }
 7 |       #emulated, #native {
 8 |         width: 40%;
 9 |         height: 100%;
10 |       }
11 |       #emulated { float: left; overflow: hidden; }
12 |       #native { float: right; overflow: auto; }
13 |     </style>
14 |     <script>
15 |       (function() {
16 |         var verMatch = /v=([\w\.]+)/.exec(location.search),
17 |             version = verMatch && verMatch[1],
18 |             src;
19 |         if (version)
20 |           src = 'code.jquery.com/jquery-' + version;
21 |         else
22 |           src = 'code.jquery.com/jquery-git';
23 |         document.write('<script src="http://' + src + '.js"><\/script>');
24 |       })();
25 |     </script>
26 |     <script src="../jquery.mousewheel.js"></script>
27 |     <script>
28 |       var lorem = 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus rhoncus nibh ac ultricies blandit. Nunc blandit blandit lobortis. Maecenas id dolor scelerisque, facilisis dolor eu, interdum urna. Nullam consectetur lectus quis mi interdum accumsan. Nulla malesuada est nec neque suscipit pulvinar. Vivamus sagittis, nunc a porttitor tempus, mi neque eleifend diam, nec porttitor metus dui a orci. Cras tempus lobortis nisl ut sagittis. Maecenas semper in magna mollis venenatis. Vestibulum fermentum tincidunt fringilla.';
29 |       $(function() {
30 |         for (var i=0; i<30; i++) {
31 |           var html = '<p>' + i + ' ' + lorem + '</p>';
32 |           $('#emulated').append(html);
33 |           $('#native').append(html);
34 |         }
35 |         $('#emulated').bind('mousewheel', function(event) {
36 |           event.preventDefault();
37 |           var scrollTop = this.scrollTop;
38 |           this.scrollTop = (scrollTop + ((event.deltaY * event.deltaFactor) * -1));
39 |           //console.log(event.deltaY, event.deltaFactor, event.originalEvent.deltaMode, event.originalEvent.wheelDelta);
40 |         });
41 |       });
42 |     </script>
43 |   </head>
44 |   <body>
45 |     <div id="emulated"></div>
46 |     <div id="native"></div>
47 |   </body>
48 | </html>
49 | 


--------------------------------------------------------------------------------
/jquery.mousewheel.min.js:
--------------------------------------------------------------------------------
1 | /*!
2 |  * jQuery Mousewheel 3.1.13
3 |  *
4 |  * Copyright 2015 jQuery Foundation and other contributors
5 |  * Released under the MIT license.
6 |  * http://jquery.org/license
7 |  */
8 | !function(a){"function"==typeof define&&define.amd?define(["jquery"],a):"object"==typeof exports?module.exports=a:a(jQuery)}(function(a){function b(b){var g=b||window.event,h=i.call(arguments,1),j=0,l=0,m=0,n=0,o=0,p=0;if(b=a.event.fix(g),b.type="mousewheel","detail"in g&&(m=-1*g.detail),"wheelDelta"in g&&(m=g.wheelDelta),"wheelDeltaY"in g&&(m=g.wheelDeltaY),"wheelDeltaX"in g&&(l=-1*g.wheelDeltaX),"axis"in g&&g.axis===g.HORIZONTAL_AXIS&&(l=-1*m,m=0),j=0===m?l:m,"deltaY"in g&&(m=-1*g.deltaY,j=m),"deltaX"in g&&(l=g.deltaX,0===m&&(j=-1*l)),0!==m||0!==l){if(1===g.deltaMode){var q=a.data(this,"mousewheel-line-height");j*=q,m*=q,l*=q}else if(2===g.deltaMode){var r=a.data(this,"mousewheel-page-height");j*=r,m*=r,l*=r}if(n=Math.max(Math.abs(m),Math.abs(l)),(!f||f>n)&&(f=n,d(g,n)&&(f/=40)),d(g,n)&&(j/=40,l/=40,m/=40),j=Math[j>=1?"floor":"ceil"](j/f),l=Math[l>=1?"floor":"ceil"](l/f),m=Math[m>=1?"floor":"ceil"](m/f),k.settings.normalizeOffset&&this.getBoundingClientRect){var s=this.getBoundingClientRect();o=b.clientX-s.left,p=b.clientY-s.top}return b.deltaX=l,b.deltaY=m,b.deltaFactor=f,b.offsetX=o,b.offsetY=p,b.deltaMode=0,h.unshift(b,j,l,m),e&&clearTimeout(e),e=setTimeout(c,200),(a.event.dispatch||a.event.handle).apply(this,h)}}function c(){f=null}function d(a,b){return k.settings.adjustOldDeltas&&"mousewheel"===a.type&&b%120===0}var e,f,g=["wheel","mousewheel","DOMMouseScroll","MozMousePixelScroll"],h="onwheel"in document||document.documentMode>=9?["wheel"]:["mousewheel","DomMouseScroll","MozMousePixelScroll"],i=Array.prototype.slice;if(a.event.fixHooks)for(var j=g.length;j;)a.event.fixHooks[g[--j]]=a.event.mouseHooks;var k=a.event.special.mousewheel={version:"3.1.12",setup:function(){if(this.addEventListener)for(var c=h.length;c;)this.addEventListener(h[--c],b,!1);else this.onmousewheel=b;a.data(this,"mousewheel-line-height",k.getLineHeight(this)),a.data(this,"mousewheel-page-height",k.getPageHeight(this))},teardown:function(){if(this.removeEventListener)for(var c=h.length;c;)this.removeEventListener(h[--c],b,!1);else this.onmousewheel=null;a.removeData(this,"mousewheel-line-height"),a.removeData(this,"mousewheel-page-height")},getLineHeight:function(b){var c=a(b),d=c["offsetParent"in a.fn?"offsetParent":"parent"]();return d.length||(d=a("body")),parseInt(d.css("fontSize"),10)||parseInt(c.css("fontSize"),10)||16},getPageHeight:function(b){return a(b).height()},settings:{adjustOldDeltas:!0,normalizeOffset:!0}};a.fn.extend({mousewheel:function(a){return a?this.bind("mousewheel",a):this.trigger("mousewheel")},unmousewheel:function(a){return this.unbind("mousewheel",a)}})});


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
 1 | # jQuery Mouse Wheel Plugin
 2 | 
 3 | A [jQuery](http://jquery.com/) plugin that adds cross-browser mouse wheel support with delta normalization.
 4 | 
 5 | #### Note: There is a [bug in Safari 9](https://github.com/jquery/jquery-mousewheel/issues/156) that prevents the plugin from working properly. See [this comment](https://github.com/jquery/jquery-mousewheel/issues/156#issuecomment-185433754) for some possible workarounds, and [watch this Webkit ticket](https://bugs.webkit.org/show_bug.cgi?id=149526) to find out if and when Apple will fix it.
 6 | 
 7 | In order to use the plugin, simply bind the `mousewheel` event to an element.
 8 | 
 9 | It also provides two helper methods called `mousewheel` and `unmousewheel`
10 | that act just like other event helper methods in jQuery.
11 | 
12 | The event object is updated with the normalized `deltaX` and `deltaY` properties.
13 | In addition there is a new property on the event object called `deltaFactor`. Multiply
14 | the `deltaFactor` by `deltaX` or `deltaY` to get the scroll distance that the browser
15 | has reported.
16 | 
17 | Here is an example of using both the bind and helper method syntax:
18 | 
19 | ```js
20 | // using on
21 | $('#my_elem').on('mousewheel', function(event) {
22 |     console.log(event.deltaX, event.deltaY, event.deltaFactor);
23 | });
24 | 
25 | // using the event helper
26 | $('#my_elem').mousewheel(function(event) {
27 |     console.log(event.deltaX, event.deltaY, event.deltaFactor);
28 | });
29 | ```
30 | 
31 | The old behavior of adding three arguments (`delta`, `deltaX`, and `deltaY`) to the
32 | event handler is now deprecated and will be removed in later releases.
33 | 
34 | 
35 | ## The Deltas...
36 | 
37 | The combination of Browsers, Operating Systems, and Devices offer a huge range of possible delta values. In fact if the user
38 | uses a trackpad and then a physical mouse wheel the delta values can differ wildly. This plugin normalizes those
39 | values so you get a whole number starting at +-1 and going up in increments of +-1 according to the force or
40 | acceleration that is used. This number has the potential to be in the thousands depending on the device.
41 | Check out some of the data collected from users [here](http://mousewheeldatacollector.herokuapp.com/).
42 | 
43 | ### Getting the scroll distance
44 | 
45 | In some use-cases we prefer to have the normalized delta but in others we want to know how far the browser should
46 | scroll based on the users input. This can be done by multiplying the `deltaFactor` by the `deltaX` or `deltaY`
47 | event property to find the scroll distance the browser reported.
48 | 
49 | The `deltaFactor` property was added to the event object in 3.1.5 so that the actual reported delta value can be
50 | extracted. This is a non-standard property.
51 | 
52 | 
53 | ## Using with [Browserify](http://browserify.org)
54 | 
55 | Support for browserify is baked in.
56 | 
57 | ```bash
58 | npm install jquery-mousewheel
59 | npm install jquery-browserify
60 | ```
61 | 
62 | In your server-side node.js code:
63 | 
64 | ```js
65 | var express = require('express');
66 | var app = express.createServer();
67 | 
68 | app.use(require('browserify')({
69 |     require : [ 'jquery-browserify', 'jquery-mousewheel' ]
70 | }));
71 | ```
72 | 
73 | In your browser-side javascript:
74 | 
75 | ```js
76 | var $ = require('jquery-browserify');
77 | require('jquery-mousewheel')($);
78 | ```
79 | 


--------------------------------------------------------------------------------
/ChangeLog.md:
--------------------------------------------------------------------------------
  1 | # Mouse Wheel ChangeLog
  2 | 
  3 | ## 3.1.13
  4 | 
  5 | * Update copyright notice and license to remove years
  6 | * Create the correct compressed version
  7 | * Remove the obsolete jQuery Plugin Registry file
  8 | 
  9 | ## 3.1.12
 10 | 
 11 | * Fix possible 0 value for line height when in delta mode 1
 12 | 
 13 | ## 3.1.11
 14 | 
 15 | * Fix version number for package managers...
 16 | 
 17 | ## 3.1.10
 18 | 
 19 | * Fix issue with calculating line height when using older versions of jQuery
 20 | * Add offsetX/Y normalization with setting to turn it off
 21 | * Cleans up data on teardown
 22 | 
 23 | ## 3.1.9
 24 | 
 25 | * Fix bower.json file
 26 | * Updated how the deltas are adjusted for older mousewheel based events that have deltas that are factors of 120.
 27 | * Add $.event.special.mousewheel.settings.adjustOldDeltas (defaults to true) to turn off adjusting of old deltas that are factors of 120. You'd turn this off if you want to be as close to native scrolling as possible.
 28 | 
 29 | ## 3.1.8
 30 | 
 31 | * Even better handling of older browsers that use a wheelDelta based on 120
 32 | * And fix version reported by `$.event.special.mousewheel`
 33 | 
 34 | ## 3.1.7
 35 | 
 36 | * Better handle the `deltaMode` values 1 (lines) and 2 (pages)
 37 | * Attempt to better handle older browsers that use a wheelDelta based on 120
 38 | 
 39 | ## 3.1.6
 40 | 
 41 | * Deprecating `delta`, `deltaX`, and `deltaY` event handler arguments
 42 | * Update actual event object with normalized `deltaX `and `deltaY` values (`event.deltaX`, `event.deltaY`)
 43 | * Add `deltaFactor` to the event object (`event.deltaFactor`)
 44 | * Handle `> 0` but `< 1` deltas better
 45 | * Do not fire the event if `deltaX` and `deltaY` are `0`
 46 | * Better handle different devices that give different `lowestDelta` values
 47 | * Add `$.event.special.mousewheel.version`
 48 | * Some clean up
 49 | 
 50 | ## 3.1.5
 51 | 
 52 | * Bad release because I did not update the new `$.event.special.mousewheel.version`
 53 | 
 54 | ## 3.1.4
 55 | 
 56 | * Always set the `deltaY`
 57 | * Add back in the `deltaX` and `deltaY` support for older Firefox versions
 58 | 
 59 | ## 3.1.3
 60 | 
 61 | * Include `MozMousePixelScroll` in the to fix list to avoid inconsistent behavior in older Firefox
 62 | 
 63 | ## 3.1.2
 64 | 
 65 | * Include grunt utilities for development purposes (jshint and uglify)
 66 | * Include support for browserify
 67 | * Some basic cleaning up
 68 | 
 69 | ## 3.1.1
 70 | 
 71 | * Fix rounding issue with deltas less than zero
 72 | 
 73 | 
 74 | ## 3.1.0
 75 | 
 76 | * Fix Firefox 17+ issues by using new wheel event
 77 | * Normalize delta values
 78 | * Adds horizontal support for IE 9+ by using new wheel event
 79 | * Support AMD loaders
 80 | 
 81 | 
 82 | ## 3.0.6
 83 | 
 84 | * Fix issue with delta being 0 in Firefox
 85 | 
 86 | 
 87 | ## 3.0.5
 88 | 
 89 | * jQuery 1.7 compatibility
 90 | 
 91 | 
 92 | ## 3.0.4
 93 | 
 94 | * Fix IE issue
 95 | 
 96 | 
 97 | ## 3.0.3
 98 | 
 99 | * Added `deltaX` and `deltaY` for horizontal scrolling support (Thanks to Seamus Leahy)
100 | 
101 | 
102 | ## 3.0.2
103 | 
104 | * Fixed delta being opposite value in latest Opera
105 | * No longer fix `pageX`, `pageY` for older Mozilla browsers
106 | * Removed browser detection
107 | * Cleaned up the code
108 | 
109 | 
110 | ## 3.0.1
111 | 
112 | * Bad release... creating a new release due to plugins.jquery.com issue :(
113 | 
114 | 
115 | ## 3.0
116 | 
117 | * Uses new special events API in jQuery 1.2.2+
118 | * You can now treat `mousewheel` as a normal event and use `.bind`, `.unbind` and `.trigger`
119 | * Using jQuery.data API for expandos
120 | 
121 | 
122 | ## 2.2
123 | 
124 | * Fixed `pageX`, `pageY`, `clientX` and `clientY` event properties for Mozilla based browsers
125 | 
126 | 
127 | ## 2.1.1
128 | 
129 | * Updated to work with jQuery 1.1.3
130 | * Used one instead of bind to do unload event for clean up
131 | 
132 | 
133 | ## 2.1
134 | 
135 | * Fixed an issue with the unload handler
136 | 
137 | 
138 | ## 2.0
139 | 
140 | * Major reduction in code size and complexity (internals have change a whole lot)
141 | 
142 | 
143 | ## 1.0
144 | 
145 | * Fixed Opera issue
146 | * Fixed an issue with children elements that also have a mousewheel handler
147 | * Added ability to handle multiple handlers
148 | 


--------------------------------------------------------------------------------
/test/index.html:
--------------------------------------------------------------------------------
  1 | <!DOCTYPE html>
  2 | <html lang="en">
  3 |     <head>
  4 |         <meta charset="iso-8859-1">
  5 |         <title>Testing mousewheel plugin</title>
  6 | 
  7 |         <style>
  8 |             html {
  9 |                 font: 13px Arial, sans-serif;
 10 |             }
 11 | 
 12 |             #stage {
 13 |                 color: #fff;
 14 |                 position: relative;
 15 |                 zoom: 1;
 16 |             }
 17 | 
 18 |             #test1, #test2, #test3, #test4, #test5, #test6, #test7 {
 19 |                 float: left;
 20 |             }
 21 | 
 22 |             #test1 {
 23 |                 background-color: #000;
 24 |                 width: 120px;
 25 |                 height: 100px;
 26 |             }
 27 | 
 28 |             #test2 {
 29 |                 background-color: #333;
 30 |                 width: 120px;
 31 |                 height: 100px;
 32 |             }
 33 | 
 34 |             #test3 {
 35 |                 background-color: #666;
 36 |                 width: 120px;
 37 |                 height: 100px;
 38 |             }
 39 | 
 40 |             #test4 {
 41 |                 background-color: #000;
 42 |                 width: 120px;
 43 |                 height: 100px;
 44 |             }
 45 | 
 46 |             #test5 {
 47 |                 background-color: #333;
 48 |                 padding: 5px;
 49 |                 width: 400px;
 50 |                 height: 400px;
 51 |             }
 52 | 
 53 |             #test6 {
 54 |                 background-color: #666;
 55 |                 padding: 5px;
 56 |                 width: 250px;
 57 |                 height: 250px;
 58 |             }
 59 | 
 60 |             #test7 {
 61 |                 background-color: #000;
 62 |                 padding: 5px;
 63 |                 width: 100px;
 64 |                 height: 100px;
 65 |             }
 66 | 
 67 |             #forceScroll {
 68 |                 clear: both;
 69 |                 height: 1000px;
 70 |             }
 71 | 
 72 |             #logger {
 73 |                 position: absolute;
 74 |                 top: 100px;
 75 |                 left: 0;
 76 |                 width: 480px;
 77 |                 height: 310px;
 78 |                 overflow: auto;
 79 |                 z-index: 100;
 80 |             }
 81 | 
 82 |             #logger p {
 83 |                 color: #000;
 84 |                 padding: 2px;
 85 |                 border-bottom: 1px solid #ccc;
 86 |                 margin: 0;
 87 |             }
 88 | 
 89 |             #logger p:nth-child(even) {
 90 |                 background-color: #ffffe8;
 91 |             }
 92 | 
 93 |             #logger p:nth-child(10n) {
 94 |                 border-bottom-color: #000;
 95 |             }
 96 |         </style>
 97 | 
 98 |         <script>
 99 |             (function() {
100 |                 var verMatch = /v=([\w\.]+)/.exec(location.search),
101 |                     version = verMatch && verMatch[1],
102 |                     src;
103 |                 if (version)
104 |                     src = 'code.jquery.com/jquery-' + version;
105 |                 else
106 |                     src = 'code.jquery.com/jquery-git';
107 |                 document.write('<script src="http://' + src + '.js"><\/script>');
108 |             })();
109 |         </script>
110 |         <script>
111 |             $(function() {
112 |                 $('#userAgent').html(navigator.userAgent);
113 |                 $('#jqueryVersion').html($.fn.jquery);
114 | 
115 |                 var loghandle = function(event, delta) {
116 |                     var o = '', id = event.currentTarget.id || event.currentTarget.nodeName;
117 | 
118 |                     o = '#' + id + ':';
119 | 
120 |                     if (delta > 0)
121 |                         o += ' up (' + delta + ')';
122 |                     else if (delta < 0)
123 |                         o += ' down (' + delta + ')';
124 | 
125 |                     if (event.deltaY > 0)
126 |                         o += ' north (' + event.deltaY + ')';
127 |                     else if (event.deltaY < 0)
128 |                         o += ' south (' + event.deltaY + ')';
129 | 
130 |                     if (event.deltaX > 0)
131 |                         o += ' east (' + event.deltaX + ')';
132 |                     else if (event.deltaX < 0)
133 |                         o += ' west (' + event.deltaX + ')';
134 | 
135 |                     o += ' deltaFactor (' + event.deltaFactor + ')';
136 | 
137 |                     log( o );
138 |                 };
139 | 
140 |                 $(document)
141 |                     .mousewheel(function(event, delta) {
142 |                         loghandle(event, delta);
143 |                     });
144 | 
145 |                 $('#test1')
146 |                     .mousewheel(function(event, delta) {
147 |                         loghandle(event, delta);
148 |                         log('pageX: ' + event.pageX + ' pageY: ' + event.pageY );
149 |                     });
150 | 
151 |                 $('#test2')
152 |                     .mousewheel(function(event, delta) {
153 |                         loghandle(event, delta);
154 |                         return false; // prevent default
155 |                     });
156 | 
157 |                 $('#test3')
158 |                     .hover(function() { log('#test3: mouseover'); }, function() { log('#test3: mouseout'); })
159 |                     .mousewheel(function() {
160 |                         log('#test3: I should not have been logged');
161 |                     })
162 |                     .unmousewheel();
163 | 
164 |                 var testRemoval = function() {
165 |                     log('#test4: I should not have been logged');
166 |                 };
167 | 
168 |                 $('#test4')
169 |                     .mousewheel(function(event, delta) {
170 |                         loghandle(event, delta);
171 |                         return false;
172 |                     })
173 |                     .mousewheel(testRemoval)
174 |                     .mousewheel(function(event, delta) {
175 |                         loghandle(event, delta);
176 |                         return false;
177 |                     })
178 |                     .unmousewheel(testRemoval);
179 | 
180 |                 $('#test5')
181 |                     .mousewheel(function(event, delta) {
182 |                         loghandle(event, delta);
183 |                         event.stopPropagation();
184 |                         event.preventDefault();
185 |                     });
186 | 
187 |                 $('#test6')
188 |                     .mousewheel(function(event, delta) {
189 |                         loghandle(event, delta);
190 |                         event.stopPropagation();
191 |                         event.preventDefault();
192 |                     });
193 | 
194 |                 $('#test7')
195 |                     .mousewheel(function(event, delta) {
196 |                         loghandle(event, delta);
197 |                         event.preventDefault();
198 |                     });
199 | 
200 |                 function log(msg) {
201 |                     $('#logger').append('<p>' + msg + '<\/p>')[0].scrollTop = 999999;
202 |                 }
203 |             });
204 |         </script>
205 |         <script src="../jquery.mousewheel.js"></script>
206 |     </head>
207 |     <body>
208 |         <h1 id="banner">jQuery mousewheel.js Test with jQuery <span id="jqueryVersion"></span></h1>
209 |         <h2 id="userAgent"></h2>
210 | 
211 |         <ul>
212 |             <li><strong>Test1</strong> is just using the plain on <code>mousewheel()</code> with a function passed in and does not prevent default. (Also logs the value of <code>pageX</code> and <code>pageY</code> event properties.)</li>
213 |             <li><strong>Test2</strong> should prevent the default action.</li>
214 |             <li><strong>Test3</strong> should only log a <code>mouseover</code> and <code>mouseout</code> event. Testing <code>unmousewheel()</code>.</li>
215 |             <li><strong>Test4</strong> has two handlers.</li>
216 |             <li><strong>Test5</strong> is like Test2 but has children. The children should not scroll until mousing over them.</li>
217 |             <li><strong>Test6</strong> is like Test5 but should not scroll children or parents.</li>
218 |             <li><strong>Test7</strong> is like Test6 but has no children. It will propagate the event and scroll test 6 as well.</li>
219 |         </ul>
220 | 
221 | 
222 |         <div id="stage">
223 |             <div id="test1"><p>Test1</p></div>
224 |             <div id="test2"><p>Test2</p></div>
225 |             <div id="test3"><p>Test3</p></div>
226 |             <div id="test4"><p>Test4</p></div>
227 |             <div id="test5">
228 |                 <p>Test5</p>
229 |                 <div id="test6">
230 |                     <p>Test6</p>
231 |                     <div id="test7"><p>Test7</p></div>
232 |                 </div>
233 |             </div>
234 |             <div id="logger"></div>
235 |         </div>
236 | 
237 |         <div id="forceScroll"></div>
238 |     </body>
239 | </html>
240 | 


--------------------------------------------------------------------------------
/jquery.mousewheel.js:
--------------------------------------------------------------------------------
  1 | /*!
  2 |  * jQuery Mousewheel 3.1.13
  3 |  *
  4 |  * Copyright jQuery Foundation and other contributors
  5 |  * Released under the MIT license
  6 |  * http://jquery.org/license
  7 |  */
  8 | 
  9 | (function (factory) {
 10 |     if ( typeof define === 'function' && define.amd ) {
 11 |         // AMD. Register as an anonymous module.
 12 |         define(['jquery'], factory);
 13 |     } else if (typeof exports === 'object') {
 14 |         // Node/CommonJS style for Browserify
 15 |         module.exports = factory;
 16 |     } else {
 17 |         // Browser globals
 18 |         factory(jQuery);
 19 |     }
 20 | }(function ($) {
 21 | 
 22 |     var toFix  = ['wheel', 'mousewheel', 'DOMMouseScroll', 'MozMousePixelScroll'],
 23 |         toBind = ( 'onwheel' in document || document.documentMode >= 9 ) ?
 24 |                     ['wheel'] : ['mousewheel', 'DomMouseScroll', 'MozMousePixelScroll'],
 25 |         slice  = Array.prototype.slice,
 26 |         nullLowestDeltaTimeout, lowestDelta;
 27 | 
 28 |     if ( $.event.fixHooks ) {
 29 |         for ( var i = toFix.length; i; ) {
 30 |             $.event.fixHooks[ toFix[--i] ] = $.event.mouseHooks;
 31 |         }
 32 |     }
 33 | 
 34 |     var special = $.event.special.mousewheel = {
 35 |         version: '3.1.12',
 36 | 
 37 |         setup: function() {
 38 |             if ( this.addEventListener ) {
 39 |                 for ( var i = toBind.length; i; ) {
 40 |                     this.addEventListener( toBind[--i], handler, false );
 41 |                 }
 42 |             } else {
 43 |                 this.onmousewheel = handler;
 44 |             }
 45 |             // Store the line height and page height for this particular element
 46 |             $.data(this, 'mousewheel-line-height', special.getLineHeight(this));
 47 |             $.data(this, 'mousewheel-page-height', special.getPageHeight(this));
 48 |         },
 49 | 
 50 |         teardown: function() {
 51 |             if ( this.removeEventListener ) {
 52 |                 for ( var i = toBind.length; i; ) {
 53 |                     this.removeEventListener( toBind[--i], handler, false );
 54 |                 }
 55 |             } else {
 56 |                 this.onmousewheel = null;
 57 |             }
 58 |             // Clean up the data we added to the element
 59 |             $.removeData(this, 'mousewheel-line-height');
 60 |             $.removeData(this, 'mousewheel-page-height');
 61 |         },
 62 | 
 63 |         getLineHeight: function(elem) {
 64 |             var $elem = $(elem),
 65 |                 $parent = $elem['offsetParent' in $.fn ? 'offsetParent' : 'parent']();
 66 |             if (!$parent.length) {
 67 |                 $parent = $('body');
 68 |             }
 69 |             return parseInt($parent.css('fontSize'), 10) || parseInt($elem.css('fontSize'), 10) || 16;
 70 |         },
 71 | 
 72 |         getPageHeight: function(elem) {
 73 |             return $(elem).height();
 74 |         },
 75 | 
 76 |         settings: {
 77 |             adjustOldDeltas: true, // see shouldAdjustOldDeltas() below
 78 |             normalizeOffset: true  // calls getBoundingClientRect for each event
 79 |         }
 80 |     };
 81 | 
 82 |     $.fn.extend({
 83 |         mousewheel: function(fn) {
 84 |             return fn ? this.bind('mousewheel', fn) : this.trigger('mousewheel');
 85 |         },
 86 | 
 87 |         unmousewheel: function(fn) {
 88 |             return this.unbind('mousewheel', fn);
 89 |         }
 90 |     });
 91 | 
 92 | 
 93 |     function handler(event) {
 94 |         var orgEvent   = event || window.event,
 95 |             args       = slice.call(arguments, 1),
 96 |             delta      = 0,
 97 |             deltaX     = 0,
 98 |             deltaY     = 0,
 99 |             absDelta   = 0,
100 |             offsetX    = 0,
101 |             offsetY    = 0;
102 |         event = $.event.fix(orgEvent);
103 |         event.type = 'mousewheel';
104 | 
105 |         // Old school scrollwheel delta
106 |         if ( 'detail'      in orgEvent ) { deltaY = orgEvent.detail * -1;      }
107 |         if ( 'wheelDelta'  in orgEvent ) { deltaY = orgEvent.wheelDelta;       }
108 |         if ( 'wheelDeltaY' in orgEvent ) { deltaY = orgEvent.wheelDeltaY;      }
109 |         if ( 'wheelDeltaX' in orgEvent ) { deltaX = orgEvent.wheelDeltaX * -1; }
110 | 
111 |         // Firefox < 17 horizontal scrolling related to DOMMouseScroll event
112 |         if ( 'axis' in orgEvent && orgEvent.axis === orgEvent.HORIZONTAL_AXIS ) {
113 |             deltaX = deltaY * -1;
114 |             deltaY = 0;
115 |         }
116 | 
117 |         // Set delta to be deltaY or deltaX if deltaY is 0 for backwards compatabilitiy
118 |         delta = deltaY === 0 ? deltaX : deltaY;
119 | 
120 |         // New school wheel delta (wheel event)
121 |         if ( 'deltaY' in orgEvent ) {
122 |             deltaY = orgEvent.deltaY * -1;
123 |             delta  = deltaY;
124 |         }
125 |         if ( 'deltaX' in orgEvent ) {
126 |             deltaX = orgEvent.deltaX;
127 |             if ( deltaY === 0 ) { delta  = deltaX * -1; }
128 |         }
129 | 
130 |         // No change actually happened, no reason to go any further
131 |         if ( deltaY === 0 && deltaX === 0 ) { return; }
132 | 
133 |         // Need to convert lines and pages to pixels if we aren't already in pixels
134 |         // There are three delta modes:
135 |         //   * deltaMode 0 is by pixels, nothing to do
136 |         //   * deltaMode 1 is by lines
137 |         //   * deltaMode 2 is by pages
138 |         if ( orgEvent.deltaMode === 1 ) {
139 |             var lineHeight = $.data(this, 'mousewheel-line-height');
140 |             delta  *= lineHeight;
141 |             deltaY *= lineHeight;
142 |             deltaX *= lineHeight;
143 |         } else if ( orgEvent.deltaMode === 2 ) {
144 |             var pageHeight = $.data(this, 'mousewheel-page-height');
145 |             delta  *= pageHeight;
146 |             deltaY *= pageHeight;
147 |             deltaX *= pageHeight;
148 |         }
149 | 
150 |         // Store lowest absolute delta to normalize the delta values
151 |         absDelta = Math.max( Math.abs(deltaY), Math.abs(deltaX) );
152 | 
153 |         if ( !lowestDelta || absDelta < lowestDelta ) {
154 |             lowestDelta = absDelta;
155 | 
156 |             // Adjust older deltas if necessary
157 |             if ( shouldAdjustOldDeltas(orgEvent, absDelta) ) {
158 |                 lowestDelta /= 40;
159 |             }
160 |         }
161 | 
162 |         // Adjust older deltas if necessary
163 |         if ( shouldAdjustOldDeltas(orgEvent, absDelta) ) {
164 |             // Divide all the things by 40!
165 |             delta  /= 40;
166 |             deltaX /= 40;
167 |             deltaY /= 40;
168 |         }
169 | 
170 |         // Get a whole, normalized value for the deltas
171 |         delta  = Math[ delta  >= 1 ? 'floor' : 'ceil' ](delta  / lowestDelta);
172 |         deltaX = Math[ deltaX >= 1 ? 'floor' : 'ceil' ](deltaX / lowestDelta);
173 |         deltaY = Math[ deltaY >= 1 ? 'floor' : 'ceil' ](deltaY / lowestDelta);
174 | 
175 |         // Normalise offsetX and offsetY properties
176 |         if ( special.settings.normalizeOffset && this.getBoundingClientRect ) {
177 |             var boundingRect = this.getBoundingClientRect();
178 |             offsetX = event.clientX - boundingRect.left;
179 |             offsetY = event.clientY - boundingRect.top;
180 |         }
181 | 
182 |         // Add information to the event object
183 |         event.deltaX = deltaX;
184 |         event.deltaY = deltaY;
185 |         event.deltaFactor = lowestDelta;
186 |         event.offsetX = offsetX;
187 |         event.offsetY = offsetY;
188 |         // Go ahead and set deltaMode to 0 since we converted to pixels
189 |         // Although this is a little odd since we overwrite the deltaX/Y
190 |         // properties with normalized deltas.
191 |         event.deltaMode = 0;
192 | 
193 |         // Add event and delta to the front of the arguments
194 |         args.unshift(event, delta, deltaX, deltaY);
195 | 
196 |         // Clearout lowestDelta after sometime to better
197 |         // handle multiple device types that give different
198 |         // a different lowestDelta
199 |         // Ex: trackpad = 3 and mouse wheel = 120
200 |         if (nullLowestDeltaTimeout) { clearTimeout(nullLowestDeltaTimeout); }
201 |         nullLowestDeltaTimeout = setTimeout(nullLowestDelta, 200);
202 | 
203 |         return ($.event.dispatch || $.event.handle).apply(this, args);
204 |     }
205 | 
206 |     function nullLowestDelta() {
207 |         lowestDelta = null;
208 |     }
209 | 
210 |     function shouldAdjustOldDeltas(orgEvent, absDelta) {
211 |         // If this is an older event and the delta is divisable by 120,
212 |         // then we are assuming that the browser is treating this as an
213 |         // older mouse wheel event and that we should divide the deltas
214 |         // by 40 to try and get a more usable deltaFactor.
215 |         // Side note, this actually impacts the reported scroll distance
216 |         // in older browsers and can cause scrolling to be slower than native.
217 |         // Turn this off by setting $.event.special.mousewheel.settings.adjustOldDeltas to false.
218 |         return special.settings.adjustOldDeltas && orgEvent.type === 'mousewheel' && absDelta % 120 === 0;
219 |     }
220 | 
221 | }));
222 | 


--------------------------------------------------------------------------------