Aniamcja w GSAP

Question

Chcę zrobić animację w GSAP polegającą na przemieszeniu się obrazka od lewej do prawej strony ekranu. Nie mam pojęcia, gdzie może leżeć błąd. Załączam kod:

const logBtn = document.querySelector("#log-btn");
const paperPlane = document.querySelector(".paper-plane");

const tl = new TimelineLite();

logBtn.addEventListener("submit", function (){
    if(document.querySelector("#password").value == 1122){

        const flightPath = {
            curviness: 1.25,
            autoRotate: true,
            values: [{x: 100, y: -20},
                {x: 300, y: 10},
                {x: 500, y: 100},
                {x: 750, y: -100},
                {x: 350, y: -50},
                {x: 600, y: 100},
                {x: 800, y: 0},
                {x: window.innerWidth, y: -150}]};

tl.set(paperPlane, {display: 'block'});
tl.from(paperPlane, 1, {x: -100})
    .to(paperPlane, 1, {bezier: flightPath, ease: Power1.easeInOut});
} else{
document.querySelector(".warning").style.display = "block";
}
});

 <div class="log-in">
            <p>Enter your PIN:</p>
            <input type="password" id="password" maxlength="4">
            <button type="submit" id="log-btn">Blow It Away</button>
        </div>
        <section class="animation">
            <img class="paper-plane" src="paper.png">
        </section>
        <div class="warning"></div>

 

Answer 1

logBtn.addEventListener("submitclick", function (){

Event submit występuje na elemencie form