Pb imagesmap en css - HTML/CSS - Programmation
Marsh Posté le 29-11-2006 à 13:53:53
Les image maps ne marchent pas sous IE et ne sont pas conformes ????
Marsh Posté le 29-11-2006 à 13:55:51
Les images maps fonctionnent très bien sous IE et sont parfaitement conformes, t'as juste dû faire quelque chose de pas bien
Marsh Posté le 29-11-2006 à 13:57:47
Ben voila mon ancien code pour les images map :
<div id="menu_en_tete">
<img src="images/ssbanniere.png" usemap="map1" alt="barre de navigation"/>
<map name="map1" id="map1">
<area shape="rect" coords="0,0,70,24" href="http://virtualchip.goldzoneweb.info/index.php" title="news" alt="barre de navigation"></area>
<area shape="rect" coords="73,0,140,25" href="http://virtualchip.goldzoneweb.info/archives.php" title=""alt="barre de navigation"></area>
<area shape="rect" coords="141,0,209,23" href="http://virtualchip.goldzoneweb.info/Forum/index.php" title=""alt="barre de navigation"></area>
<area shape="rect" coords="208,0,276,21" href="http://virtualchip.goldzoneweb.info/article.php" title=""alt="barre de navigation"></area>
<area shape="rect" coords="276,0,355,22" href="http://virtualchip.goldzoneweb.info/jeux_video.php" title=""alt="barre de navigation"></area>
<area shape="rect" coords="355,1,461,25" href="http://virtualchip.goldzoneweb.info/pafiledb/index.php" title=""alt="barre de navigation"></area>
</map>
</div>
et une page ou elles sont présente :
http://virtualchip.goldzoneweb.info/archives.php
Ca ne fonctionne ni sous ie7 ni sous opera chez moi et ca me produit une erreur a la validation.
Marsh Posté le 29-11-2006 à 14:02:19
T'as juste à enlever l'attribut name qui n'existe plus, et à mettre #map1 dans le usemap
Marsh Posté le 29-11-2006 à 14:04:39
si j'enlève l'attribut name ca marche plus du tout et si je rajoute le # j'ai droit a une erreur en plus dans le validateur.
Marsh Posté le 29-11-2006 à 14:18:16
ca change rien ca marche pas mieux....
Je crois avoir trouvé pour mon probleme en css
il faut mettre #ssbanniere en position relative et chacun des liens en position absolue, ca a l'air de marcher.
Merci pour votre aide.
Marsh Posté le 29-11-2006 à 13:45:12
Après avoir supprimé mes images map classiques car elles ne fonctionnent que sous firefox et ne respectaient pas les standard w3c, j'ai essayé de faire ces images map en css en suivant plusieurs tuto.
Seulement les lien ne se positionnent pas bien dans les résolution supérieure a 1024x768.
En 800x600 les images map sont bien placées et c'est a peu près bien en 1024x768, par contre au dessus particulièrement en 1600x1200 elle sont complètement décalées.
J'ai essayé d'autre méthodes de positionnement, sans succès.
J'aurais vraiment besoin de votre aide, merci.
(http://virtualchip.goldzoneweb.info c'est la barre de navigation qui pose problème, pour l'instant j'ai remplacé les imagesmap que sur la page d'accueil, sur les autres ce sont les anciennes image map)
Voila le code html :
<div id="menu_en_tete">
<div id="ssbanniere">
<a href="index.php"id="zone1"><i>description du lien</i></a>
<a href="archives.php"id="zone2"><i>description du lien</i></a>
<a href="Forum/index.php"id="zone3"><i>description du lien</i></a>
<a href="article.php" id="zone4"><i>description du lien</i></a>
<a href="jeux_video.php" id="zone5" ><i>description du lien</i></a>
<a href="pafiledb/index.php" id="zone6" ><i>description du lien </i></a>
</div></div>
et le css:
#menu_en_tete
{
width: 1000px;
margin-bottom: 10px;
height: 24px;
background-image: url(images/ssbanniere.png);
}
#ssbanniere a
{
position: absolute;
width: 1000px;
text-decoration: none;
}
#ssbanniere a i { visibility: hidden; }
a#zone1
{ /* zone cliquable */
width : 55px;
}
a#zone2
{ /* zone cliquable */
width : 75px;
left: 55px;
height: 24px;
}
a#zone3
{ /* zone cliquable */
width : 65px;
height: 24px;
left: 130px;
}
a#zone4
{ /* zone cliquable */
width : 70px;
left: 195px;
}
a#zone5
{ /* zone cliquable */
width : 75px;
left: 265px;
}
a#zone6
{ /* zone cliquable */
width : 108px;
left: 340px;
}
Message édité par moimael le 29-11-2006 à 13:46:24