Bonjour =)
Alors, j'ai un souci (probablement de débutante, mais hey, c'est ce que je suis en JS ^^).
Pour les besoins de mon site,j'ai besoin de me servir d'une fonction swapPic au survol sur deux map. J'ai donc utilisé deux balises script l'une derrière l'autre, et il semble que la première ne soit pas prise en compte : quand on passe la souris sur la première map, ça change les images sur la seconde...
Voici mon code (enfin simplement les éléments incriminés) :
Donc, grande question : qu'ai-je mal fait? Est-ce une simple erreur de synthaxe, est-ce que je suis passée à côté d'un truc super essentiel? Je suis certaine d'avoir fait une boulette débile mais je ne trouve pas.
Et précisons que tant qu'il n'y avait qu'une seule map (et donc un seul script), tout fonctionnait très bien. Et j'ai essayé d'échanger les scripts de place, c'est bien toujours le premier qui est zappé (donc individuellement, les deux scripts fonctionnent).
Merci beaucoup de votre attention =)
Modifié par Pixellyn (25 May 2016 - 12:17)
Alors, j'ai un souci (probablement de débutante, mais hey, c'est ce que je suis en JS ^^).
Pour les besoins de mon site,j'ai besoin de me servir d'une fonction swapPic au survol sur deux map. J'ai donc utilisé deux balises script l'une derrière l'autre, et il semble que la première ne soit pas prise en compte : quand on passe la souris sur la première map, ça change les images sur la seconde...
Voici mon code (enfin simplement les éléments incriminés) :
<html>
<head>
<script type="text/javascript">
function swapPic(zone,nr){
var pic=document.getElementById('hovered')
pic.src='images/'+nr+'.png'
zone.onmouseout=function(){pic.src='images/transp.png'}
}
</script>
<script type="text/javascript">
function swapPic(zone,nr){
var pic=document.getElementById('hovered2')
pic.src='images/'+nr+'.png'
zone.onmouseout=function(){pic.src='images/transp_portables.png'}
}
</script>
</head>
<body>
<div id="menu_polygone">
<img id="hovered" src="images/transp.png" usemap="#Map" width="500" height="473" />
<map name="Map">
<area href="#presentation" onmouseover="swapPic(this,2)" shape="polygon" coords="303,155,244,5,1,178">
<area href="#creation" onmouseover="swapPic(this,3)" shape="polygon" coords="159,176,1,187,92,468">
<area href="#sites" onmouseover="swapPic(this,4)" shape="polygon" coords="140,318,101,472,400,472">
<area href="#portfolio" onmouseover="swapPic(this,5)" shape="polygon" coords="266,379,406,465,499,183">
<area href="#contact" onmouseover="swapPic(this,6)" shape="polygon" coords="369,281,492,176,252,1">
</map>
</div>
<div id="menu_polygone_portables">
<img id="hovered2" src="images/transp_portables.png" usemap="#Map2" width="335" height="317" />
<map name="Map2">
<area href="#presentation" onmouseover="swapPic(this,2)" shape="polygon" coords="203,104,163,3,1,119">
<area href="#creation" onmouseover="swapPic(this,3)" shape="polygon" coords="108,118,1,125,62,313">
<area href="#sites" onmouseover="swapPic(this,4)" shape="polygon" coords="93,213,68,316,268,316">
<area href="#portfolio" onmouseover="swapPic(this,5)" shape="polygon" coords="178,254,272,311,334,122">
<area href="#contact" onmouseover="swapPic(this,6)" shape="polygon" coords="247,187,330,118,168,1">
</map>
</div>
</body>
</html>
Donc, grande question : qu'ai-je mal fait? Est-ce une simple erreur de synthaxe, est-ce que je suis passée à côté d'un truc super essentiel? Je suis certaine d'avoir fait une boulette débile mais je ne trouve pas.
Et précisons que tant qu'il n'y avait qu'une seule map (et donc un seul script), tout fonctionnait très bien. Et j'ai essayé d'échanger les scripts de place, c'est bien toujours le premier qui est zappé (donc individuellement, les deux scripts fonctionnent).
Merci beaucoup de votre attention =)
Modifié par Pixellyn (25 May 2016 - 12:17)
