Bonjour à tous,
Je me décide enfin à m'inscrire sur ce site qui est vraiment génial, on y trouve tous ce que l'on veut!
J'ai un petit soucis avec les infobulles (celles faisant l'objet d'un tutoriel sur ce site).
Je vous expose mon problème.
J'ai mis mes infobulles sur des images, et dans cette infobulle se trouve l'image taille réelle. Le problème est que lorsque je survole une des ses images, l'image se déplace pour se mettre à la hauteur de la plus grande image.
Voici les extraits de code concernés
Le HTML
Le CSS
Je vous remercie d'avance, en espérant que quelqu'un puisse me venir en aide
Modifié par Appo (15 Jun 2007 - 14:59)
Je me décide enfin à m'inscrire sur ce site qui est vraiment génial, on y trouve tous ce que l'on veut!
J'ai un petit soucis avec les infobulles (celles faisant l'objet d'un tutoriel sur ce site).
Je vous expose mon problème.
J'ai mis mes infobulles sur des images, et dans cette infobulle se trouve l'image taille réelle. Le problème est que lorsque je survole une des ses images, l'image se déplace pour se mettre à la hauteur de la plus grande image.
Voici les extraits de code concernés
Le HTML
<tr class = "fondtableau">
<td align="center"><a id="tailleplaque1" href="javascript:choixtaille(1);" class="infoGrandePlaque"><img src="/images/immatriculation210x130.gif" name="taille1" width="60%" border="0" id="taille1" style="<?=$taille1?>"/><span><img src="/images/transparence.gif" border="0" id="zoomtaille1"/></span></a></td>
<td align="center"><a id="tailleplaque2" href="javascript:choixtaille(2);" class="infoPlaque"><img src="/images/immatriculation275x75.gif" name="taille2" width="60%" border="0" align="middle" id="taille2" style="<?=$taille2?>"/><span><img src="/images/transparence.gif" border="0" id="zoomtaille2"/></span></a></td>
</tr>
Le CSS
a.infoPlaque {
position:relative;
text-decoration: none;
color : #000;
}
a:hover.infoPlaque {
text-decoration: none;
background: none;
position:relative;
}
a.infoPlaque span {display: none;}
a:hover.infoPlaque span {
display: inline;
position: absolute;
/*top:1.5em;
left:0.5em;*/
bottom: 60px;
left: 0px;
background: #5A5D5A;
/*border:1px solid #000;*/
width:auto;
text-align:center;
font-size: 10px;
}
Je vous remercie d'avance, en espérant que quelqu'un puisse me venir en aide
Modifié par Appo (15 Jun 2007 - 14:59)