jQuery없이 Animate.css?

Question

저는 스크롤을 할 때 애니메이션이 나타나는 웹 사이트를 만들려고합니다. Animate.css 라이브러리를 사용하고 있지만 설명서에는 jQuery와 함께 사용하는 방법 만 나와 있지만 바닐라 자바 ​​스크립트를 사용하는 방법을 배우고 있습니다. Animate.css를 만드는 방법을 잘 모르겠습니다. jQuery없이. window.pageYOffset을 사용하려고했지만 브라우저가 컨테이너에 도달 할 때만 작동하고 스크롤에 의해 표시되지 않을 때만 작동합니다.

Answer 1

다음은 jQuery없이 애니메이션을 적용하는 방법의 예입니다. 스크롤 이벤트에 대한 MDN 문서 페이지 window.onscroll을 조사하십시오.

const $item = document.querySelector('.starred-item'); 
$item && ($item.classList.add('animated', 'bounce'));