document.addEventListener('DOMContentLoaded', function() {
const fadeIns = document.querySelectorAll('.fade-in');
function checkVisibility() {
const windowHeight = window.innerHeight;
const windowTop = window.pageYOffset;
const windowBottom = windowTop + windowHeight;
fadeIns.forEach(el => {
const rect = el.getBoundingClientRect();
const elementTop = rect.top + windowTop;
const elementBottom = elementTop + rect.height;
if (elementBottom > windowTop && elementTop < windowBottom) {
el.classList.add('visible');
}
});
}
checkVisibility(); // Run on page load
window.addEventListener('scroll', checkVisibility); // Run on scroll
window.addEventListener('resize', checkVisibility); // Run on window resize
});