bonjour
j'ai mis en place le tuto "Afficher / Masquer des "calques" sans javascript" sur mon site (en reconstuction php/mysql), pour avoir des infos-bulles expliquant certains mots "savants". J'ai un comportement différent sous Fx et IE 6.0.29, Au final, le résultat de IE est plus proche de ce que je souhaite, c-à-d une info-bulle placée à côté du mot à expliquer, mais la mise en page sous IE est cassée (images/puces des listes disparaissent) après l'affichage d'une info-bulle.
la feuille de style que j'utilise est proche de celle du tuto, les exemples du tuto ont un résultat identique sous Fx et IE.
ma feuille dico.css
et un lien pour tester
merci d'avance
JMM
Modifié par liege67 (28 Dec 2005 - 23:53)
j'ai mis en place le tuto "Afficher / Masquer des "calques" sans javascript" sur mon site (en reconstuction php/mysql), pour avoir des infos-bulles expliquant certains mots "savants". J'ai un comportement différent sous Fx et IE 6.0.29, Au final, le résultat de IE est plus proche de ce que je souhaite, c-à-d une info-bulle placée à côté du mot à expliquer, mais la mise en page sous IE est cassée (images/puces des listes disparaissent) après l'affichage d'une info-bulle.
la feuille de style que j'utilise est proche de celle du tuto, les exemples du tuto ont un résultat identique sous Fx et IE.
ma feuille dico.css
<style type="text/css">
a {
text-decoration: none; /* définition du lien qui affichera le "calque" */
}
a:hover {
background: none; /* correction d'un bug IE */
}
a span { /* définition de la balise <span> inclue dans <a> */
display: none;
}
a:hover span { /* définition de la balise <span> au survol */
display: inline;
position: fixed;
top: 90px; /* positions et dimensions du calque, que vous pouvez changer à loisir */
left: 61px;
width: 318px;
height: 64px;
background: #FFFBE7;
border-width: 2px ;
border-style: solid;
border-color: #FF0000;
text-align: center;
color: black;
font: bold 12px Arial ;
}
</style>
et un lien pour tester
merci d'avance
JMM
Modifié par liege67 (28 Dec 2005 - 23:53)