Info-bulle qui suit le curseur
Fermé
papalima91
Messages postés
33
Date d'inscription
vendredi 10 novembre 2000
Statut
Membre
Dernière intervention
27 février 2010
-
27 févr. 2010 à 11:56
papalima91 Messages postés 33 Date d'inscription vendredi 10 novembre 2000 Statut Membre Dernière intervention 27 février 2010 - 27 févr. 2010 à 21:48
papalima91 Messages postés 33 Date d'inscription vendredi 10 novembre 2000 Statut Membre Dernière intervention 27 février 2010 - 27 févr. 2010 à 21:48
A voir également:
- Info-bulle qui suit le curseur
- Excel info bulle passage souris ✓ - Forum Excel
- Wifi info view - Télécharger - Divers Réseau & Wi-Fi
- Bad system config info - Forum Windows 10
- Info 38028 ✓ - Forum Mobile
- Problème curseur souris incontrolable résolu ✓ - Forum Virus / Sécurité
8 réponses
artragis
Messages postés
481
Date d'inscription
mardi 12 juin 2007
Statut
Membre
Dernière intervention
6 avril 2010
146
27 févr. 2010 à 13:49
27 févr. 2010 à 13:49
pour une infobule :
code css :
code html :
essaie ça marche
code css :
#infobulle{
display : none;/*au début on ne la fait pas apparaitre*/
}
#lien_image_infobulle:hover #infobulle{
/*le but ici est de faire apparaitre l'infobulle au dessus de l'image lorsque le curseur la survole*/
display : inline;
z-index:200;
border :none;
}
#lien_image_infobulle{
/*ici les styles par défaut du lien qui contient l'image*/
}
code html :
<a href="ta_page" target="_blank" id="lien_image_infobulle"><span id="infobulle">description de l'image</span><img src="ton image" alt="remplacement"/></a>
essaie ça marche
papalima91
Messages postés
33
Date d'inscription
vendredi 10 novembre 2000
Statut
Membre
Dernière intervention
27 février 2010
27 févr. 2010 à 14:32
27 févr. 2010 à 14:32
Hello, Artragis.
j'ai essayé ce code css .
le lien fonctionne mais je n'ai plus d'infobulle du tout.
dream weaver rajoute une ancre nommée dans le coin de l'image.
Je ne dois pas être loin !
merci de m'informer.....
j'ai essayé ce code css .
le lien fonctionne mais je n'ai plus d'infobulle du tout.
dream weaver rajoute une ancre nommée dans le coin de l'image.
Je ne dois pas être loin !
merci de m'informer.....
artragis
Messages postés
481
Date d'inscription
mardi 12 juin 2007
Statut
Membre
Dernière intervention
6 avril 2010
146
27 févr. 2010 à 14:40
27 févr. 2010 à 14:40
mets z-index :1; dans #lien_image_infobulle
sinon, je ne sais pas car pour moi dreamweaver je l'ai jamais essayé, trop cher et jamais bon ce genre de logiciel
sinon, je ne sais pas car pour moi dreamweaver je l'ai jamais essayé, trop cher et jamais bon ce genre de logiciel
papalima91
Messages postés
33
Date d'inscription
vendredi 10 novembre 2000
Statut
Membre
Dernière intervention
27 février 2010
27 févr. 2010 à 15:48
27 févr. 2010 à 15:48
Hello, Artragis.
je pense que le souci vient du lien. Comme j'ai plusieurs styles css,j'ai mis une variable et
j' ai écrit :
<DIV CLASS="variable1">
<a href="le lien.html" title="mon texte" target="_blank"><img src="mon bandeau.gif" width="955" height="33" /></a></DIV></p>
Est-ce correct?
merci de m'informer...
je pense que le souci vient du lien. Comme j'ai plusieurs styles css,j'ai mis une variable et
j' ai écrit :
<DIV CLASS="variable1">
<a href="le lien.html" title="mon texte" target="_blank"><img src="mon bandeau.gif" width="955" height="33" /></a></DIV></p>
Est-ce correct?
merci de m'informer...
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
artragis
Messages postés
481
Date d'inscription
mardi 12 juin 2007
Statut
Membre
Dernière intervention
6 avril 2010
146
27 févr. 2010 à 16:10
27 févr. 2010 à 16:10
un <p> ne peut contenir de <div>
logiquement, avec mon code html, mon css fonctionne...
logiquement, avec mon code html, mon css fonctionne...
papalima91
Messages postés
33
Date d'inscription
vendredi 10 novembre 2000
Statut
Membre
Dernière intervention
27 février 2010
27 févr. 2010 à 17:38
27 févr. 2010 à 17:38
Hello, Artragis.
Je suis une vraie buse !
le mieux que j'ai obtenu, c'est l'affichage "remplacement" au dessus de la fenêtre de mon bandeau qui a disparu.
Par contre quand je survole toute cette fenêtre vide, la bulle s'affiche avec mon texte et reste visible; Au clic, le lien fonctionne.
merci pour ton aide, mais aujourd'hui j'ai mon compte, je vais arrêter.
Merci d'avoir répondu et à bientôt.
papalima91
Je suis une vraie buse !
le mieux que j'ai obtenu, c'est l'affichage "remplacement" au dessus de la fenêtre de mon bandeau qui a disparu.
Par contre quand je survole toute cette fenêtre vide, la bulle s'affiche avec mon texte et reste visible; Au clic, le lien fonctionne.
merci pour ton aide, mais aujourd'hui j'ai mon compte, je vais arrêter.
Merci d'avoir répondu et à bientôt.
papalima91
artragis
Messages postés
481
Date d'inscription
mardi 12 juin 2007
Statut
Membre
Dernière intervention
6 avril 2010
146
27 févr. 2010 à 18:10
27 févr. 2010 à 18:10
une balise <img> doit avoir l'attribut alt="texte" où le texte est en fait le texte qui replace l'image si celle si ne se charge pas. Sur Firefox, ce texte crée aussi une infobulle MAIS CE N'EST PAS UN STANDARD, pour créer une infobulle, c'est comme je te l'ai montré.
papalima91
Messages postés
33
Date d'inscription
vendredi 10 novembre 2000
Statut
Membre
Dernière intervention
27 février 2010
27 févr. 2010 à 21:48
27 févr. 2010 à 21:48
Hello, Artragis.
Enfin j'ai trouvé une bulle CSS entièrement paramétrable , je t'en fais profiter on ne sait jamais, ça donne :
<style type="text/css">
a {
text-decoration:none;
position:relative;
color:blue;
}
a span {
display:none;
}
a:hover {
background:none;
}
a:hover span {
background-color:#eee;
color:#aaa;
display:block;
position:absolute;
top:-19px;
left:340px;
padding:3px 25px;
border:1px dashed #333;
}
</style>
<a href="#"> <img src="mon bandeau.gif" width="850" height="33"/> <span>cliquez
pour voir mon lien </span></a></p>
Il y a une toute petite différence de présentation entre FF et IE mais ça me convient.
A+
papalima91
Enfin j'ai trouvé une bulle CSS entièrement paramétrable , je t'en fais profiter on ne sait jamais, ça donne :
<style type="text/css">
a {
text-decoration:none;
position:relative;
color:blue;
}
a span {
display:none;
}
a:hover {
background:none;
}
a:hover span {
background-color:#eee;
color:#aaa;
display:block;
position:absolute;
top:-19px;
left:340px;
padding:3px 25px;
border:1px dashed #333;
}
</style>
<a href="#"> <img src="mon bandeau.gif" width="850" height="33"/> <span>cliquez
pour voir mon lien </span></a></p>
Il y a une toute petite différence de présentation entre FF et IE mais ça me convient.
A+
papalima91