website.js 2.6 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859
  1. (function () {
  2. document.addEventListener("DOMContentLoaded", function () {
  3. window.addEventListener('scroll', function () {
  4. var navbar = document.querySelector(".navbar");
  5. var rect = navbar.getBoundingClientRect();
  6. if (rect.top + window.scrollY > 50) {
  7. navbar.classList.add("top-nav-collapse");
  8. } else {
  9. navbar.classList.remove("top-nav-collapse");
  10. }
  11. });
  12. var getDocumentHeight = function () {
  13. return Math.max(
  14. document.body.scrollHeight, document.documentElement.scrollHeight,
  15. document.body.offsetHeight, document.documentElement.offsetHeight,
  16. document.body.clientHeight, document.documentElement.clientHeight
  17. );
  18. };
  19. Array.prototype.forEach.call(document.querySelectorAll('.page-scroll a'), function (el) {
  20. el.addEventListener('click', function (ev) {
  21. ev.preventDefault();
  22. Array.prototype.forEach.call(document.querySelectorAll('.page-scroll'), function (child) {
  23. child.classList.remove('active');
  24. });
  25. this.parentElement.classList.add('active');
  26. var hash = this.getAttribute("href");
  27. var endLocation = document.querySelector(hash).offsetTop;
  28. var startLocation = window.pageYOffset;
  29. var distance = endLocation - startLocation;
  30. var start, percentage, position;
  31. var timeLapsed = 0;
  32. function scrollAnimation(timestamp) {
  33. if (!start) { start = timestamp; }
  34. timeLapsed += timestamp - start;
  35. percentage = (timeLapsed / parseInt(500, 10));
  36. percentage = (percentage > 1) ? 1 : percentage;
  37. position = startLocation + (distance * percentage * percentage);
  38. window.scrollTo(0, Math.floor(position));
  39. var currentLocation = window.pageYOffset;
  40. if (position == endLocation ||
  41. currentLocation == endLocation ||
  42. ((startLocation < endLocation && window.innerHeight + currentLocation) >= getDocumentHeight())) {
  43. window.location.hash = hash;
  44. return;
  45. }
  46. window.requestAnimationFrame(scrollAnimation);
  47. start = timestamp;
  48. }
  49. window.requestAnimationFrame(scrollAnimation);
  50. });
  51. });
  52. });
  53. })();