Daniel@0
|
1 //
|
Daniel@0
|
2 // Prevent horizontal scroll for Back page in Mac 10.7+
|
Daniel@0
|
3 //
|
Daniel@0
|
4 // Mac OSX Lion introduces a nasty behavior: when you are scrolling and
|
Daniel@0
|
5 // the element (or its parents) are no longer scrollable, then horizontal
|
Daniel@0
|
6 // scrolling with two fingers will trigger back page or next page.
|
Daniel@0
|
7 //
|
Daniel@0
|
8 // For now this plugin provides a way to prevent that behavior for Chrome
|
Daniel@0
|
9 // in the case you're scrolling up or left where you can't scroll anymore,
|
Daniel@0
|
10 // which triggers back/next page.
|
Daniel@0
|
11 //
|
Daniel@0
|
12 // Supported browsers: Mac OSX Chrome, Mac OSX Safari, Mac OSX Firefox
|
Daniel@0
|
13 // On all other browsers this script won't do anything
|
Daniel@0
|
14 //
|
Daniel@0
|
15 // Depends on: jquery.mousewheel.js
|
Daniel@0
|
16 //
|
Daniel@0
|
17 // by Pablo Villalba for http://teambox.com
|
Daniel@0
|
18 //
|
Daniel@0
|
19 // Licensed under the MIT License
|
Daniel@0
|
20 //
|
Daniel@0
|
21
|
Daniel@0
|
22 (function ($) {
|
Daniel@0
|
23
|
Daniel@0
|
24 // This code is only valid for Mac
|
Daniel@0
|
25 if (!navigator.userAgent.match(/Macintosh/)) {
|
Daniel@0
|
26 return;
|
Daniel@0
|
27 }
|
Daniel@0
|
28
|
Daniel@0
|
29 // Detect browsers
|
Daniel@0
|
30 // http://stackoverflow.com/questions/5899783/detect-safari-using-jquery
|
Daniel@0
|
31 var is_chrome = navigator.userAgent.indexOf('Chrome') > -1;
|
Daniel@0
|
32 var is_safari = navigator.userAgent.indexOf("Safari") > -1;
|
Daniel@0
|
33 var is_firefox = navigator.userAgent.indexOf('Firefox') > -1;
|
Daniel@0
|
34
|
Daniel@0
|
35 // Handle scroll events in Chrome, Safari, and Firefox
|
Daniel@0
|
36 if (is_chrome || is_safari || is_firefox) {
|
Daniel@0
|
37
|
Daniel@0
|
38 // TODO: This only prevents scroll when reaching the topmost or leftmost
|
Daniel@0
|
39 // positions of a container. It doesn't handle rightmost or bottom,
|
Daniel@0
|
40 // and Lion scroll can be triggered by scrolling right (or bottom) and then
|
Daniel@0
|
41 // scrolling left without raising your fingers from the scroll position.
|
Daniel@0
|
42 $(window).mousewheel(function (e, d, x, y) {
|
Daniel@0
|
43
|
Daniel@0
|
44 var prevent_left, prevent_up;
|
Daniel@0
|
45
|
Daniel@0
|
46 absX = Math.abs(x);
|
Daniel@0
|
47 absY = Math.abs(y);
|
Daniel@0
|
48
|
Daniel@0
|
49 // If none of the parents can be scrolled left when we try to scroll left
|
Daniel@0
|
50 prevent_left = (absY <= absX) && x < 0 && !_($(e.target).parents()).detect(function (el) {
|
Daniel@0
|
51 return $(el).scrollLeft() > 0;
|
Daniel@0
|
52 });
|
Daniel@0
|
53
|
Daniel@0
|
54 // If none of the parents can be scrolled up when we try to scroll up
|
Daniel@0
|
55 prevent_up = (absX <= absY) && y > 0 && !_($(e.target).parents()).detect(function (el) {
|
Daniel@0
|
56 return $(el).scrollTop() > 0;
|
Daniel@0
|
57 });
|
Daniel@0
|
58
|
Daniel@0
|
59 // If none of the parents can be scrolled right when we try to scroll right
|
Daniel@0
|
60 prevent_right = (absY <= absX) && x > 0 && !_($(e.target).parents()).detect(function (el) {
|
Daniel@0
|
61 var $el = $(el);
|
Daniel@0
|
62 if ($el.css("overflow") != "scroll") {
|
Daniel@0
|
63 return false;
|
Daniel@0
|
64 }
|
Daniel@0
|
65 var scrollLeft = $el.scrollLeft();
|
Daniel@0
|
66 var childrenOuterWidth = $el.children().outerWidth();
|
Daniel@0
|
67 var ownWidth = el.clientWidth;
|
Daniel@0
|
68 return ownWidth && childrenOuterWidth > ownWidth && childrenOuterWidth - scrollLeft > ownWidth;
|
Daniel@0
|
69 });
|
Daniel@0
|
70
|
Daniel@0
|
71 // Prevent futile scroll, which would trigger the Back/Next page event
|
Daniel@0
|
72 if (prevent_left || prevent_up || prevent_right) {
|
Daniel@0
|
73 e.preventDefault();
|
Daniel@0
|
74 }
|
Daniel@0
|
75 });
|
Daniel@0
|
76
|
Daniel@0
|
77 }
|
Daniel@0
|
78
|
Daniel@0
|
79 }(jQuery));
|