Loads of cool stuff this week, from revealing contents on scroll, using cubic-bezier, and making show-hide animation accessible!

♥️ Donovan at CSSAnimation.rocks

Revealing Contents on Scroll Using JavaScript’s Intersection Observer API — daveyhert.hashnode.dev

A Beginner's Guide to The Intersection Observer API - handy tutorial!

Advanced CSS Animation Using cubic-bezier() — css-tricks.com

A properly in-depth exploration of cubic-bezier curves, along with the math that explains them. Also, cool demos!

Sexy, accessible show-hide animations in any web framework — bholmes.dev

A good overview of show-hide animations that includes making it accessible to keyboard users and screenreaders

How to Code a Crosshair Mouse Cursor with Distortion Hover Effect — tympanus.net

A quick tutorial on how to craft a fullscreen SVG crosshair mouse cursor with a special distortion effect on hover.

Inspiration

InfiNic Cage

Scroll to see the effect. Maybe not something for your next project but interesting anyway

Spot the Difference - Mantis

Earn some confetti by spotting the differences

Codepen Challenge: Insects

Super-smooth animated bee with controls 🐝