Difference between revisions of "Template:Melbourne"

Line 3: Line 3:
 
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
 
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
  
// When the user scrolls down 20px from the top of the document, slide down the navbar
+
// When the user scrolls the page, execute myFunction
// When the user scrolls to the top of the page, slide up the navbar (50px out of the top view)
+
window.onscroll = function() {myFunction()};
window.onscroll = function() {scrollFunction()};
+
  
function scrollFunction() {
+
// Get the navbar
  if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) {
+
var navbar = document.getElementById("topnav");
    document.getElementById("navbar").style.top = "19px";
+
  }
+
  
 +
// Get the offset position of the navbar
 +
var sticky = navbar.offsetTop;
 +
 +
// Add the sticky class to the navbar when you reach its scroll position. Remove "sticky" when you leave the scroll position
 +
function myFunction() {
 +
  if (window.pageYOffset >= sticky) {
 +
    navbar.classList.add("sticky")
 +
  } else {
 +
    navbar.classList.remove("sticky");
 +
  }
 
}
 
}
 +
  
  

Revision as of 12:45, 6 October 2018