S4 - Javascript

Continuons à partir de l'exercice 2 (position de la souris sur l'image).
Copiez les fichiers exo-2.html et exo-2.js en exo-3.html et exo-3.js
Remplacez exo-2 par exo-3 dans exo-3.html
(important: n'oubliez pas de remplacer exo-2.js par exo-3.js dans exo-3.html)

L'objectif:

Attention: on va faire tout ceci ensemble, sur les pages suivantes.

Quand l'utilisateur clique sur l'image tux.png, on voudrait qu'une autre petite image (verte) soit ajoutée à l'endroit ou il a cliqué.

D'un point de vue technique, il va falloir:

• Ajouter un gestionnaire d'événements pour le click sur l'image.
• Dans cette fonction, il faut créer un nouvel élément img (voir cours)
  L'image se trouve ici : https://moodle.iutv.univ-paris13.fr/img/js/splat.png
  
• Positionner l'image en utilisant la position de la souris.
• Ajouter l'image dans l'arbre DOM.

On a vu toutes ces notions en cours, sauf le positionnement.

On va donc commencer par un rappel sur le positionnement CSS.