added loader

Git21221 · Jul 25, 2023 · 77ca6ad · 77ca6ad
1 parent 8fdbfcc
commit 77ca6ad
Show file tree

Hide file tree

Showing 4 changed files with 27 additions and 6 deletions.
diff --git a/css/style.css b/css/style.css
@@ -14,7 +14,14 @@
   -o-box-sizing: border-box;
   box-sizing: border-box;
 }
-
+#preloader{
+  position: fixed;
+	height: 100vh;
+	width: 100%;
+	background: url(/img/SVKl.gif) no-repeat black;
+	background-size: 10%;
+	background-position: center;
+}
 .clearfix:before,
 .clearfix:after {
   display: table;

diff --git a/img/SVKl.gif b/img/SVKl.gif
diff --git a/index.html b/index.html
@@ -13,8 +13,10 @@
     })(window, document, 'script', 'dataLayer', 'GTM-59R3T9Z9');</script>
   <!-- End Google Tag Manager -->
   <meta charset="UTF-8" />
-  <meta name="description" content="Explore our 3D virtual solar system and learn about planets in an interactive space exploration.">
-  <meta name="keywords" content="earth, space, moon, 3d-images 3d-animation, planets, Solar System, Virtual Solar System, Planet Models, Astronomy Visualization,Space Exploration, Educational Space Simulation, Celestial Bodies, Planetary Orbits,Astronomy App,Astronomical Visualization,Space Educational Tool,Learn About Planets,Outer Space Simulation,Solar System Exploration,Astronomical Models,Space Learning Experience,Planetary System Viewer"  />
+  <meta name="description"
+    content="Explore our 3D virtual solar system and learn about planets in an interactive space exploration.">
+  <meta name="keywords"
+    content="earth, space, moon, 3d-images 3d-animation, planets, Solar System, Virtual Solar System, Planet Models, Astronomy Visualization,Space Exploration, Educational Space Simulation, Celestial Bodies, Planetary Orbits,Astronomy App,Astronomical Visualization,Space Educational Tool,Learn About Planets,Outer Space Simulation,Solar System Exploration,Astronomical Models,Space Learning Experience,Planetary System Viewer" />
   <meta name="author" content="GOAT Elitte Coders(Rahul Das, Saikat Das)" />
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <title>Virtual Galaxy - Explore planets</title>
@@ -97,13 +99,18 @@
 </head>
 
 <body>
+
+
+<!-- loader  -->
+  <div id="preloader"></div>
+  <!-- loader end -->
+
+
   <!-- Google Tag Manager (noscript) -->
   <noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-59R3T9Z9" height="0" width="0"
       style="display:none;visibility:hidden"></iframe></noscript>
   <!-- End Google Tag Manager (noscript) -->
 
-
-  <!-- loader -->
 
 
 

diff --git a/js/script.js b/js/script.js
@@ -1,5 +1,12 @@
-// navbar triggering
 
+const loader = document.getElementById("preloader");
+
+window.addEventListener("load", () => {
+  loader.style.display = 'none';
+})
+
+
+// navbar triggering
 
 
 function toggleMenu() {