<script>
// //제이쿼리
//    $(window).scroll(function () {
//     let scrollTop = $(window).scrollTop() + $(window).height() / 2;
//     $(".scrollTop").text(scrollTop);

//     // let offset1 = (scrollTop - $("#section1").offset().top)
//     // let offset2 = (scrollTop - $("#section2").offset().top)
//     // let offset3 = (scrollTop - $("#section3").offset().top)
//     // let offset4 = (scrollTop - $("#section4").offset().top)
//     // let offset5 = (scrollTop - $("#section5").offset().top)
//     // let offset6 = (scrollTop - $("#section6").offset().top)
//     // let offset7 = (scrollTop - $("#section7").offset().top)
//     // let offset8 = (scrollTop - $("#section8").offset().top)
//     // let offset9 = (scrollTop - $("#section9").offset().top)

//     // $("#section1 .content-item-desc").css({ transform: "translateX("+ offset1+"px)" });
//     // $("#section2 .content-item-desc").css({ transform: "translateX("+ offset2+"px)" });
//     // $("#section3 .content-item-desc").css({ transform: "translateX("+ offset3+"px)" });
//     // $("#section4 .content-item-desc").css({ transform: "translateX("+ offset4+"px)" });
//     // $("#section5 .content-item-desc").css({ transform: "translateX("+ offset5+"px)" });
//     // $("#section6 .content-item-desc").css({ transform: "translateX("+ offset6+"px)" });
//     // $("#section7 .content-item-desc").css({ transform: "translateX("+ offset7+"px)" });
//     // $("#section8 .content-item-desc").css({ transform: "translateX("+ offset8+"px)" });
//     // $("#section9 .content-item-desc").css({ transform: "translateX("+ offset9+"px)" });

//     // for(let i=1; i<=9; i++){
//     //     let offset = (scrollTop - $("#section"+i).offset().top)
//     //     $("#section"+i+" .content-item-desc").css({transform : "translateX("+offset+"px)"});
//     // }

//     $(".content-item").each(function (){
//         let offset1 = (scrollTop - $(this).offset().top) * 0.1;
//         let offset2 = (scrollTop - $(this).offset().top) * 0.2;
//         let offset3 = (scrollTop - $(this).offset().top) * 0.3;
//         let offset4 = (scrollTop - $(this).offset().top) * 0.4;

//         $(this).find(".content-item-desc").css({ "transform": "translateY(" + -offset2 + "px)" });
//         $(this).find(".content-item-num").css({ "transform": "translateY(" + offset2 + "px)" });
//         $(this).find(".content-item-img").css({ "transform": "translateY(" + offset2 + "px)" });
//     });
// });

//자바스크립트
window.addEventListener("scroll", () => {
    let pageYOffset = (window.pageYOffset || document.documentElement.scrollTop) + screen.height / 2;

    document.querySelector(".scrollTop").textContent = pageYOffset;
    document.querySelectorAll(".content-item").forEach(elem => {
        
        let target = elem.childNodes[7];
        
        let offset = (pageYOffset - elem.offsetTop) * 0.2;

        // console.log("페이지 YOffset : " + pageYOffset);
        // console.log("offsettop : " + elem.offsetTop);
        // console.log("offset" + (pageYOffset - elem.offsetTop)*0.2);
        target.style.transform = "translateY(" + -offset + "px)";
    });
});
</script>