smoothscroll.js (2366B)
1 // query selector targets Hugo TOC
2 (function() {
3
4 'use strict';
5
6 // Feature Test
7 if ('querySelector' in document && 'addEventListener' in window && Array.prototype.forEach) {
8
9 // Function to animate the scroll
10 var smoothScroll = function(anchor, duration) {
11
12 // Calculate how far and how fast to scroll
13 var startLocation = window.pageYOffset;
14 var endLocation = anchor.offsetTop;
15 var distance = endLocation - startLocation;
16 var increments = distance / (duration / 16);
17 var stopAnimation;
18
19 // Scroll the page by an increment, and check if it's time to stop
20 var animateScroll = function() {
21 window.scrollBy(0, increments);
22 stopAnimation();
23 };
24
25 // If scrolling down
26 if (increments >= 0) {
27 // Stop animation when you reach the anchor OR the bottom of the page
28 stopAnimation = function() {
29 var travelled = window.pageYOffset;
30 if ((travelled >= (endLocation - increments)) || ((window.innerHeight + travelled) >= document.body.offsetHeight)) {
31 clearInterval(runAnimation);
32 }
33 };
34 }
35 // If scrolling up
36 else {
37 // Stop animation when you reach the anchor OR the top of the page
38 stopAnimation = function() {
39 var travelled = window.pageYOffset;
40 if (travelled <= (endLocation || 0)) {
41 clearInterval(runAnimation);
42 }
43 };
44 }
45
46 // Loop the animation function
47 var runAnimation = setInterval(animateScroll, 16);
48
49 };
50
51 // Define smooth scroll links
52 var scrollToggle = document.querySelectorAll('#TableOfContents ul li a');
53
54 // For each smooth scroll link
55 [].forEach.call(scrollToggle, function(toggle) {
56
57 // When the smooth scroll link is clicked
58 toggle.addEventListener('click', function(e) {
59
60 // Prevent the default link behavior
61 e.preventDefault();
62
63 // Get anchor link and calculate distance from the top
64 var dataID = toggle.getAttribute('href');
65 var dataTarget = document.querySelector(dataID);
66 var dataSpeed = toggle.getAttribute('data-speed');
67
68 // If the anchor exists
69 if (dataTarget) {
70 // Scroll to the anchor
71 smoothScroll(dataTarget, dataSpeed || 500);
72 }
73
74 }, false);
75
76 });
77
78 }
79
80 })();