pls work
This commit is contained in:
parent
279867cca4
commit
fe8fdeb113
@ -2,11 +2,23 @@ document.addEventListener('DOMContentLoaded', function () {
|
|||||||
var h1 = document.querySelector('.user-index-h1');
|
var h1 = document.querySelector('.user-index-h1');
|
||||||
var h2 = document.querySelector('.user-index-h2');
|
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
|
// Trigger the reflow to restart the CSS animation
|
||||||
void h1.offsetWidth;
|
void h1.offsetWidth;
|
||||||
void h2.offsetWidth;
|
void h2.offsetWidth;
|
||||||
|
|
||||||
// Add the fade-in class to trigger the animation
|
// Apply the fade-in effect
|
||||||
h1.classList.add('fade-in');
|
h1.style.transition = 'opacity 0.8s ease, transform 0.8s ease';
|
||||||
h2.classList.add('fade-in');
|
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)';
|
||||||
});
|
});
|
||||||
|
Loading…
Reference in New Issue
Block a user