<ul><li>To create an on-scroll animation in JavaScript and CSS, follow these steps:</li><li>1. Add the class id="animate-scroll" to the element you want to animate.</li><li>2. Apply the animation styles in CSS, including opacity, transform, and transition.</li><li>3. Use JavaScript to detect when the element is in the viewport using the IntersectionObserver API.</li><li>4. Add the 'visible' class to the element when it is intersecting with the viewport.</li></ul>

How to make on-scroll animations in JavaScript and CSS

Discover more