/* 240610 서주원 - 상단비주얼 애니메이션 */ var controller = new ScrollMagic.Controller(); // 애니메이션 정의 var tween = gsap.to(".visual2", { duration: 1, // 애니메이션 시간 (초) width: "2000px", // 최종 너비 // ease: "power2.inOut" // 이징 적용 }); // ScrollMagic 씬 생성 var scene = new ScrollMagic.Scene({ triggerElement: ".visual2", // 애니메이션 시작 요소 triggerHook: 0.4, // 스크롤 위치 (0.5는 화면 중앙) duration: 270 // 애니메이션 지속 거리 }) .setTween(tween) // .addIndicators({name: "Box Animation"}) // 디버그를 위한 인디케이터 추가 (선택 사항) .addTo(controller); /* 240610 서주원 - 상단비주얼 애니메이션 끝 */ // philosophy tit var controller = new ScrollMagic.Controller(); var scene = new ScrollMagic.Scene({ triggerElement: '.top_philosophy_text', triggerHook: "0.7", }) .setClassToggle('.top_philosophy_text', 'active') .addTo(controller); // philosophy 1 var controller = new ScrollMagic.Controller(); var scene = new ScrollMagic.Scene({ triggerElement: '.box01', triggerHook: "0.7", }) .setClassToggle('.box01', 'active') .addTo(controller); // philosophy 2 var controller = new ScrollMagic.Controller(); var scene = new ScrollMagic.Scene({ triggerElement: '.box02', triggerHook: "0.7", }) .setClassToggle('.box02', 'active') .addTo(controller); // philosophy 3 var controller = new ScrollMagic.Controller(); var scene = new ScrollMagic.Scene({ triggerElement: '.box03', triggerHook: "0.7", }) .setClassToggle('.box03', 'active') .addTo(controller);