Logo CSS3 Animation

Je vous envoie l'adresse d'une page HTML o? se trouve une animation CSS autour du logo (pour se donner d'l'inspiration).

On y trouve la propri?t? CSS animation:

• Que l'on d?clare gr?ce ? @keyframes :

  Script avec 14 lignes

  
  001@-webkit-keyframes turn_clockwise {
  002	0%   { -webkit-transform:rotate(0deg) }
  003	100% { -webkit-transform:rotate(360deg) }
  004}
  005
  006@-moz-keyframes turn_clockwise{
  007	0%   { -moz-transform:rotate(0deg) }
  008	100% { -moz-transform:rotate(360deg) }
  009}
  010
  011@keyframes turn_clockwise{
  012	0%   { transform:rotate(0deg) }
  013	100% { transform:rotate(360deg) }
  014}
  

  Retirer les numéros de lignes

• Et on appelle notre animation turn_clockwise :

  Script avec 3 lignes

  
  001-webkit-animation: turn_clockwise 8s infinite;
  002-moz-animation: turn_clockwise 8s infinite;
  003animation: turn_clockwise 8s infinite;
  

  Retirer les numéros de lignes

R?f?rences :

1. CSS3 Create : Animer facilement en CSS toutes les propri?t?s
2. W3C : CSS Transitions
3. AlsaCr?ations : Transitions CSS3
4. CSS3 Create : Enchainez les transitions !