js apparition texte au passage de la souris

Marsh Posté le 06-06-2013 à 09:12:23

bonjour,
je cherche a faire apparaitre un texte bull sur le passage a la souris, je sais que c'est du js, mais je c'est pas comment faire.

Reply

Marsh Posté le 06-06-2013 à 09:12:23

Reply

Marsh Posté le 06-06-2013 à 09:19:01

Le plus simple (et probablement le plus compatible) est d'utiliser l'attribut title :

http://www.w3schools.com/tags/att_global_title.asp

Message édité par x1fr le 06-06-2013 à 09:19:36

---------------
Origin / PSN / Steam / Uplay : x1fr - bnet : Fab#2717

Reply

Marsh Posté le 06-06-2013 à 10:23:55

bonjour,
tu peux utiliser les evenement liés à la souris( onmousefocus.....)
et afficher le texte dans la< div> que tu veux
c'est tres simple a gerer mais je sais pas si c'est ce que tu veux exactement...

Reply

Marsh Posté le 06-06-2013 à 20:18:19

pour une petite infobulle
juste en HTML + CSS sa peut suffire

exemple :

code HTML :

<div class="appel">
<div>texte</div>
<div class="bulle">information sur le texte</div>
</div>

code CSS :

.bulle
{
position:absolute; display:none;
width:50px; height:30px;
background:grey;
border:1px solid black;
}

.appel:hover .bulle
{
display:block;
}

---------------
Mon feedback

Reply

Marsh Posté le 07-06-2013 à 09:51:28

solution sexy :

Code :

<a href="#" title="kikooo je suis un title">mouse over please</a>

Code :

a {
display:inline-block;
position:relative;
}
a:after {
content:attr(title);
display:none;
position:absolute;
left:50%;
bottom:100%;
margin-bottom:5px;
min-width:200px;
background:orange;
padding:10px;
color:#000;
}
a:hover:after {
display:block;
}

http://jsbin.com/isemon/1/edit

Message cité 1 fois

---------------
Blablaté par Harko

Reply

Marsh Posté le 07-06-2013 à 16:13:52

bonjour
Tout dépend des attributs de l'objet que ton curseur "survole". Si l'évènement "mouseEnter" ou "mouseLeave" est géré par cet objet, alors il répondra au passage (ou à la pause) du curseur dans sa région. Tu n'as plus qu'à capter ce message et en faire.... ce que tu veux.

Reply

Marsh Posté le 07-06-2013 à 16:59:17

gatsu35 a écrit :

solution sexy :
[...]

Sympa ta solution en css pure mais on se retrouves du coups avec 2 tips, y'a moyen de virer celui par défaut ?

---------------
D3

Reply

js apparition texte au passage de la souris

Sujets relatifs:

Leave a Replay