DEV Community: lemmin

Animated Flying Birds

lemmin — Thu, 06 May 2021 03:41:18 +0000

Very simple bird flapping animated by CSS with some JS moving them across the screen.

Use the options array at the top of the JS to adjust the speed range, angle range, size range, and the delay between birds.

Ocean waves from a previous pen: https://codepen.io/lemmin/pen/mdrGYaW

Simple Text Revealer

lemmin — Thu, 29 Apr 2021 01:21:13 +0000

All text nodes in the provided container will be parsed and added back into the DOM with a wrapping span (by letter or word) including classes that describe the hidden and revealed styles (and transition).

Any transition you can think of can be used to animate each individual letter or word in sequence (doesn't even need to be a reveal).

The reveal() method returns a promise that resolves when all the text has transitioned. This demo uses the promises to chain the reveal animations together.

You can use reset() or replay() to run the animation again. The transitions will apply when resetting as well (all at once).

Loading Squares CSS Animation

lemmin — Mon, 05 Apr 2021 23:10:54 +0000

Doily Generator

lemmin — Wed, 24 Mar 2021 05:42:23 +0000

Animated Rainbow Button (CSS)

lemmin — Sat, 20 Mar 2021 00:54:42 +0000