CSS3 Tiler

This experiment will only work properly on Safari 5+ or Chrome/Chromium 11/12.
Other browsers won’t be able to show it properly due to the lack of CSS3 3D transformations and/or CSS3 transitions.

Use cursor keys to zoom/rotate the tiler grid.

Set ‘Second Axis Rotation’ to ‘none’ to make tiler behave exactly as my other experiment CSS3 Mosaic.

Tiler will randomly divide the image into flying tiles. I’ve set the maximum possible values to be 12×12.
Modify the rows and columns value to set up to 32×32 maximum tiles.

CSS3 Tiler live demo:


Video of CSS3 Tiler in action, just In case you were unable to see it:

Images are (c) zimpenfish under license CC BY 2.0

3 thoughts on “CSS3 Tiler”

Leave a Reply to Anonymous Cancel reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s