11550 sujets

JavaScript, DOM et API Web HTML5

Bonjour à tous,

Je vous contacte car après pas mal de recherche, je coince un peu sur mon script.
Voici ci-dessous mon code.
Au départ, j'ai une carte de france blanche. j'ai mappé la corse, l'objectif est qu'au survol de la souris, on ai une image de la carte avec la partie corse rempli d'une couleur.
Jusqua la tout va. Le problème est que mon image hover est une image avec toutes les régions et pas seulement la carte de corse, je dois donc la caler correctement avec du CSS. Le problème est que je n'arrive pas à mettre du css avec du javascript onmouseover. Peut être rajouter une class ,je sais pas trop . Du style : onMouseOver = "iljswitch(1); this.value.class=test" ou quelque chose d'autres

Merci bien pour votre aide

<body>
<div id="france-carte">
<img  src="images/carte.png" ID = "switch1" alt="carte de france" width="190" height="173" border="0" usemap="#carte-france" />

  <map name="carte-france" id="carte-france">
    
    <area   shape="poly" coords="165,158,165,162,168,169,171,174,175,167,177,154,174,144,166,151,164,155"  
                  href="#"
                  onMouseOut = "iljswitch(0)"
                  onMouseOver = "iljswitch(1);"
				  title="Corse" 
				  alt="Corse" 
                   
				  style="cursor: pointer" />
                  </map>
</div>

<SCRIPT LANGUAGE="JavaScript"
TYPE="text/javascript">
<!--
if(document.images)
{
bild = new Array()
bild[0]= new Image()
bild[1]= new Image()
bild[0].src = "images/carte.png" //1
bild[1].src = "images/carte.jpg" //2
}

function iljswitch(nummer)
{
if(document.images && document.getElementById)
{
document.getElementById('switch1').src=bild[nummer].src
}
}
//-->
</SCRIPT>

</body>
Ben finalement, j'ai créer une image pour chaque région. J'espère que ca va pas être trop long dans le chargement de la page d'accueil.
merci quand même