🧭 Alternative: Intersection Observer (Commented Out) - MuaddhAlsway/Alert-Fashion GitHub Wiki

🧭 Alternative: Intersection Observer (Commented Out)

📄 Code

const sections = document.querySelectorAll('.fade-in-up');
 const appearOnScroll = new IntersectionObserver((entries, observer) => {
  entries.forEach(entry => {
    if (entry.isIntersecting) {
      entry.target.classList.add('visible');
      observer.unobserve(entry.target);
    }
   });
 }, { threshold: 0.1 });
 sections.forEach(section => {
  appearOnScroll.observe(section);
 });

💡 Explanation

  • Native browser method for detecting when elements appear in the viewport.

  • Adds visible class when elements become visible (10% or more).

  • Useful as a lightweight alternative to ScrollReveal.

🔍 How to Practice & Learn More

  • Change class names or delays in ScrollReveal and observe results.

  • Add console.log() in click events to debug behavior.

  • Check your HTML: make sure ids and classes match your JavaScript.

  • Study each method on MDN Web Docs.