smooth-scroll

simple smooth scrolling in the browser
git clone https://git.ce9e.org/smooth-scroll.git

commit
a47c835880e9a9c8f238c688ae21febe05dc01ed
parent
c978c30fd72f93f09dead89f2502a7dbae7a7761
Author
Tobias Bengfort <tobias.bengfort@gmx.net>
Date
2016-11-18 15:13
add parameters container and duration

Diffstat

M TODO 1 -
M smooth-scroll.js 13 ++++++++-----

2 files changed, 8 insertions, 6 deletions


diff --git a/TODO b/TODO

@@ -3,7 +3,6 @@
    3     3 -	use from javascript
    4     4 -	horizontal scrolling
    5     5 -	standards compliant
    6    -1 -	other containers
    7     6 -	change direction mid-scroll
    8     7 -	smooth scroll on history change (back button)
    9     8 !	merge upstream

diff --git a/smooth-scroll.js b/smooth-scroll.js

@@ -13,14 +13,17 @@ var animate = function(apply, duration) {
   13    13   window.requestAnimationFrame(step);
   14    14 };
   15    15 
   16    -1 var smoothScroll = function(endY) {
   17    -1   var startY = window.scrollY;
   -1    16 var smoothScrollTo = function(endY, container, duration) {
   -1    17   container = container || window;
   -1    18   duration = duration || 250;
   -1    19 
   -1    20   var startY = container.scrollY;
   18    21 
   19    22   animate(function(progress) {
   20    23     // var f = Math.sin(Math.PI * (progress - 0.5)) / 2 + 0.5;
   21    24     var f = (3 - 2 * progress) * progress * progress;
   22    -1     window.scrollTo(0, startY * (1 - f) + endY * f);
   23    -1   }, 250);
   -1    25     container.scrollTo(0, startY * (1 - f) + endY * f);
   -1    26   }, duration);
   24    27 };
   25    28 
   26    29 var smoothScrollClick = function(event) {
@@ -30,7 +33,7 @@ var smoothScrollClick = function(event) {
   30    33   var scrollY = document.querySelector(selector).offsetTop;
   31    34 
   32    35   history.pushState(null, null, selector);
   33    -1   smoothScroll(scrollY);
   -1    36   smoothScrollTo(scrollY);
   34    37 };
   35    38 
   36    39 document.querySelectorAll('[href^="#"]').forEach(function(el) {