diff --git a/wiki/pages/description.html b/wiki/pages/description.html
index a85dba1593673968e40d3a92b276c1e6ec457e5b..213c095d27388f82412d76b356e6366f6348288e 100644
--- a/wiki/pages/description.html
+++ b/wiki/pages/description.html
@@ -32,14 +32,17 @@
     .row.mt-4 {
     margin-left: 130px; 
     }
-    .scroll-progress {
-        position: fixed;
-        right: 0;
-        top: 0;
-        width: 10px;
-        background-color: hsl(17, 100%, 50%);
-        transition: height 0.2s ease-out;
+    .progress-bar {
+     position: fixed;
+     right: 0;
+     top: 0;
+     width: 8px;
+     background-color: hsl(17, 100%, 50%);
+     height: 0%;
+     transition: height 0.3s ease-out;
+     z-index: 999;
     }
+
   </style>
 
 </head>
@@ -59,7 +62,7 @@
       <li><a href="#topic4"">Topic4</a></li>
     </ul>
   </div>
-<div class="scroll-progress"></div>
+<div class="progress-bar" id="progressBar"></div>
 
 <div class="row mt-4">
   <div class="col-lg-12">
@@ -120,13 +123,12 @@
 </div>
 
 {% endblock %}
+
 <script>
-  document.addEventListener("scroll", function() {
-      var winScroll = document.body.scrollTop || document.documentElement.scrollTop;
+  window.onscroll = function() {
+      var winScroll = document.documentElement.scrollTop || document.body.scrollTop;
       var height = document.documentElement.scrollHeight - document.documentElement.clientHeight;
       var scrolled = (winScroll / height) * 100;
-      document.querySelector('.scroll-progress').style.height = scrolled + "%";
-  });
-  </script>
-  </body>
-  </html>
\ No newline at end of file
+      document.getElementById("progressBar").style.height = scrolled + "%";
+  };
+</script>
\ No newline at end of file