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(-35px)'; h2.style.opacity = '0'; h2.style.transform = 'translateX(-35px)'; // Trigger the reflow to restart the CSS animation void h1.offsetWidth; void h2.offsetWidth; // Apply the fade-in effect h1.style.transition = 'opacity 0.8s ease, transform 0.6s ease'; h1.style.opacity = '1'; h1.style.transform = 'translateX(0)'; h2.style.transition = 'opacity 0.8s ease, transform 0.6s ease'; h2.style.opacity = '1'; h2.style.transform = 'translateX(0)'; });