File Manager

Editing:scroll-animations.js

/**
 * Royal Curtain — Premium Scroll Entrance Animations
 * Uses IntersectionObserver to trigger animations when elements enter the viewport.
 */
document.addEventListener("DOMContentLoaded", function() {
    // Configure observer options
    const observerOptions = {
        root: null, // use the viewport
        rootMargin: "0px 0px -8% 0px", // triggers slightly before full exit/entrance
        threshold: 0.12 // trigger when 12% of the element is visible
    };

// Callback when elements cross the threshold
    const revealCallback = function(entries, observer) {
        entries.forEach(entry => {
            if (entry.isIntersecting) {
                entry.target.classList.add("reveal-active");
                // Unobserve once animation triggers for cleaner performance
                observer.unobserve(entry.target);
            }
        });
    };

// Create the Intersection Observer instance
    const observer = new IntersectionObserver(revealCallback, observerOptions);

// Select all animatable elements
    const revealElements = document.querySelectorAll(
        ".scroll-reveal, .scroll-reveal-left, .scroll-reveal-right, .scroll-reveal-zoom"
    );

// Register elements with the observer
    revealElements.forEach(el => {
        observer.observe(el);
    });
});

Cancel

🤩 File Manager - Mr.X

Editing:scroll-animations.js