Permalink
Browse files

Ignore chrome's overflow-scrolling implementation. Closes #59

Not gonna support AMD. Closes #55
dont apply any overscroll behaviors if there is nothing to scroll. Closes #57
prepare for 1.6.3. launch
  • Loading branch information...
Jonathan Azoff
Jonathan Azoff committed May 17, 2012
1 parent 72262a7 commit 9c184088f36428bc98b447e20886bdca3af91e4f
Showing with 72 additions and 61 deletions.
  1. +11 −2 README.md
  2. +59 −51 jquery.overscroll.js
  3. +2 −8 jquery.overscroll.min.js
View
@@ -1,6 +1,6 @@
-Overscroll v1.6.2
+Overscroll v1.6.3
=================
-Thursday, April 12th 2012
+Thursday, May 17th 2012
Overscroll is a jQuery Plugin that [polyfills](http://remysharp.com/2010/10/08/what-is-a-polyfill) mobile safari's [overflow-scrolling](http://johanbrook.com/browsers/native-momentum-scrolling-ios-5/) style in a desktop browser. It is intended for use with [the latest version of jQuery](http://code.jquery.com/jquery-latest.js).
@@ -101,8 +101,17 @@ As of 1.3.1, if you would like to add click handlers to links inside of overscro
As of 1.4.4 you can call the `overscroll` constructor on a jQuery element as much as you like, without worrying about memory leaks. What this means is that you may dynamically add elements to the overscrolled element, and then re-call the `overscroll` method to take into account the new height. This would have been done programatically if DOM Elements supported the resize event, alas only the window object supports this event.
+A Note About AMD
+----------------
+Full disclosure, I have no interest in supporting [AMD](https://github.com/amdjs/amdjs-api/wiki/AMD). It seems great, I'm sure lots of people use it - but [its goals](http://requirejs.org/docs/whyamd.html) seem tangential to making Overscroll a better plug-in. It's hard enough keeping up with browsers, no sense in making Overscroll anything more than what it is: a jQuery plug-in. If you want to turn Overscroll into an AMD module, than I wholly encourage you to do so! Just fork the project and shoot me a link so that I can reference it here.
+
Change Log
----------
+ * __1.6.3__
+ - Fixed Chrome 19's bad overflow-scrolling implementation.
+ + <https://github.com/azoff/Overscroll/issues/59>
+ - Only apply overscroll if there is content to scroll. (thanks @tsneed290)
+ + <https://github.com/azoff/Overscroll/issues/57>
* __1.6.2__
- Explicit check for start element.
+ <https://github.com/azoff/Overscroll/issues/48>
View
@@ -1,5 +1,5 @@
/**
- * Overscroll v1.6.2
+ * Overscroll v1.6.3
* A jQuery Plugin that emulates the iPhone scrolling experience in a browser.
* http://azoffdesign.com/overscroll
*
@@ -13,14 +13,14 @@
* For API documentation, see the README file
* http://azof.fr/pYCzuM
*
- * Date: Thursday, April 12th 2012
+ * Date: Thursday, May 17th 2012
*/
/*jslint onevar: true, strict: true */
/*global window, document, setTimeout, clearTimeout, jQuery */
-(function(global, dom, math, wait, cancel, namespace, $, none){
+(function(global, dom, browser, math, wait, cancel, namespace, $, none){
// We want to run this plug-in in strict-mode
// so that we may benefit from any optimizations
@@ -33,6 +33,7 @@
// runs feature detection for overscroll
compat = (function(){
var b = $.browser, fallback,
+ agent = browser.userAgent,
style = dom.createElement(datakey).style,
prefix = b.webkit ? 'webkit' : (b.mozilla ? 'moz' : (b.msie ? 'ms' : (b.opera ? 'o' : ''))),
cssprefix = prefix ? ['-','-'].join(prefix) : '';
@@ -50,12 +51,13 @@
// check to see if overflowScrolling is available
if (style[scroller] !== none) {
- compat.overflowScrolling = cssprefix + 'overflow-scrolling';
- } else if (compat.touchEvents) {
-
+ // Chrome 19 introduced overflow scrolling. Unfortunately, their touch
+ // implementation is incomplete. Hence, we act like it is not supported
+ // for chrome. #59
+ if (agent.indexOf('Chrome') < 0) {
+ compat.overflowScrolling = cssprefix + 'overflow-scrolling';
+ }
}
-
-
});
// check to see if the client supports touch
@@ -503,9 +505,11 @@
width = $target.width(),
height = $target.height(),
scrollWidth = width >= target.scrollWidth ? width : target.scrollWidth,
- scrollHeight = height >= target.scrollHeight ? height : target.scrollHeight;
+ scrollHeight = height >= target.scrollHeight ? height : target.scrollHeight,
+ hasScroll = scrollWidth > width || scrollHeight > height;
return {
+ valid: hasScroll,
container: {
width: width,
height: height,
@@ -614,55 +618,59 @@
// This function takes a jQuery element, some
// (optional) options, and sets up event metadata
// for each instance the plug-in affects
- setup = function(target, options) {
+ setup = function(target, options) {
// create initial data properties for this instance
- var thumbs, sizing,
- data = {
- flags: { dragging: false },
- options: options = getOptions(options),
- remover: getRemover(target, true),
- sizing: sizing = getSizing(target)
+ options = getOptions(options);
+ var sizing = getSizing(target),
+ thumbs, data = {
+ options: options, sizing: sizing,
+ flags: { dragging: false },
+ remover: getRemover(target, true)
};
+
+ // only apply handlers if the overscrolled element
+ // actually has an area to scroll
+ if (sizing.valid) {
+ // provide a circular-reference, enable events, and
+ // apply any required CSS
+ data.target = target = $(target).css({
+ position: 'relative',
+ overflow: 'hidden',
+ cursor: compat.cursorGrab
+ }).on(events.wheel, data, wheel)
+ .on(events.start, data, start)
+ .on(events.end, data, stop)
+ .on(events.scroll, data, scroll)
+ .on(events.ignored, false);
+
+ // apply the stop listeners for drag end
+ if(options.dragHold) {
+ $(document).on(events.end, data, stop);
+ } else {
+ data.target.on(events.end, data, stop);
+ }
- // provide a circular-reference, enable events, and
- // apply any required CSS
- data.target = target = $(target).css({
- position: 'relative',
- overflow: 'hidden',
- cursor: compat.cursorGrab
- }).on(events.wheel, data, wheel)
- .on(events.start, data, start)
- .on(events.end, data, stop)
- .on(events.scroll, data, scroll)
- .on(events.ignored, false);
-
- // apply the stop listeners for drag end
- if(options.dragHold) {
- $(document).on(events.end, data, stop);
- } else {
- data.target.on(events.end, data, stop);
- }
-
- // apply any user-provided scroll offsets
- if (options.scrollLeft !== null) {
- target.scrollLeft(options.scrollLeft);
- } if (options.scrollTop !== null) {
- target.scrollTop(options.scrollTop);
- }
+ // apply any user-provided scroll offsets
+ if (options.scrollLeft !== null) {
+ target.scrollLeft(options.scrollLeft);
+ } if (options.scrollTop !== null) {
+ target.scrollTop(options.scrollTop);
+ }
- // add thumbs and listeners (if we're showing them)
- if (options.showThumbs) {
- data.thumbs = thumbs = createThumbs(target, sizing, options);
- if (thumbs.added) {
- moveThumbs(thumbs, sizing, target.scrollLeft(), target.scrollTop());
- if (options.hoverThumbs) {
- target.on(events.hover, data, hover);
+ // add thumbs and listeners (if we're showing them)
+ if (options.showThumbs) {
+ data.thumbs = thumbs = createThumbs(target, sizing, options);
+ if (thumbs.added) {
+ moveThumbs(thumbs, sizing, target.scrollLeft(), target.scrollTop());
+ if (options.hoverThumbs) {
+ target.on(events.hover, data, hover);
+ }
}
}
- }
- target.data(datakey, data);
+ target.data(datakey, data);
+ }
},
@@ -714,4 +722,4 @@
removeOverscroll: removeOverscroll
});
-})(window, document, Math, setTimeout, clearTimeout, jQuery.fn, jQuery);
+})(window, document, navigator, Math, setTimeout, clearTimeout, jQuery.fn, jQuery);
Oops, something went wrong.

0 comments on commit 9c18408

Please sign in to comment.