sidebar.js File Reference

Javascript for the Submenu module. More...

Go to the source code of this file.

Functions
function	closeNav ()
function	openNav ()
document	ready (function() { var sidebarOpen=false;const openBtn=$('#openSubmenuBtn');const sidebar=$('#mySidebar');var showOpenBtnPositionThreshold=600;openBtn.click(function() { openNav();});openBtn.hide();var overlapPositionOrDivBox=$('#globalmenu');$(window).scroll(function() { var overlapPosition=overlapPositionOrDivBox.offset().top+overlapPositionOrDivBox.outerHeight();var sidebarCollider=sidebar.offset().top+sidebar.outerHeight();var thisSidebar=document.getElementById("mySidebar");if(overlapPosition >=sidebarCollider) { thisSidebar.style.width="0px";} let scrollPosition=$(window).scrollTop();if(scrollPosition >=showOpenBtnPositionThreshold) { openBtn.fadeIn();} else { closeNav();openBtn.fadeOut();} });})

Detailed Description

Javascript for the Submenu module.

The .scroll() function is used to detect when the user has scrolled beyond startPosition, at which point the openBtn and mySidebar elements are faded in using .fadeIn(). If the user scrolls back up, the elements are faded out

The introBottom and sidebarBottom variables are set to the bottom position of the intro and sidebar elements respectively, and are used to determine if mySidebar should be hidden because it overlaps with intro. If introBottom is greater than or equal to sidebarBottom, the opacity and width of mySidebar are set to 0.

this code will should only be executed, if the submenu property 'sidebar' is set to true

Definition in file sidebar.js.

Function Documentation

closeNav()

function closeNav

(

)

Definition at line 20 of file sidebar.js.

                    {
    document.getElementById("mySidebar").style.width = "0"; // set width to zero to hide the sidebar
    document.getElementById("main").style.marginLeft= "0"; // reset margin to zero to push main content back to the left
}

Referenced by ready().

openNav()

function openNav

(

)

Definition at line 15 of file sidebar.js.

                   {
    document.getElementById("mySidebar").style.width = "300px"; // how many pixels wide the sidebar is
    document.getElementById("main").style.marginLeft = "125px"; // how many pixels will the main content be pushed to the right
 
}

Referenced by ready().

ready()

document ready

(

function() { var sidebarOpen=false;const openBtn=$('#openSubmenuBtn');const sidebar=$('#mySidebar');var showOpenBtnPositionThreshold=600;openBtn.click(function() { openNav();});openBtn.hide();var overlapPositionOrDivBox=$('#globalmenu');$(window).scroll(function() { var overlapPosition=overlapPositionOrDivBox.offset().top+overlapPositionOrDivBox.outerHeight();var sidebarCollider=sidebar.offset().top+sidebar.outerHeight();var thisSidebar=document.getElementById("mySidebar");if(overlapPosition >=sidebarCollider) { thisSidebar.style.width="0px";} let scrollPosition=$(window).scrollTop();if(scrollPosition >=showOpenBtnPositionThreshold) { openBtn.fadeIn();} else { closeNav();openBtn.fadeOut();} });}

)

References closeNav(), openNav(), and window.