rss
Rechercher : dans
Par : Pertinence Date Nom d'utilisateur
Statut : Résolu

Css/bug IE6 afficher infobulle au dessus div

BartWadela, le jeudi 22 mai 2008 à 14:36:14
Bonjour,

Je pense qu'il me manque juste un p'tit truc mais la JE SECHE.

je voulais faire une zone cliquable sur une image de 39px W sur 35px H = donc j'ai fais un petit usemap : 

<img src="logocfccar.png" usemap="#bouton_start" border="0">

<map name="bouton_start">
	<area shape="rect" href="#" title="text- info-bulle" coords=4,62,40,95>
</map>

ca fonctionne impeccable y'a aucun probleme,, seulement je trouve que l'apparence de la bull="title" fait un peu obsolete.

j'ai relu le tuto de http://www.siteduzero.com/tuto-3-5272-1-modifier-l-apparence-d-une-infobulle.html mais je ne peux pas inserer <span> dans <usemap ......

j'ai essayer en positionnant plutot la zone lien avec un css, et ca fonctionnne ... sous firefox, mais sous ie6, il me prend bien la zone du lien, quand background-color: #ffffff; mais pas quand je l'enleve pour que ce soit transparent

vu que je voudrai que la zone "lien" soit "invisible", j'essaye de l'enlever, et commme d'hab, avec firefox Ok et avec IE6 ca bug

je pense qu'il me manque une balise a la c**, mais je vois pas laquelle

:::
mon 1er code usemmap simple sans css est au dessus
voila mon 2nd code avec les positions definies a l'avance 
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

<style type="text/css">

#usemap_logo {
    position: relative;
    margin: 0px auto; /* opx valeur a verifier */

}
#usemap_logo a {
width:39px;
height:35px;
background-color: #ffffff;
position:absolute;
text-decoration: none;
z-index: 100; /* il faut que je verifi dans les css deja present si il n'y a pas de valeur z-index sup. a 100 */
}
.bouton_start {
top:62px; /* valeur temporarire */
left:4px; /* pareil temp aussi */
}
.bouton_start span {
   display: none;
}
.bouton_start:hover {
   background: none; /* correction d'un bug IE */
   cursor: default; /* je laisse le curseur par defaut, pour que tout le monde ne sache pas que c'est un lien */
}
.bouton_start:hover span {
   display: inline;
   position: absolute;
   white-space: nowrap;
   top: 30px;
   left: 20px;
   background: white;
   color: #000000;
   padding: 3px;
   border: 1px solid #BEBEBE;
   border-right: 3px solid #BEBEBE;
   border-bottom: 4px solid #BEBEBE;
}
</style> 
</head>

<body>
<div id="usemap_logo"><img src="logocfccar.png">
<a href="#" class="bouton_start"><span> text a afficher </span></a>
</img>
</div>
</body>


Pfffff, je seche la, pourtant j'essaye a chaque fois de ma dépanner tt seul mais la, meme sur les forums, j'ai pas trouver de questions semblables

Merci de m'avoir lu,

j'espere avoir des reponses satisfaisantes
Configuration: Windows XP
Firefox 2.0.0.14


EDIT: 22/05 a 14:51

c' bon j'ai trouvé, 

#usemap_logo {
    position: relative;
    margin: 0px auto; /* opx valeur a verifier */
	background-image:url(logocfccar.png);
	width: 300px;
	height: 300px;
}
#usemap_logo a {
width:39px;
height:35px;

position:absolute;
text-decoration: none;
z-index: 100; /* il faut que je verifi dans les css deja present si il n'y a pas de valeur z-index sup. a 100 */
}


j'ai mis l'image dans le css, et la IE6 fais ce que je veux.

merci de m'avoir lu qd mm
Répondre à BartWadela  Signaler ce message aux modérateurs Aller au dernier message

1


  • Ce message vous semble utile, votez !
  • Signaler ce message aux modérateurs
 BartWadela, le jeudi 22 mai 2008 à 14:54:52
comment on fais pour mettre résolu ??

Ok vu il fallait au moins uune réponse en fait.

bonne journée a tous !!
   
Répondre à BartWadela
Posez votre question Répondre
Logiciels pertinents trouvés dans les téléchargements
Télécharger Power IE6 3.00Power IE6 - Power IE 6 est compatible avec Internet Explorer 7, c'est un logiciel d'origine canadienne, qui vous permet en quelques...Catégorie: Anonymat/Confidentialité
Licence: Freeware/gratuit
Télécharger IETester 0.2.2IETester - Si vous êtes intégrateur web ou simple concepteur web, un grand soucis que vous devez surmonter es la compatibilité de votre...Catégorie: Web
Licence: Freeware/gratuit
Télécharger TortoiseCVS 1.10.9TortoiseCVS - TortoiseCVS est un client CVS libre permettant de gérer les fichiers via CVS directement à partir de l'explorateur Windows. ...Catégorie: CVS
Licence: Open Source
Télécharger DivX codecs 6.8.4DivX codecs - Le codec Divx Community est gratuit pour un usage personnel et permet de lire les fichiers au format DivX ! L'installeur...Catégorie: Codecs
Licence: Freeware/gratuit
Plus de logiciels gratuits sur « css/bug IE6 afficher infobulle au dessus div »