Merge pull request #95 from ruchikakengal/main

Add scroll top button
swaraj-das · Nov 9, 2024 · 5e7bae8 · 5e7bae8
2 parents 3cf72c4 + d829054
commit 5e7bae8
Showing 1 changed file with 46 additions and 3 deletions.
diff --git a/index.html b/index.html
@@ -20,6 +20,42 @@
         integrity="sha512-Kc323vGBEqzTmouAECnVceyQqyqdsSiqLQISBL29aUW4U/M7pSPA/gEUZQqv1cwx4OnYxTxve5UMg5GT6L4JJg=="
         crossorigin="anonymous" referrerpolicy="no-referrer" />
     <link rel="stylesheet" href="style.css">
+    <style>
+        .scroll-button {
+            position: fixed;
+            right: 20px;
+            bottom: 20px; /* Adjust for positioning */
+            padding: 10px 15px;
+            background-color: #007BFF;
+            color: white;
+            border: none;
+            border-radius: 5px;
+            cursor: pointer;
+            z-index: 1000;
+        }
+
+        .scroll-button:hover {
+            background-color: #0056b3;
+        }
+    </style>
+</head>
+
+<body>
+    <div class="container">
+        <div class="navbar">
+            <img src="images/logo.png" class="logo" alt="Logo">
+            <span class="website-name">Collect your GamingTools</span>
+            <nav>
+                <ul id="menuList">
+                    <li><a href="#">Game Controllers</a></li>
+                    <li><a href="#">VR Accessories</a></li>
+                    <li><a href="#">Media Remotes</a></li>
+                    <li><a href="#">Others</a></li>
+                    <li class="login"><a href="login/login.html">Login</a></li>
+                </ul>
+            </nav>
+            <img src="images/menu.png" class="menu-icon" onclick="toggleMenu()">
+        </div>
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css"
         integrity="sha384-k6RqeWeci5ZR/Lv4MR0sA0FfDOMhZj7z9qvhs8kcJ6D6t3h7jsKK4Gk16+/D57g" crossorigin="anonymous">
 
@@ -131,7 +167,6 @@ <h2 class="h2">Sign up for exclusive offers & updates</h2>
 
         <!-- Pop up HTML Ends here -->
 
-
         <!-- PS4 Controller Section -->
 
         <div class="row" id="controller">
@@ -722,7 +757,7 @@ <h2>Feedback Form</h2>
         </div>
 
     </footer>
-
+    <button id="scrollToTop" class="scroll-button">Scroll to Top</button>
     <!-- SIDEBAR -->
 
     <div class="social-sidebar">
@@ -781,7 +816,14 @@ <h2>Feedback Form</h2>
     <script src="popup/popup.js"></script>
     <script type="module" src="https://unpkg.com/[email protected]/dist/ionicons/ionicons.esm.js"></script>
     <script nomodule src="https://unpkg.com/[email protected]/dist/ionicons/ionicons.js"></script>
-
+    <script>
+        document.getElementById('scrollToTop').onclick = function() {
+            window.scrollTo({
+                top: 0,
+                behavior: 'smooth'
+            });
+        };
+    </script>
     <script>
         window.embeddedChatbotConfig = {
             chatbotId: "awMKW3zFwW7jzUNsN4Q8O",
@@ -801,6 +843,7 @@ <h2>Feedback Form</h2>
     <script src="https://cdnjs.cloudflare.com/ajax/libs/bodymovin/5.7.6/lottie.min.js"></script>
     <script src="./Loader/Loader.js"></script>
 
+
     </script>
     </div>