smooth-scroll

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

commit
2c9bc8c7044984a94b579ba02570986433d461ac
parent
5b002082708d846db0f5c4330ef1a37873a42838
Author
Tobias Bengfort <tobias.bengfort@gmx.net>
Date
2016-11-18 18:47
refactor

Diffstat

M smooth-scroll.js 41 ++++++++++++++++++++---------------------

1 files changed, 20 insertions, 21 deletions


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

@@ -28,9 +28,9 @@
   28    28     return t < 0.5 ? 4 * t * t * t : (t - 1) * (2 * t - 2) * (2 * t - 2) + 1;
   29    29   };
   30    30 
   31    -1   var smoothScrollTo = function(endY, duration, easing) {
   32    -1     duration = duration || 400;
   33    -1     easing = easing || cubicInOut;
   -1    31   var smoothScrollTo = function(endY, options) {
   -1    32     var duration = (options || {}).duration || 400;
   -1    33     var easing = (options || {}).easing || cubicInOut;
   34    34 
   35    35     var startY = window.scrollY;
   36    36 
@@ -40,41 +40,40 @@
   40    40     }, duration);
   41    41   };
   42    42 
   43    -1   var init = function(headerSelector) {
   44    -1     var header = document.querySelector(headerSelector || '[data-scroll-header]');
   45    -1 
   46    -1     var scroll = function(selector) {
   47    -1       var scrollY = document.querySelector(selector).offsetTop;
   -1    43   var smoothScrollToSelector = function(selector, options) {
   -1    44     var headerSelector = (options || {}).headerSelector || '[data-scroll-header]';
   -1    45     var header = document.querySelector(headerSelector);
   -1    46     var scrollY = document.querySelector(selector).offsetTop;
   -1    47     if (header) scrollY -= header.getBoundingClientRect().height;
   -1    48     smoothScrollTo(scrollY, options);
   -1    49   };
   48    50 
   49    -1       if (header) {
   50    -1         scrollY -= header.getBoundingClientRect().height;
   51    -1       }
   -1    51   var init = function(options) {
   -1    52     var selector = (options || {}).selector || '[href^="#"]';
   -1    53     var links = document.querySelectorAll(selector);
   52    54 
   53    -1       smoothScrollTo(scrollY);
   54    -1     };
   -1    55     window.addEventListener('popstate', function(event) {
   -1    56       event.preventDefault();
   -1    57       smoothScrollToSelector(window.location.hash, options);
   -1    58     });
   55    59 
   56    60     var smoothScrollClick = function(event) {
   57    61       event.preventDefault();
   58    62 
   59    63       var selector = event.currentTarget.getAttribute('href');
   60    64       history.pushState(null, null, selector);
   61    -1       scroll(selector);
   -1    65       smoothScrollToSelector(selector, options);
   62    66     };
   63    67 
   64    -1     window.addEventListener('popstate', function(event) {
   65    -1       event.preventDefault();
   66    -1       scroll(window.location.hash);
   67    -1     });
   68    -1 
   69    -1     var links = document.querySelectorAll('[href^="#"]');
   70    68     for (var i = 0; i < links.length; i++) {
   71    69       links[i].addEventListener('click', smoothScrollClick);
   72    -1     };
   -1    70     }
   73    71   };
   74    72 
   75    73   return {
   76    74     animate: animate,
   77    75     smoothScrollTo: smoothScrollTo,
   -1    76     smoothScrollToSelector: smoothScrollToSelector,
   78    77     init: init,
   79    78   };
   80    79 });