Making Stagger Reveal Animations for Text
17.6.2020
A short tutorial on how to recreate a letter stagger animation with GSAP and Splitting.js.
The post Making Stagger Reveal Animations for Text appeared first on Codrops
LingoJam
17.6.2020
I’ll sometimes search the web for something like “Small Text Generator” knowing there will be some website that will turn some dumb thing I want to type like:
Uhm hi when is that meeting again?
into something fun like…
ᵁʰᵐ ʰᶦ ʷʰᵉⁿ ᶦˢ ᵗʰᵃᵗ ᵐᵉᵉᵗᶦⁿᵍ ᵃᵍᵃᶦⁿˀ
Important note about...
Web Engine Diversity and Ecosystem Health
16.6.2020
As front-end developers, our job is working with browsers. Knowing how many we have and the health of them is always of great interest. As far as numbers go, we have fewer recently than we have in the past. It’s only this month that Edge is starting to auto-update browsers to the Chromium...
Everything You Need to Know About FLIP Animations in React
16.6.2020
With a very recent Safari update, Web Animations API (WAAPI) is now supported without a flag in all modern browsers (except IE).  Here’s a handy Pen where you can check which features your browser supports. The WAAPI is a nice way to do animation (that needs to be done in JavaScript) because...
What is Developer Experience (DX)?
16.6.2020
Developer Experience¹ is a term² that has one somewhat obvious meaning — the experience of developers — but it eludes definition in the sense that people invoke it at different times for different reasons referring to different things. For instance, our own Sarah Drasner’s current job title...
My Flywheel Landing Page
15.6.2020
Flywheel is my WordPress hosting partner here. I use Local every day for my WordPress local development environment and use their hosting for all my WordPress sites as part of my whole flow, so I’m glad they aren’t just a sponsor but a product I use and like.
Last November some of their...
Adding a Custom Welcome Guide to the WordPress Block Editor
15.6.2020
I am creating a WordPress plugin and there is a slight learning curve when it comes to using it. I’d like to give users a primer on how to use the plugin, but I want to avoid diverting users to documentation on the plugin’s website since that takes them out of the experience.
What would...
Striking a Balance Between Native and Custom Select Elements
12.6.2020
Here’s the plan! We’re going to build a styled select element. Not just the outside, but the inside too. Total styling control. Plus we’re going to make it accessible. We’re not going to try to replicate everything that the browser does by default with a native <select> element. We’re going...
Learn Z-Index Using a Visualization Tool
12.6.2020
There are some neat interactive demos in here from Thiru Manikandan. There are a couple of very tricky things with z-index that never fail to confuse. In addition to things like requiring positioning and source order, the trickiest are the stacking contexts and parent/child relationships. z-index...
CUBE CSS
11.6.2020
A CSS methodology from Andy Bell:
The most important part of this methodology is the language itself: CSS. It’s key to note its existence in the name because some alternative approaches, such as BEM—which I have enjoyed for many years—can veer very far away from Cascading Style Sheets. I love CSS...
On Adding IDs to Headers
11.6.2020
Here’s a two-second review. If an element has an ID, you can link to it with natural browser behavior. It’s great if headings have them, because it’s often useful to link directly to a specific section of content.
<h3 id="step-2"Step 2</a
Should I be so inclined, I could...
Collective #609
11.6.2020
Frontend Mentor Challenges * Shape Divider App * :is() and :where() * No Design Development * HTML5 Boilerplate 8.0.0
The post Collective #609 appeared first on Codrops