Animated letters

08 Mar 2013

Yesterday the train ran out of power (that's what it looked like) and I got held up for quite some time. The doors wouldn't open so we had no where to go. Unfortunately I forgot to update my weekly TV-Series... so I came up with a crazy (time consuming) idea to work on. I created all four letters of my name, using a few elements and eventually A LOT of CSS. It had to be (some sort of) Responsive that's why all the height, width & positioning values are percentages so it will scale along nicely :) While working on it, I thought it would be nice if the blocks where in 3D, but combining it with animations and the dynamic sizes of the blocks made it really hard (without JS). So for now: no 3D (yet!). Maybe next time I get stuck in a train....

View demo