Connexion | Inscription | FAQ
Anonymous

Problème avec le HOVER

+ Publier une réponse

2 messages Page 1 sur 1


Problème avec le HOVER

par Dawlon » Sam Déc 01, 2012 12:43 am

Bonjour,

Voila j'ai un petit souci... Je fais un HOVER sur un usemap avec plusieurs zones ... Jusque là, tout va bien ! Sauf que quand je vais sur une autre zone, j'ai les images précédente qui apparaisse. Je ne sais pas si je me fait bien comprendre :/

Voici un lien, qui, je pense, sera plus explicite ^^ essaisitecdz.perso.sfr.fr

De plus, voici mon code CSS :

Code: Tout sélectionner
body {
   background-color: #fff;}
   


#belier:hover, #belier:active{
   position:absolute;
   width:46px;
   height:77px;
   margin-top:-492px;
   margin-left:223px;
    background:url(flamme-belier.png) no-repeat;
}

#taureau:hover{
   position:absolute;
   width:49px;
   height:72px;
   margin-top:30px;
   margin-left:95px;
    background:url(flamme-taureau.png) no-repeat;
   }
   
#gemeaux:hover{
   position:absolute;
   width:47px;
   height:72px;
   margin-top:72px;
   margin-left:72px;
    background:url(flamme-gemeaux.png) no-repeat;
   }   

#cancer:hover{
   position:absolute;
   width:45px;
   height:79px;
   margin-top:81px;
   margin-left:23px;
    background:url(flamme-cancer.png) no-repeat;
   }   
   
#lyon:hover{
   position:absolute;
   width:54px;
   height:72px;
   margin-top:105px;
   margin-left:-32px;
    background:url(flamme-lyon.png) no-repeat;
   }   


Et voici le code de ma page
Code: Tout sélectionner
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Saint Seiya Ultimate</title>
<link href="style.css" rel="stylesheet" type="text/css" />
</head>

<body>
<script type="text/javascript">
         function MM_openBrWindow(theURL,winName,features) { //v2.0
         window.open(theURL,winName,features);
      }
</script>
      
      
<img src="horloge.png" width="499" height="500" border="0" usemap="#map"  />

<!--BELIER-->
<map name="map" id="belier">
  <area shape="poly" coords="219,120,282,121,274,155,228,154" onclick="MM_openBrWindow('belier-signe.html','','width=1000,height=300')" />

<!--TAUREAU--> 
<id="taureau">
<area shape="poly" coords="280,156,320,181,344,154,289,123" href="#" />


<!--GEMEAUX-->
<id="gemeaux">
<area shape="poly" coords="323,182,344,224,378,215,347,158" href="#" />

<!--CANCER-->
<id="cancer">
<area shape="poly" coords="380,219,379,281,345,273,347,229" href="#" />

<!--LYON-->
<id="lyon">
<area shape="poly" coords="344,280,377,289,347,341,321,317" href="#" />
</map> 
</body>
</html>


J'espère que vous allez pouvoir m'aider car ça fait plusieurs jours que je galère et que je n'y arrive pas !
Avatar de l’utilisateur

Dawlon

  • Messages: 1
  • Inscrit le: Sam Déc 01, 2012 12:38 am

Re: Problème avec le HOVER

par XainPro » Sam Déc 08, 2012 6:59 am

Malheureusement, je n'ai aucune expérience avec carte-image, donc je suis incapable de vous aider
mais je dois dire que j'ai vérifié votre site Web et vous avez écrit un meilleur code très bonne chance.
Avatar de l’utilisateur

XainPro

  • Messages: 3933
  • Inscrit le: Ven Fév 17, 2012 8:10 pm


+ Publier une réponse

Page 1 sur 1