111 — WebGL Image TransitionsClick a frame

Media that catches the wind and fills the screen.

Click a frame and it lifts off the page, flaps like a sheet on a line and lands fullscreen. Click again, or press Esc, and it folds back where it hung.

FLING

(01) The idea

Hang an image in it. Click, and the wind takes it off the page, over everything, out to the edges of the screen. Click again and it folds back where it hung.

(02) Presets
01

Sheet

The default. Edges flap like a sheet on a line.

02

Mosaic

Tiles of one colour each, resolving as they land.

03

Breeze

Heavy cloth. Long, low folds that take their time.

04

Ripple

Tight rings run out of the click.

05

Banner

Hung from its left edge, one front sweeps across.

06

Billow

Fills like a sail, swells past and settles.

07

Storm

Everything turned up, colour splitting on every slope.

08

Pleat

Paper. Sharp creases, opening like a fan.

09

Blinds

Slats that swing round, one after another.

10

Pixel

Big blocks of colour that halve into the picture.

(03) Image trail set
(04) Carousel set

Experiments

← Home