Bookmarked: CSS scroll-triggered animations are here, and I completely missed them | Blog Cyd Stumpel

Regular animations are triggered immediately (or after a time delay), and a time duration determines the progress of the animation. Scroll-driven animations animate between two points on the page based on the user’s scroll position, the triggering element’s position determines the start, end and progress the animation. Scroll-triggered animations are animations that are triggered by the active range of the trigger element. While they are triggered they run on a regular, time-based animation timeline, but they can be interrupted by leaving the active range as well. Neat Source: cydstumpel.nl