From 90e5d524142083ce9ae4647b1092e3882822e1d3 Mon Sep 17 00:00:00 2001 From: Nahuel Soldevilla Date: Mon, 2 Mar 2015 00:54:45 -0300 Subject: [PATCH 1/3] add option: scroll relative to element --- component.json | 2 +- index.js | 19 ++++++++++++------- 2 files changed, 13 insertions(+), 8 deletions(-) diff --git a/component.json b/component.json index 82aeeaf..86e3c90 100644 --- a/component.json +++ b/component.json @@ -1,6 +1,6 @@ { "name": "scroll-to", - "repo": "component/scroll-to", + "repo": "solde9/scroll-to", "description": "Smooth window scroll to position with requestAnimationFrame", "version": "0.0.1", "keywords": ["scroll", "animate", "scroll-to"], diff --git a/index.js b/index.js index 152e777..4928f75 100644 --- a/index.js +++ b/index.js @@ -23,8 +23,12 @@ function scrollTo(x, y, options) { options = options || {}; // start position - var start = scroll(); - + var start = scroll(options.box); + + if (options.box && options.box.scrollTop) { + y = y + options.box.scrollTop; + } + // setup tween var tween = Tween(start) .ease(options.ease || 'out-circ') @@ -33,7 +37,8 @@ function scrollTo(x, y, options) { // scroll tween.update(function(o){ - window.scrollTo(o.left | 0, o.top | 0); + if (options.box) options.box.scrollTop = o.top; + else window.scrollTo(o.left | 0, o.top | 0); }); // handle end @@ -59,8 +64,8 @@ function scrollTo(x, y, options) { * @api private */ -function scroll() { - var y = window.pageYOffset || document.documentElement.scrollTop; - var x = window.pageXOffset || document.documentElement.scrollLeft; +function scroll(box) { + var y = (box && box.scrollTop) || this.pageYOffset || document.documentElement.scrollTop; + var x = (box && box.scrollLeft) || this.pageXOffset || document.documentElement.scrollLeft; return { top: y, left: x }; -} +} \ No newline at end of file From 2b24b96882c4fa7c73053599e741f224f6c46692 Mon Sep 17 00:00:00 2001 From: Nahuel Soldevilla Date: Tue, 10 Mar 2015 23:00:44 -0300 Subject: [PATCH 2/3] Add scroll element example and fix scrollLeft relative to elem --- example2.html | 61 +++++++++++++++++++++++++++++++++++++++++++++++++++ index.js | 10 ++++++--- 2 files changed, 68 insertions(+), 3 deletions(-) create mode 100644 example2.html diff --git a/example2.html b/example2.html new file mode 100644 index 0000000..3b5cdbc --- /dev/null +++ b/example2.html @@ -0,0 +1,61 @@ + + + scroll-to - smooth javascript element scrolling with requestAnimationFrame + + + +
+
    +
    + + + + + diff --git a/index.js b/index.js index 4928f75..201451a 100644 --- a/index.js +++ b/index.js @@ -25,8 +25,9 @@ function scrollTo(x, y, options) { // start position var start = scroll(options.box); - if (options.box && options.box.scrollTop) { - y = y + options.box.scrollTop; + if (options.box) { + y += options.box.scrollTop || 0; + x += options.box.scrollLeft || 0; } // setup tween @@ -37,7 +38,10 @@ function scrollTo(x, y, options) { // scroll tween.update(function(o){ - if (options.box) options.box.scrollTop = o.top; + if (options.box) { + options.box.scrollTop = o.top; + options.box.scrollLeft = o.left; + } else window.scrollTo(o.left | 0, o.top | 0); }); From 8ca3a47d4f241153b6b7ef73ef7adfea461db9f0 Mon Sep 17 00:00:00 2001 From: Nahuel Soldevilla Date: Tue, 10 Mar 2015 23:07:51 -0300 Subject: [PATCH 3/3] restore repo name --- component.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/component.json b/component.json index 86e3c90..82aeeaf 100644 --- a/component.json +++ b/component.json @@ -1,6 +1,6 @@ { "name": "scroll-to", - "repo": "solde9/scroll-to", + "repo": "component/scroll-to", "description": "Smooth window scroll to position with requestAnimationFrame", "version": "0.0.1", "keywords": ["scroll", "animate", "scroll-to"],