Discussion :

[apdf1]

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

[Hephaistos007]

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
<p>
<span onmouseover="this.innerText='Aurevoir'">
Bonjour
</span>
 à tous
</p>

[ProgElecT]

Salut

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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

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

[javatwister]

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

Code css :

Sélectionner tout - Visualiser dans une fenêtre à part

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

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

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

[Doksuri]

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

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

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

Code css :

Sélectionner tout - Visualiser dans une fenêtre à part

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

[NoSmoking]

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

[javatwister]

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