IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)

Vous êtes nouveau sur Developpez.com ? Créez votre compte ou connectez-vous afin de pouvoir participer !

Vous devez avoir un compte Developpez.com et être connecté pour pouvoir participer aux discussions.

Vous n'avez pas encore de compte Developpez.com ? Créez-en un en quelques instants, c'est entièrement gratuit !

Si vous disposez déjà d'un compte et qu'il est bien activé, connectez-vous à l'aide du formulaire ci-dessous.

Identifiez-vous
Identifiant
Mot de passe
Mot de passe oublié ?
Créer un compte

L'inscription est gratuite et ne vous prendra que quelques instants !

Je m'inscris !

Easing.net :
Choisissez la bonne vitesse d'exécution pour rendre vos animations réalistes.

Le , par FirePrawn

0PARTAGES

Animer des éléments sur une page Web est devenu possible grâce à la version 3 de CSS.
Ces animations ont très vite fait l'unanimité et sont de plus en plus utilisées, que ce soit à des fins ergonomiques ou à des fins scientifiques (jeux vidéo par exemple).
Cependant, il convient d'aller un peu plus loin que juste utiliser bêtement ces possibilités.

Easing.net vous explique ce qu'est « l'easing » et pourquoi c'est important.
En effet, une plume tombant d'un toit n'aura pas du tout la même vitesse de chute qu'une boule de bowling.
Et c'est précisément ces différences que nous explique Easing.net.

Le site fournit de nombreux graphiques animés vous permettant d'identifier et de comprendre les différents types d'animations possibles et existants.
Ces exemples vont de l'animation la plus simple (vitesse quasi constante) à des animations bien plus complexes.
Easing.net vous donne également trois exemples simples d'implémentation de « l'easing » :
  • avec le plugin jQuery Easing ;
  • en SCSS ;
  • en CSS 3.


Pour plus d'informations et voir les exemples d'animations je vous invite à consulter la version française du site.

Source : thechangelog.com

Et vous ?

Utilisez-vous les animations ?
Si oui, vous préoccupez-vous de leur réalisme ?

Une erreur dans cette actualité ? Signalez-le nous !