diff --git a/script.js b/script.js index b75fd82..88a5e2a 100644 --- a/script.js +++ b/script.js @@ -2,25 +2,26 @@ window.onload = function() { // Select all paragraphs that immediately follow an h2 element const articles = document.querySelectorAll('h2 + p'); - articles.forEach(article => { + articles.forEach((article, index) => { // Set initial opacity of each article to 0 (hidden) article.style.opacity = '0'; // Function to gradually increase the opacity of the article const fadeIn = () => { let opacity = 0; - const interval = setInterval(() => { + const increaseOpacity = () => { opacity += 0.05; article.style.opacity = opacity; - // Stop the interval when opacity reaches 1 (fully visible) - if (opacity >= 1) { - clearInterval(interval); + // Continue the animation until opacity reaches 1 (fully visible) + if (opacity < 1) { + requestAnimationFrame(increaseOpacity); } - }, 30); + }; + requestAnimationFrame(increaseOpacity); }; // Delay the fade-in effect based on the article's index - setTimeout(fadeIn, 500 * articles.indexOf(article)); + setTimeout(fadeIn, 500 * index); }); }; \ No newline at end of file