|
@@ -1,37 +1,54 @@
|
|
(function () {
|
|
(function () {
|
|
document.addEventListener("DOMContentLoaded", function(event) {
|
|
document.addEventListener("DOMContentLoaded", function(event) {
|
|
- function scrollTo(element, to, duration, hash) {
|
|
|
|
- if (duration <= 0) return;
|
|
|
|
- var difference = to - element.scrollTop;
|
|
|
|
- var perTick = difference / duration * 10;
|
|
|
|
-
|
|
|
|
- setTimeout(function() {
|
|
|
|
- element.scrollTop = element.scrollTop + perTick;
|
|
|
|
- if (element.scrollTop === to) {
|
|
|
|
- window.location.hash = hash;
|
|
|
|
- return;
|
|
|
|
- }
|
|
|
|
- scrollTo(element, to, duration - 10, hash);
|
|
|
|
- }, 10);
|
|
|
|
- }
|
|
|
|
|
|
|
|
window.addEventListener('scroll', function (ev) {
|
|
window.addEventListener('scroll', function (ev) {
|
|
var navbar = document.querySelector(".navbar");
|
|
var navbar = document.querySelector(".navbar");
|
|
var fixed_top = document.querySelector(".navbar-fixed-top");
|
|
var fixed_top = document.querySelector(".navbar-fixed-top");
|
|
var rect = navbar.getBoundingClientRect();
|
|
var rect = navbar.getBoundingClientRect();
|
|
- if (rect.top + document.body.scrollTop > 50) {
|
|
|
|
|
|
+ if (rect.top + window.scrollY > 50) {
|
|
fixed_top.classList.add("top-nav-collapse");
|
|
fixed_top.classList.add("top-nav-collapse");
|
|
} else {
|
|
} else {
|
|
fixed_top.classList.remove("top-nav-collapse");
|
|
fixed_top.classList.remove("top-nav-collapse");
|
|
}
|
|
}
|
|
});
|
|
});
|
|
|
|
|
|
|
|
+ var getDocumentHeight = function () {
|
|
|
|
+ return Math.max(
|
|
|
|
+ document.body.scrollHeight, document.documentElement.scrollHeight,
|
|
|
|
+ document.body.offsetHeight, document.documentElement.offsetHeight,
|
|
|
|
+ document.body.clientHeight, document.documentElement.clientHeight
|
|
|
|
+ );
|
|
|
|
+ };
|
|
|
|
+
|
|
Array.prototype.forEach.call(document.querySelectorAll('.page-scroll a'), function (el) {
|
|
Array.prototype.forEach.call(document.querySelectorAll('.page-scroll a'), function (el) {
|
|
el.addEventListener('click', function (ev) {
|
|
el.addEventListener('click', function (ev) {
|
|
ev.preventDefault();
|
|
ev.preventDefault();
|
|
var hash = this.getAttribute("href")
|
|
var hash = this.getAttribute("href")
|
|
- var goal = document.querySelector(hash);
|
|
|
|
- scrollTo(document.body, goal.offsetTop, 600, hash);
|
|
|
|
|
|
+ var endLocation = document.querySelector(hash).offsetTop;
|
|
|
|
+ var startLocation = window.pageYOffset;
|
|
|
|
+ var distance = endLocation - startLocation;
|
|
|
|
+ var start, percentage, position;
|
|
|
|
+ var timeLapsed = 0;
|
|
|
|
+
|
|
|
|
+ function scrollAnimation(timestamp) {
|
|
|
|
+ if (!start) { start = timestamp; }
|
|
|
|
+ timeLapsed += timestamp - start;
|
|
|
|
+ percentage = (timeLapsed / parseInt(500, 10));
|
|
|
|
+ percentage = (percentage > 1) ? 1 : percentage;
|
|
|
|
+ position = startLocation + (distance * percentage * percentage);
|
|
|
|
+ window.scrollTo(0, Math.floor(position));
|
|
|
|
+
|
|
|
|
+ var currentLocation = window.pageYOffset;
|
|
|
|
+ if (position == endLocation ||
|
|
|
|
+ currentLocation == endLocation ||
|
|
|
|
+ ((startLocation < endLocation && window.innerHeight + currentLocation) >= getDocumentHeight())) {
|
|
|
|
+ window.location.hash = hash;
|
|
|
|
+ return;
|
|
|
|
+ }
|
|
|
|
+ window.requestAnimationFrame(scrollAnimation);
|
|
|
|
+ start = timestamp;
|
|
|
|
+ }
|
|
|
|
+ window.requestAnimationFrame(scrollAnimation);
|
|
});
|
|
});
|
|
});
|
|
});
|
|
});
|
|
});
|