From c28e28366b78bbfc58e5c32cdc20397604e5462b Mon Sep 17 00:00:00 2001 From: Gijs Roge Date: Fri, 22 May 2015 22:30:35 +0200 Subject: [PATCH 1/6] detect if browser supports document.body or document.documtElement --- animatedScrollTo.js | 13 +++++++++++++ 1 file changed, 13 insertions(+) diff --git a/animatedScrollTo.js b/animatedScrollTo.js index bc7d0cb..5ec9bd7 100644 --- a/animatedScrollTo.js +++ b/animatedScrollTo.js @@ -19,6 +19,11 @@ if (!animating) { return; } + + if (element === document.body || element === document.documentElement){ + element = getScrollingElement(); + } + requestAnimFrame(animateScroll); var now = +new Date(); var val = Math.floor(easeInOutQuad(now - animationStart, start, change, duration)); @@ -42,6 +47,14 @@ requestAnimFrame(animateScroll); }; + function getScrollingElement() { + var d = document; + return d.documentElement.scrollHeight > d.body.scrollHeight && + d.compatMode.indexOf('CSS1') == 0 ? + d.documentElement : + d.body; + } + if (typeof module !== 'undefined' && typeof module.exports !== 'undefined') { module.exports = animatedScrollTo; } else { From 107b21ff6d8940f12ea32054e67213cc03358d38 Mon Sep 17 00:00:00 2001 From: Gijs Roge Date: Sat, 23 May 2015 11:41:02 +0200 Subject: [PATCH 2/6] Added credits --- animatedScrollTo.js | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/animatedScrollTo.js b/animatedScrollTo.js index 5ec9bd7..4ac7118 100644 --- a/animatedScrollTo.js +++ b/animatedScrollTo.js @@ -47,6 +47,14 @@ requestAnimFrame(animateScroll); }; + /* + * + * Author: Diego Perini + * Updated: 2014/09/18 + * License: MIT + * Gist: https://gist.github.com/dperini/ac3d921d6a08f10fd10e + * + */ function getScrollingElement() { var d = document; return d.documentElement.scrollHeight > d.body.scrollHeight && From 3c966cb923d9de81e04d6435dd77dfd4e4b5b688 Mon Sep 17 00:00:00 2001 From: Gijs Roge Date: Sat, 23 May 2015 15:55:43 +0200 Subject: [PATCH 3/6] Added a check if page reached bottom to trigger callback --- animatedScrollTo.js | 12 +++++++++++- 1 file changed, 11 insertions(+), 1 deletion(-) diff --git a/animatedScrollTo.js b/animatedScrollTo.js index 4ac7118..4659f1f 100644 --- a/animatedScrollTo.js +++ b/animatedScrollTo.js @@ -38,7 +38,7 @@ lastpos = val; element.scrollTop = val; } - if (now > animationStart + duration) { + if (now > animationStart + duration || isBottomPage()) { element.scrollTop = to; animating = false; if (callback) { callback(); } @@ -63,6 +63,16 @@ d.body; } + var isBottomPage = function(){ + element = getScrollingElement(); + var scrollTop = element.scrollTop; + var scrolledToBottom = (scrollTop + window.innerHeight) >= element.scrollHeight; + + if(scrolledToBottom){ + return true; + } + } + if (typeof module !== 'undefined' && typeof module.exports !== 'undefined') { module.exports = animatedScrollTo; } else { From f4702b1d1e30890ce8254d1c74c64f1b5eeef506 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Gijs=20Rog=C3=A9?= Date: Mon, 13 Jul 2015 15:40:58 +0200 Subject: [PATCH 4/6] removed fix for getting correct scrolling element across browsers. --- animatedScrollTo.js | 45 ++++++++++++--------------------------------- 1 file changed, 12 insertions(+), 33 deletions(-) diff --git a/animatedScrollTo.js b/animatedScrollTo.js index 4659f1f..b045751 100644 --- a/animatedScrollTo.js +++ b/animatedScrollTo.js @@ -10,8 +10,8 @@ var animatedScrollTo = function (element, to, duration, callback) { var start = element.scrollTop, - change = to - start, - animationStart = +new Date(); + change = to - start, + animationStart = +new Date(); var animating = true; var lastpos = null; @@ -19,11 +19,6 @@ if (!animating) { return; } - - if (element === document.body || element === document.documentElement){ - element = getScrollingElement(); - } - requestAnimFrame(animateScroll); var now = +new Date(); var val = Math.floor(easeInOutQuad(now - animationStart, start, change, duration)); @@ -38,44 +33,28 @@ lastpos = val; element.scrollTop = val; } - if (now > animationStart + duration || isBottomPage()) { + if (now > animationStart + duration || isBottomPage(element)) { element.scrollTop = to; animating = false; if (callback) { callback(); } } }; - requestAnimFrame(animateScroll); - }; - /* - * - * Author: Diego Perini - * Updated: 2014/09/18 - * License: MIT - * Gist: https://gist.github.com/dperini/ac3d921d6a08f10fd10e - * - */ - function getScrollingElement() { - var d = document; - return d.documentElement.scrollHeight > d.body.scrollHeight && - d.compatMode.indexOf('CSS1') == 0 ? - d.documentElement : - d.body; - } + requestAnimFrame(animateScroll); - var isBottomPage = function(){ - element = getScrollingElement(); - var scrollTop = element.scrollTop; - var scrolledToBottom = (scrollTop + window.innerHeight) >= element.scrollHeight; + var isBottomPage = function(element){ + var scrollTop = element.scrollTop; + var scrolledToBottom = (scrollTop + window.innerHeight) >= element.scrollHeight; - if(scrolledToBottom){ - return true; + if(scrolledToBottom){ + return true; + } } - } + }; if (typeof module !== 'undefined' && typeof module.exports !== 'undefined') { module.exports = animatedScrollTo; } else { window.animatedScrollTo = animatedScrollTo; } -})(window); +})(window); \ No newline at end of file From d5df60bddfaf285023d4ec995953f17036954711 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Gijs=20Rog=C3=A9?= Date: Mon, 13 Jul 2015 15:44:42 +0200 Subject: [PATCH 5/6] added link to include scrollingElement polyfill --- README.md | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/README.md b/README.md index a3b6dd7..9fd6387 100644 --- a/README.md +++ b/README.md @@ -6,6 +6,10 @@ This is a simple function for animating scroll. - If user scrolls while animation is running, scroll animation would be immediately canceled. - Use as a single script or through bower. +## Browser support + +- If you want full browser support include this library: https://github.com/mathiasbynens/document.scrollingElement + ## Example usage ```javascript From f2297d51c27d4500448e5072813750bb7c306215 Mon Sep 17 00:00:00 2001 From: gijsroge Date: Wed, 30 Nov 2016 14:53:29 +0100 Subject: [PATCH 6/6] updated package name & published to npm registry --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index c4b1ba1..aa83faf 100644 --- a/package.json +++ b/package.json @@ -1,5 +1,5 @@ { - "name": "animated-scrollto", + "name": "animated-scrollto-gijs", "version": "1.1.0", "description": "Animated scrolling without any dependency on libraries", "main": "animatedScrollTo.js",