base

assets/js/onload.js

@@ -0,0 +1,23 @@
+window.onload = function () {
+  includeHTML();
+  headerShrink();
+};
+
+window.onscroll = function () {
+  headerShrink();
+};
+
+
+
+function headerShrink() {
+  const header = document.getElementById('site-header');
+  const scrollPosition = window.scrollY || document.documentElement.scrollTop;
+
+  if (scrollPosition > 100) {
+    header.classList.add('is-shrinked');
+  } else {
+    header.classList.remove('is-shrinked');
+  }
+}
+
+

assets/js/temp/includeHtml.js

@@ -0,0 +1,33 @@
+// How to use
+// <header id="header" w3-include-html="components/header.html"></header>
+
+
+function includeHTML() {
+
+  var z, i, elmnt, file, xhttp;
+  /* Loop through a collection of all HTML elements: */
+  z = document.getElementsByTagName("*");
+  for (i = 0; i < z.length; i++) {
+    elmnt = z[i];
+    /*search for elements with a certain atrribute:*/
+    file = elmnt.getAttribute("w3-include-html");
+    if (file) {
+      /* Make an HTTP request using the attribute value as the file name: */
+      xhttp = new XMLHttpRequest();
+      xhttp.onreadystatechange = function() {
+        if (this.readyState == 4) {
+          if (this.status == 200) {elmnt.innerHTML = this.responseText;}
+          if (this.status == 404) {elmnt.innerHTML = "Page not found.";}
+          /* Remove the attribute, and call this function once more: */
+          elmnt.removeAttribute("w3-include-html");
+          includeHTML();
+        }
+      }
+      xhttp.open("GET", file, true);
+      xhttp.send();
+      /* Exit the function: */
+      return;
+    }
+  }
+
+}