From d2372a8bc7ee58ea056044d87d001afaaa8b4aa5 Mon Sep 17 00:00:00 2001
From: HouTeng Chan <ht-chen21@mails.tsinghua.edu.cn>
Date: Thu, 25 Jul 2024 08:41:52 +0000
Subject: [PATCH] Update file description.html
---
wiki/pages/description.html | 32 +++++++++++++++++---------------
1 file changed, 17 insertions(+), 15 deletions(-)
diff --git a/wiki/pages/description.html b/wiki/pages/description.html
index a85dba15..213c095d 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
--
GitLab