섹션에서 애니메이션 실행에 대해 문의드립니다.
본문
https://o2rexmall.com/shopinfo/company.html
이 웹페이지에서 마우스 스크롤을 위 아래 위 아래로 반복적으로 움직여 보면
섹션이 바뀌면서 애니메이션이 실행되는데요,
웹페이지가 리플래시되서 스크립트가 실행되는게 아니라,
현재 페이지 안에서 섹션이 바뀌었을 뿐인데도 인식하고 실행됩니다. 섹션이 바뀔때마다 실행됩니다.
어떻게 저럴수 있는지 신기하고,
궁굼해서 문의 남겨봅니다.
페이지가 안바뀌었고, 스크롤로 섹션만 이동했을 뿐인데,
애니메이션이 인식하고 움직이는 방법이 있나요?
답변 2
각 메인 섹션엔
[swiper]
https://codesandbox.io/p/sandbox/mg9ssk?file=%2Findex.html
섹션안에 애니메이션은 이거 사용 하시면
[aos]
https://michalsnik.github.io/aos/
손쉽게 충분히 만드실 수 있습니다.
아.. 감사합니다. 근데 알려주신 aos는 저 웹페이지처럼 스크롤 다운할때 실행은 되는데, 스크롤 업하니 이미 실행완료 된 상태로 머물러 있네요.. 제가 링크한 웹페이지는 스크롤업, 다운 할때마다 웹페이지 리플래시 없이 섹션만 이동해도 이동할때마다 동작을 해서요.. 어떻게 저렇게 할수있는지가 궁굼 합니다.
여러번 보다가 검색을 해봤는데,
아래 영상을 찾게 되어 어째어째 해보면 될 것 같습니다.ㅋ
정말 감사합니다.
https://youtu.be/YTL0vrcvsOY?si=55S4GxSK7eNVSZfB
javascript 로 된거면 window scroll 로 감지해서 실행시키는 방법이지않을까싶네요
풀스크린이면 active 부여될때 실행시킬수도있고여
아.. 제 질문에 관심주셔서 감사드립니다.
근데, 방법론적으로 구체적으로 궁굼해서요...ㅜㅜ