In this episode of Syntax, Wes and Scott talk about CSS’ new scroll-driven animations, its implementation, uses, and potential pitfalls. They also discuss animation-timeline and animation-range, and how they can be utilized to control animations based on scroll positions.

Show Notes

• 00:00 Welcome to Syntax!
• 00:46 Brought to you by Sentry.io.
• 01:35 Scroll-driven animations.
  • Syntax 695: 5 New CSS Features You Should Know

Scroll-driven animations demos and tools.

04:13 @keyframes.

05:22 animation-timeline.

11:35 animation-range.

08:49 View-based timelines.

17:45 Neat uses: Dave Rupert on styling :stuck.

Hit us up on Socials!

Syntax: X Instagram Tiktok LinkedIn Threads

Wes: X Instagram Tiktok LinkedIn Threads

Scott: X Instagram Tiktok LinkedIn Threads

Randy: X Instagram YouTube Threads