Our new dinnerware came today. Very colorful!

I just couldn’t help but try to figure out a way to do those hover tooltip bubbles without Javascript, so I came up with a way.  This is one is pure CSS3 transforms and transitions, triggered by a selected nested within a hover, which is a bit of a strange construct, but works, at least in Safari 5 (haven’t tested other browsers yet).  It does have some caveats in its current form, but give it a try.

Recently, I needed to create a simple, animated tooltip.  Since I’ve been playing with CSS3 here and there, I decided to see if I could create one that is entirely CSS-based, including animated in/out transitions.  I almost made it.  Unfortunately, there’s no way I know of using pure WebKit CSS3 transitions to make one element trigger an animation on another element, so I had to resort to some simple Javascript to trigger the hover animation on the top paragraph.  All the other animations are CSS3-only.

Take a peek, and feel free to use any of the code, or the idea.

We’ve had this peony in water for over a week now, and it’s still
going. The first flower came and went, and two more have bloomed since.

Pasha had a busy day, and crashed before the sun even went down!

Lor got this for me for our anniversary earlier this year, and it’s
excellent.