TE
TechEcho
Home24h TopNewestBestAskShowJobs
GitHubTwitter
Home

TechEcho

A tech news platform built with Next.js, providing global tech news and discussions.

GitHubTwitter

Home

HomeNewestBestAskShowJobs

Resources

HackerNews APIOriginal HackerNewsNext.js

© 2025 TechEcho. All rights reserved.

Surprising things that CSS can animate (2020)

295 pointsby asicspover 2 years ago

11 comments

63over 2 years ago
I always love seeing tricks like this from designers but then I never see anything this cool on the web otherwise. Where do all these great designers work and why don't I ever get to see the products they make?
评论 #34464860 未加载
评论 #34464079 未加载
评论 #34464331 未加载
评论 #34464964 未加载
评论 #34474749 未加载
评论 #34467783 未加载
egberts1over 2 years ago
Yeah, I too had fun with CSS and curvy circular text animation.<p><a href="https:&#x2F;&#x2F;egbert.net&#x2F;blog&#x2F;index.html" rel="nofollow">https:&#x2F;&#x2F;egbert.net&#x2F;blog&#x2F;index.html</a><p>(Sorry, web access is only HTTP&#x2F;1.1-3, TLSv1.3 and ChaCha-only, no Chrome access possible)
评论 #34465069 未加载
评论 #34464275 未加载
评论 #34463943 未加载
rglzrover 2 years ago
Interesting how so many of these didn&#x27;t work in Safari in 2020, but all of them do now. Good progress for interoperability, I guess.
评论 #34464812 未加载
plusminusplusover 2 years ago
&gt; <i>You could use a bit of JavaScript with setTimeout to get rid of the modal at the right time</i><p>This always felt hacky to me, &quot;animating&quot; visibility instead is a great idea. Thanks for sharing!
评论 #34464420 未加载
mettersover 2 years ago
Reminds me of this blog post <a href="https:&#x2F;&#x2F;www.joshwcomeau.com&#x2F;animation&#x2F;css-transitions&#x2F;" rel="nofollow">https:&#x2F;&#x2F;www.joshwcomeau.com&#x2F;animation&#x2F;css-transitions&#x2F;</a>
philistineover 2 years ago
I watched all of those animations on Safari. The constant reminder that you wouldn&#x27;t see anything on Safari had me doubt my sanity.
评论 #34464643 未加载
评论 #34466174 未加载
drowsspaover 2 years ago
Those CSS animations would be a success in the web of the old days. Reminds me of the whole rounded borders thing: all those hacks and loops to make it work in all browsers (transparent images in the corners, lol), and then finally when there&#x27;s wide browser support, rounded borders were already out of fashion
评论 #34466455 未加载
autoexecover 2 years ago
None of the examples in the article work with js disabled.<p>I&#x27;ll say more generally, that as much as I love all the cool things CSS is capable of these days, I think it&#x27;s gotten to the point where now I want a CSS blocker the same way I block ads and JS by default, ideally something that lets me enable only a sane subset of CSS while blocking everything else.<p>I keep meaning to write one for firefox, but I really don&#x27;t have the time, and I&#x27;m honestly hoping somebody comes along and beats me to it.
评论 #34465022 未加载
评论 #34464326 未加载
评论 #34464814 未加载
culiover 2 years ago
The most amazing imo is the `d` attribute of an svg &lt;path&gt; element
评论 #34466670 未加载
hot_grilover 2 years ago
Not the only surprising thing about CSS.
ehecatl42over 2 years ago
The path to shit started with the `&lt;blink&gt;` GI.