Trying a more Performance Oreiented way of overflox-X:hidden

DinnerBone422 · Aug 15, 2024 · bfa6315 · bfa6315
1 parent 7a8ae79
commit bfa6315
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 6 deletions.
diff --git a/global.css b/global.css
@@ -30,14 +30,13 @@
 }
 
 html, body{
-    overflow-x: hidden;
     background-color: var(--background);
     margin: 0rem;
 }
 
 /*Set the styles for the navigation menu(s)*/
 .navigation{
-    overflow-x: hidden;
+    contain: paint;
 }
 
 nav{
@@ -47,8 +46,6 @@ nav{
     border-width: 0.5rem;
     border-color: var(--roncalli-yellow);
     padding: 1rem 1.5rem 1rem 1.5rem;
-    display: grid;
-    grid-template-columns: auto auto;
     height: 5.5rem;
     width: 100%;
     display: inline-flex;

diff --git a/global.js b/global.js
@@ -4,14 +4,15 @@ var menuState = 0;
 // When this function is called the navigation menu is opened
 function openCloseMenuFunction() {
   if (menuState == 0) { //Menu Opened
+    document.getElementById("menu").style.display = "block";
     document.getElementById("menu").style.transform = "translateX(0)";
     document.getElementById("MenuOpenCloseButton").innerHTML = "close";
-    document.getElementById("menu").style.display = "block";
+
     menuState = 1;
   } else { //Menu Closed
+    document.getElementById("menu").style.display = "none";
     document.getElementById("menu").style.transform = "translateX(100%)";
     document.getElementById("MenuOpenCloseButton").innerHTML = "menu";
-    document.getElementById("menu").style.display = "none";
     menuState = 0;
   }
 }