animation erst abspielen wenn section erreicht ist

  • Hey, ich bin am üben für die Abschlussprüfung... wir haben die von 2016 vorliegen, da gehts drum einen Onepager zu bauen... ich will den bissl dynamischer gestalten und hab vereinzelt css animationen am laufen.. so gut soweit.. ich habe am Anfang ein Heroimage mit 100Vh... wenn ich dann runter scrolle ist die Animation bereits abgespielt ohne dass irgendjemand davon Wind bekommen hat... wie kann ich es angehen dass die Animation abgespielt wird wenn ich die Section erreicht habe ? Das habe ich bisher aber es klappt nicht


    HTML

    CSS


    Javascript

    Code
    1. <script>
    2. let scrollanimation1 = document.getElementById("scrollanimation1")
    3. scrollanimation1.addEventListener("scroll", function (e) {
    4. scrollanimation1.classList.add("card-deck-animation")
    5. });
    6. </script>