섹션에서 애니메이션 실행에 대해 문의드립니다.

섹션에서 애니메이션 실행에 대해 문의드립니다.

QA

섹션에서 애니메이션 실행에 대해 문의드립니다.

본문

https://o2rexmall.com/shopinfo/company.html

 

이 웹페이지에서 마우스 스크롤을 위 아래 위 아래로 반복적으로 움직여 보면

섹션이 바뀌면서 애니메이션이 실행되는데요,

웹페이지가 리플래시되서 스크립트가 실행되는게 아니라,

현재 페이지 안에서 섹션이 바뀌었을 뿐인데도 인식하고 실행됩니다. 섹션이 바뀔때마다 실행됩니다.

 

어떻게 저럴수 있는지 신기하고,

궁굼해서 문의 남겨봅니다.

 

페이지가 안바뀌었고, 스크롤로 섹션만 이동했을 뿐인데,

애니메이션이 인식하고 움직이는 방법이 있나요?

 

이 질문에 댓글 쓰기 :

답변 2

각 메인 섹션엔

[swiper]  

https://codesandbox.io/p/sandbox/mg9ssk?file=%2Findex.html

 

섹션안에 애니메이션은 이거 사용 하시면 

[aos]

https://michalsnik.github.io/aos/

 

손쉽게 충분히 만드실 수 있습니다.

 

아.. 감사합니다. 근데 알려주신 aos는 저 웹페이지처럼  스크롤 다운할때 실행은 되는데, 스크롤 업하니 이미 실행완료 된 상태로 머물러 있네요.. 제가 링크한 웹페이지는 스크롤업, 다운 할때마다 웹페이지 리플래시 없이 섹션만 이동해도 이동할때마다 동작을 해서요.. 어떻게 저렇게 할수있는지가 궁굼 합니다.

javascript 로 된거면 window scroll 로 감지해서 실행시키는 방법이지않을까싶네요

풀스크린이면 active 부여될때 실행시킬수도있고여

답변을 작성하시기 전에 로그인 해주세요.
전체 2,660
QA 내용 검색

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT