
813: CSS: Scroll Driven Animations

O epizodě podcastu
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
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
Popis podcastu
Full Stack Developers Wes Bos and Scott Tolinski dive deep into web development topics, explaining how they work and talking about their own experiences. They cover from JavaScript frameworks like React, to the latest advancements in CSS to simplifying web tooling.