Comment faire un "mouseover"?

L'évènement OnMouseOver est lié à la position et au déplacement de la souris . Il est complémentaire à l'évènement OnMouseOut ; il déclenche une action lorsque la souris survole l'élément sur lequel est déclaré cet évènement.

Par exemple sur une image cela permet d'avoir une image différente quand la souris survole l'image et une autre quand la souris est en dehors de l'image.

Il est recommandé d'avoir la même taille d'image pour les 2 évènements.
Voici un exemple ci dessous


Que faut-il taper pour obtenir ce résultat?

Avant même de commencer il faut prévoir 2 images de même taille, et ensuite les mettre en ligne. Une image pour l'affichage 'normal' et une image pour l'affichage 'mouseover' (quand la souris passe sur l'image).

Dans l'écriture d'un message il faut rédiger en code Html le code suivant :

<img src="adresse de l'image normale" onmouseover="this.src='adresse de l'image mouseover'" onmouseout="this.src='adresse de l'image normale'">

Remplacez adresse de l'image normale et adresse de l'image mouseover  par les adresses http des images correspondantes.

Aucun commentaire:

Enregistrer un commentaire