Merge pull request #742 from Hemraj-7/nav-branch

Navbar Z-index and navbar handler issue is solved, Issue number #715
swaraj-das · Nov 10, 2024 · 87ac088 · 87ac088
2 parents 30c20a7 + 70b23a9
commit 87ac088
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 5 deletions.
diff --git a/index.html b/index.html
@@ -108,11 +108,11 @@
 
         <nav>
             <ul id="menuList">
-                <li><a href="#controller">Game Controllers</a></li>
-                <li><a href="#vrsection">VR Accessories</a></li>
-                <li><a href="#keyboard">Gaming Keyboard</a></li>
-                <li><a href="#others">Others</a></li>
-                <li class="login"><a href="login/login.html">Login</a></li>
+                <li><a href="#controller" onclick="closeNav()">Game Controllers</a></li>
+                <li><a href="#vrsection" onclick="closeNav()">VR Accessories</a></li>
+                <li><a href="#keyboard" onclick="closeNav()">Gaming Keyboard</a></li>
+                <li><a href="#others" onclick="closeNav()">Others</a></li>
+                <li class="login"><a href="login/login.html" onclick="closeNav()">Login</a></li>
                 <!-- Theme Toggle -->
                 <li><label class="switch">
                         <input type="checkbox" id="theme-toggle" onchange="toggleTheme()">

diff --git a/script.js b/script.js
@@ -15,6 +15,11 @@ function toggleMenu() {
     }
 }
 
+function closeNav(){
+  menuList.style.height = "0px";
+  menuList.style.paddingTop = "0px";
+}
+
 window.onscroll = function() {
     updateProgressBar();
   };

diff --git a/style.css b/style.css
@@ -1282,6 +1282,7 @@ button {
   #menuList {
     overflow: hidden;
     transition: 0.5s;
+    z-index: 99;
   }
 
   .row {