(Up-) Scoped Scroll Timelines
You can give a name (“custom ident”) to any scrolling element’s “timeline”, have a parent element pick it up, then have any other element use it for their own animation timeline. It’s a trip!
You can give a name (“custom ident”) to any scrolling element’s “timeline”, have a parent element pick it up, then have any other element use it for their own animation timeline. It’s a trip!
Heydon blogged about <blockquote> and Michelle blogged our collective sigh at how unfortunately hard the simple act of quoting something is. You’re not supposed to put a <cite> inside the <blockquote> which I find obnoxious especially because the screenreader situation seems fine with that pattern (this WordPress blog does it that way by default). Adrian […]
Technical debt is a bit of a squishy term, generally referring to technical choices and the long term consequences in code. You’ll need to pay that debt one day so the metaphor goes. I admire Bill Clark’s calling: I’m obsessed with tech debt. I want to find it, I want to understand it, and where […]
If you give a scroll or view timeline a –custom-ident name, then any descendent can “listen” to that timeline and base @keyframe animations off of it.
I enjoy writing code in Go, but an easy critique of it is templating doesn’t feel good. I’ve only just heard of Templ and it looks fabulous. You make .templ files which contain what look like JSX functions. They take typed params and have an implied return of the HTML they contain These .templ files […]
A rather exceptional CSS trick discovered by Roman Komarov that uses scroll driven animations to resize lines of text to fit exactly to their container.
Erick Merchant has some ideas for questions to ask a senior front-end-developer (as in, interview questions). They seem pretty decent to me, so if you’re shooting for a senior role, you should probably have answers for these things with a bit more detail than Erick lists.
If you’re creating a scroll-driven animation and the goal is “when the page is scrolling through this general section, animate the children” it’s probably going to involve passing scrolling data through custom properties.
If video game development appeals to you on your journey into design and development, you should check out js13kGames, a “coding competition for web game developers, with a 13KB size limit.” The 2024 winners were recently announced, and I find the lot of them outstanding. 13KB is a heck of a constraint. jQuery is like 30k lol. So […]
Are you using Sass as part of your build process? If you’re using Vite or webpack and importing SCSS files in lots of different components, be aware you should probably switch to sass-embedded instead of sass, as it can, as James Stuckey Weber wrote, “allows you to reuse a single instance of Sass for multiple […]
Frontend Masters Donates to open source projects. $363,806 contributed to date.