Changer du texte au passage de la souris

Bonjour

Je recherche pour changer de texte au passage de la souris.
C'est à dire j'ai une texte ex: Bonjour j'aimerai que lorsque je passe ma souris dessus le texte Bonjour change et devient Au revoir

Je vous remercie

Max

Code:

---

1 2 3 4 5 6

<p> <span onmouseover="this.innerText='Aurevoir'"> Bonjour </span> à tous </p>

---

Salut

Code:

---

<span onmouseenter="this.innerText='au revoir'" onmouseout="this.innerText='bonjour'">

---

pour que la phrase revienne comme elle était avant le passage de la souris.

Et pour mémoire, le principe existe sans JS:

Code:

---

1 2	.t:after{content: "Bonjour"} .t:hover:after{content:"Au revoir"}

---

Code:

---

<div class="t"></div>

---

et pour dynamiser le tout (toujours sans JS) (je pense qu'il voudra faire autre chose que bonjour/au revoir)

Code:

---

<div class="test" data-nohover="Bonjour" data-hover="Au revoir"></div>

---

Code:

---

1 2	.test:after{ content: attr(data-nohover); } .test:hover:after{ content: attr(data-hover); }

---

Bonjour,
il est surprenant que vous utilisiez le pseudo-élément :after pour insérer quelque chose avant :D

"avant"? Avant quoi? C'est un exemple avec un contenant vide...