CSS 3 Rotating Billboard

This was a fun little exercise trying to replicate those rotating billboards you see on the freeways or even in some baseball parks behind the batters' box. Basically, the idea was to create a row of 3D triangular slats which can be rotated together to show a different image / ad / whatever. And, like most things I've been posting here lately, this doesn't really play well with IE or any older browsers.

iOS-style Toggle Switches with CSS

The other day, a coworker ran into a bit of a snag when trying to create form elements (checkboxes) in the style of the toggle switches found in the iOS 5 settings menus. Basically, the hiccups were coming from (what I think is) a bug in webkit browsers that causes children of elements with rounded corners from being fully clipped when any position or transform properties are applied. This doesn't really mater if no background colors or images are applied to the child elements.. if it does, this is what heppens:

Rotating 3D Cube with Touch (webkit only)

I've been toying around with this for a little while --- and it's been a lot of fun. It's a pretty straightforward project: make a 3D cube with CSS and make it spin with javascript via touch and mouse interactions. Currently, the interactive part only works in webkit browsers as I'm using the WebkitCSSMatrix object to apply the transformations. In the future, I hope to come back to this and revise it to work non-webkit browsers. But that's a project for another day.

Star Wars Opening Crawl with CSS3

So... if you're looking around the new site (and you have a modern browser,) you'll see that I really dig CSS transforms and transitions at the moment—so I'll probably be posting a few more of these types of exercises in the near future.

New Site

Okay, so here we are. And as clichéd as it might sound, I thought a new year deserved a new start—so I revamped this place from the ground up.