Warning: Google Chrome only
Take a look at my CSS for the full idea, but basically, I created one animation and applied it three times, varying only the duration of the animation. All I’m doing is changing the height of a
div inside of a table cell. Turns out, animations on background color don’t work too hot, and neither do animations on gradients. So the simple solution I could find was to place inside the table cell that one additional
div and have it fill 100% of it’s container.
Feel free to fork it on github, too!