nyamsprod.com

Pas un seul de vos ancêtres n'est mort jeune. Ils ont tous copulé au moins une fois.

s’amuser avec le css3

Attention: Les informations de ce billet sont susceptibles d'être obsolètes car vieux de plus 2 ans.
Warning: The information you are reading may be obsolete, this post was published more than 2 years ago.

Pause technique dans mes sélections musicales du bled ( dixit lepetitnegre [1]) pour vous faire découvrir ma dernière démo réalisée avec du CSS3. Le but étant de voir ce que je pouvais faire sans l’aide du javascript. Je ne sais pas ce que vous penserez du résultat final mais je suis sur ma démo vous rappellera des souvenirs d’enfance. En attendant pour les plus presser, n’oubliez pas de regarder la source du document pour comprendre les modules de CSS3 utilisées que je liste ci-dessous:

  • CSS3 animation [2]
  • CSS transition [3]
  • CSS3 transformation [4]
  • CSS3 gradient [5]
  • CSS3 multiple background [6]

et ouais il fallait tout ça pour çà ;) .

Dernière précision, bien que cela me chagrine je suis obligé de dire que seuls les navigateurs récents avec un moteur Gecko ou Webkit seront capable d’un rendu digne de ce nom de ma démo. C’est pas ma faute, c’est les autres navigateurs qui n’ont pas encore implanté l’un ou l’autre module ci-dessus cité :( .

Mise à part de nombreuses techniques intéressantes ce que j’ai surtout retenu c’est que pour définir plusieurs images en arrière plan, il faut toujours partir de l’image la plus proche de l’utilisateur vers l’image la plus éloigné de celui-ci et non l’inverse. Ce conseil aussi anodin vous sera très utile lorsque vous essayerez comme moi de comprendre pourquoi vous ne voyez pas votre image ;) . Et comme dirait l’autre that’s all folks!!

Références

  1. ^ Blog de lepetitnegre
    http://www.lepetitnegre.com/
  2. ^ Référence n°2
    https://developer.mozilla.org/en/CSS/animation
  3. ^ Référence n°3
    https://developer.mozilla.org/en/CSS/-moz-transition
  4. ^ Référence n°4
    https://developer.mozilla.org/en/css/-moz-transform
  5. ^ Référence n°5
    http://leaverou.me/css3-gradients/#intro
  6. ^ Référence n°6
    https://developer.mozilla.org/en/CSS/Multiple_backgrounds

Laisser un commentaire