document.addEventListener("DOMContentLoaded", () => {
const stickyImage = document.getElementById("sticky-image");
const sections = document.querySelectorAll(".bottom-text section");
const observer = new IntersectionObserver((entries) => {
entries.forEach(entry => {
if (entry.isIntersecting) {
const newSrc = entry.target.dataset.image;
if (stickyImage.src !== newSrc) {
stickyImage.classList.add("fade-out");
setTimeout(() => {
stickyImage.src = newSrc;
stickyImage.classList.remove("fade-out");
}, 800); // match CSS transition time
}
}
});
}, { threshold: 0.5 });
sections.forEach(section => observer.observe(section));
});