From fea0ca1884a0431a7f0fe00f4cd248ec84ec9b7b Mon Sep 17 00:00:00 2001
From: HauErn Lien <lienhe81@gmail.com>
Date: Tue, 1 Oct 2024 12:04:53 +0000
Subject: [PATCH] Update file tryhomepage.html
---
wiki/pages/tryhomepage.html | 45 +++++++++++++++++++++++++++++++++++++
1 file changed, 45 insertions(+)
diff --git a/wiki/pages/tryhomepage.html b/wiki/pages/tryhomepage.html
index ff0d8392..ef9bc990 100644
--- a/wiki/pages/tryhomepage.html
+++ b/wiki/pages/tryhomepage.html
@@ -52,6 +52,25 @@
transform: translate(-50%, -50%);
color: #ffffff;
}
+
+ .logo{
+ position: absolute;
+ display: inline-block;
+ bottom: -20px;
+ opacity: 0;
+ }
+
+ .logo.active{
+ bottom: 0;
+ opacity: 1;
+ transition: ease-in-out 0.5s;
+ }
+
+ .logo.fade{
+ bottom: 150px;
+ opacity: 0;
+ transition: ease-in-out 0.5s;
+ }
body {
font-family: Calibri, sans-serif;
line-height: 1.6;
@@ -78,7 +97,33 @@
</div>
<script>
+ let intro = document.querySelector('.intro');
+ let logo = document.querySelector('.logoheader');
+ let logoSpan = document.querySelectorAll('.logo');
+
+ window.addEventListener('DOMContentLoaded', ()=>{
+ setTimeout(()=>{
+ logoSpan.forEach((span, idx)=>{
+ setTimeout(()=>{
+ span.classList.add('active');
+ }, (idx+1) * 400)
+ });
+
+ setTimeout(()=>{
+ logoSpan.forEach((span, idx)=>{
+ setTimeout(()=>{
+ span.classList.remove('active');
+ span.classList.add('fade');
+ }, (idx + 1) * 50)
+
+ })
+ }, 2000);
+ setTimeout(()=>{
+ intro.style.top = '-100vh';
+ }, 2300)
+ })
+ })
</script>
</body>
</html>
--
GitLab