Advertisement
Guest User

sticky_nav

a guest
Dec 13th, 2018
60
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. const docQuerySelectorAll =
  2.     selector => Array.from( document.querySelectorAll( selector ) );
  3.  
  4. //sticky_nav
  5. const sticky_navArray = docQuerySelectorAll( ".sticky_nav" )
  6.  
  7. const sticky_navArrayStartTopPositions = []
  8.  
  9. sticky_navArray.forEach(
  10.     node => sticky_navArrayStartTopPositions.push( node.offsetTop )
  11. )
  12.  
  13. const getStartYPosition = node =>
  14.     sticky_navArrayStartTopPositions[sticky_navArray.indexOf( node )]
  15.  
  16. const sticky_nav = () => {
  17.     sticky_navArray.forEach( node => {
  18.         let scrolled = window.pageYOffset || document.documentElement.scrollTop;
  19.         if ( scrolled > getStartYPosition( node ) ) {
  20.             node.style.position = "fixed";
  21.             node.style.top = 0;
  22.         } else {
  23.             node.style.top = null;
  24.             node.style.position = null;
  25.         }
  26.         return null;
  27.   } );
  28. }
  29.  
  30. document.addEventListener( "scroll", () => {
  31.     sticky_nav();
  32. } );
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement