Forum |  HardWare.fr | News | Articles | PC | S'identifier | S'inscrire | Shop Recherche
2440 connectés 

  FORUM HardWare.fr
  Programmation
  HTML/CSS

  Pb imagesmap en css

 


 Mot :   Pseudo :  
 
Bas de page
Auteur Sujet :

Pb imagesmap en css

n°1483702
moimael
Posté le 29-11-2006 à 13:45:12  profilanswer
 

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
mood
Publicité
Posté le 29-11-2006 à 13:45:12  profilanswer
 

n°1483709
gooopil
pfiew
Posté le 29-11-2006 à 13:53:53  profilanswer
 

Les image maps ne marchent pas sous IE et ne sont pas conformes ????
:/

n°1483714
FlorentG
Posté le 29-11-2006 à 13:55:51  profilanswer
 

Les images maps fonctionnent très bien sous IE et sont parfaitement conformes, t'as juste dû faire quelque chose de pas bien :(

n°1483717
moimael
Posté le 29-11-2006 à 13:57:47  profilanswer
 

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.


Message édité par moimael le 29-11-2006 à 13:58:34
n°1483720
FlorentG
Posté le 29-11-2006 à 14:02:19  profilanswer
 

T'as juste à enlever l'attribut name qui n'existe plus, et à mettre #map1 dans le usemap [:petrus dei]

n°1483724
moimael
Posté le 29-11-2006 à 14:04:39  profilanswer
 

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.

n°1483730
gooopil
pfiew
Posté le 29-11-2006 à 14:09:13  profilanswer
 

Et puis c'est <area .... /> et pas <area ...></area>

n°1483739
moimael
Posté le 29-11-2006 à 14:18:16  profilanswer
 

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.


Aller à :
Ajouter une réponse
  FORUM HardWare.fr
  Programmation
  HTML/CSS

  Pb imagesmap en css

 

Sujets relatifs
[Fixed!][HTML] (Form) 'action' avec variables en GET ? (Pb) 
Plus de sujets relatifs à : Pb imagesmap en css


Copyright © 1997-2025 Groupe LDLC (Signaler un contenu illicite / Données personnelles)