Skip to main content
CSS-Tricks
  • Articles
  • Notes
  • Links
  • Guides
  • Almanac
  • Picks
  • Shuffle
Search

Articles Tagged
animation

154 Articles
{
,

}
Direct link to the article Quick Hit #28
animation

Quick Hit #28

I like how I’m hearing animations distinguished as “time-based animations” (or TBA) and “scroll-driven animations” (or SDA). A third? Maybe “navigation-based animations” (or NBA, lol) for multi-page transitions?…

Geoff Graham on Nov 8, 2024
Direct link to the article Unleash the Power of Scroll-Driven Animations
animation Scroll Driven Animation

Unleash the Power of Scroll-Driven Animations

I’m utterly behind in learning about scroll-driven animations apart from the “reading progress bar” experiments all over CodePen. Well, I’m not exactly “green” on the topic; we’ve published a handful of articles on it including this neat-o one by Lee …

Geoff Graham on Oct 21, 2024 Updated on Jan 6, 2025
Direct link to the article Combining forces, GSAP & Webflow!
animation GSAP news webflow

Combining forces, GSAP & Webflow!

Change can certainly be scary whenever a beloved, independent software library becomes a part of a larger organization. I’m feeling a bit more excitement than concern this time around, though.

If you haven’t heard, GSAP (GreenSock Animation Platform) is teaming …

Ryan Trimble on Oct 18, 2024
Direct link to the article animation
animation

animation

The animation property in CSS can be used to animate many other CSS properties such as color, background-color, height, or width. Each animation needs to be defined with the @keyframes at-rule which is then called with …

Ryan Trimble on Sep 9, 2024 Updated on Sep 19, 2024
Direct link to the article CSSWG Minutes Telecon (2024-08-14)
animation popover transition

CSSWG Minutes Telecon (2024-08-14)

I was just going over the latest CSSWG minutes (you can subscribe to them at W3C.org) and came across a few interesting nuggets I wanted to jot down for another time. The group discussed the CSS Values, CSS Easing, and …

Geoff Graham on Aug 16, 2024
Direct link to the article Transitioning to Auto Height
animation transition

Transitioning to Auto Height

I know this is something Chris has wanted forever, so it’s no surprise he’s already got a fantastic write-up just a day after the news broke. In fact, I first learned about it from his post and was unable …

Geoff Graham on Jun 28, 2024 Updated on Dec 10, 2024
Direct link to the article Moving Backgrounds
animation background-image background-position

Moving Backgrounds

We often think of background images as texture or something that provides contrast for legible content — in other words, not really content. If it was content, you’d probably reach for an <img> anyway, accessibility and whatnot.

But there are …

Saleh Mubashar on Feb 9, 2023
Direct link to the article Animating CSS Grid (How To + Examples)
animation grid grid-template-columns grid-template-rows

Animating CSS Grid (How To + Examples)

I’m pleased to shine a light on the fact that the CSS grid-template-rows and grid-template-columns properties are now animatable in all major web browsers! Well, CSS Grid has technically supported animations for a long time, as it’s baked right …

Daniel Schwarz on Jan 25, 2023
Direct link to the article So, you’d like to animate the display property
animation display transition

So, you’d like to animate the display property

The CSS Working Group gave that a thumbs-up a couple weeks ago. The super-duper conceptual proposal being that we can animate or transition from, say, display: block to display: none.

It’s a bit of a brain-twister to reason …

Geoff Graham on Dec 15, 2022
  • Newer
  • 1
  • ...
  • 2
  • 3
  • 4
  • ...
  • 18
  • Older

CSS-Tricks is powered by DigitalOcean.

Keep up to date on web dev

with our hand-crafted newsletter

DigitalOcean
  • About DO
  • Cloudways
  • Legal stuff
  • Get free credit!
CSS-Tricks
  • Contact
  • Write for CSS-Tricks!
  • Advertise with us
Social
  • RSS Feeds
  • CodePen
  • Mastodon
  • Bluesky
Back to Top