자바스크립트/JavaScript

[JS] for each로 gsap 사용하기

KIMJAVAN 2023. 10. 5. 13:16
728x90
{
    const sections = [
        { class: ".onewrap", start: 300 },
        { class: ".twowrap", start: 1000 },
        { class: ".threewrap", start: 1600 },
        { class: ".fourwrap", start: 2200 },
        { class: ".fivewrap", start: 2800 },
        { class: ".sixwrap", start: 3400 }
    ];

    sections.forEach((section, index) => {
        gsap.to(`.alv-three-hori-wrap${section.class}`, {
            scrollTrigger: {
                trigger: ".alv-nine-div-section",
                markers: false,
                start: `${section.start}px 80%`,
                end: `${section.start}px 80%`,
                scrub: true
            },
            marginTop: "0px"
        });
    });

}

section이라는 배열의 class라는 이름이 붙은 값이랑 start라는 이름이 붙은 값에 각각 접근한다