From fe8fdeb113630b360deae9b3f43ac558e76e8405 Mon Sep 17 00:00:00 2001 From: AkisYTB3 Date: Thu, 25 Jan 2024 16:05:55 +0100 Subject: [PATCH] pls work --- scripts/pages/user/main.js | 18 +++++++++++++++--- 1 file changed, 15 insertions(+), 3 deletions(-) diff --git a/scripts/pages/user/main.js b/scripts/pages/user/main.js index ce65a90..6f3c5ac 100644 --- a/scripts/pages/user/main.js +++ b/scripts/pages/user/main.js @@ -2,11 +2,23 @@ document.addEventListener('DOMContentLoaded', function () { var h1 = document.querySelector('.user-index-h1'); var h2 = document.querySelector('.user-index-h2'); + // Initial styles for fade-in effect + h1.style.opacity = '0'; + h1.style.transform = 'translateX(-20px)'; + + h2.style.opacity = '0'; + h2.style.transform = 'translateX(-20px)'; + // Trigger the reflow to restart the CSS animation void h1.offsetWidth; void h2.offsetWidth; - // Add the fade-in class to trigger the animation - h1.classList.add('fade-in'); - h2.classList.add('fade-in'); + // Apply the fade-in effect + h1.style.transition = 'opacity 0.8s ease, transform 0.8s ease'; + h1.style.opacity = '1'; + h1.style.transform = 'translateX(0)'; + + h2.style.transition = 'opacity 0.8s ease, transform 0.8s ease'; + h2.style.opacity = '1'; + h2.style.transform = 'translateX(0)'; });