CSS3 Transitions

Via de oogverblindende post over transitions op Trent Walton’s blog ben ik terecht gekomen op de uiterst bruikbare uitleg van Net Tuts over CSS3 transitions.¬†Hoe Trent zijn header zo heeft geanimeerd (een animerende div met een semi transparante achtergrond?) ben ik nog niet achter.

Hover this… (en de code)

a{
color: #fe2b76;
-webkit-transition:color 1s ease-in;
-moz-transition:color 1s ease-in;
-o-transition:color 1s ease-in;
transition:color 1s ease-in;
}

a:hover{
color: #88083a;
}

Let op: De -webkit toevoeging werkt alleen op Chrome en Safari vandaar deze workaround die meeste browsers zullen ondersteunen.

Bron:
net.tutsplus.com: css-fundametals-css-3-transitions
trentwalton.com: css3-in-transition