Articles web

Nos articles concernant les techniques web sont centrés sur des solutions pratiques qui mettent en œuvre, le plus souvent, notre framework web : Vae Soli!

Des articles généraux sont également fournis dans le respect des standards du web.

Tous nos articles web sont disponibles sous le couvert de la licence Icône Creative Commons Creative Commons — Paternité - pas de modification.

2009-03-23 à 15:59:38

Animation en javascript

Animer un objet, grâce à javascript, peut apporter à votre un véritable plus … pour autant que vous restiez dans la sobriété.

Dans cet article, nous allons montrer comment animer une division pour quelle bouge, en ligne droite, vers n'importe quelle position, à gauche, à droite, vers le haut, vers le bas ou en diagonale.

Pour illustrer notre propos, nous allons donc déplacer le rectangle rouge vers la case sur laquelle vous cliquerez.

Click! Click! Click!
Click!
 
 Click!
Click! Click! Click!

Comment nous y sommes-nous pris ? Tout d'abord, nous avons créé une table de neuf cellules. Dans la cellule du milieu, nous avons inclus une division dont le positionnement est relatif (la fameuse cellule à fond rouge). Toutes les autres cellules sont affublées d'un événement onclick qui commandera l'animation souhaitée.