BALISE MAP souci avec image-lien

Version imprimable

Bonjour à tous,

Je vais vous expliquer ce que je souhaite faire et le souci que je rencontre. Mon code suivra.

J'ai une IMAGE 1 que je veux faire changer quand la souris est dessus IMAGE 2.

Puis je voudrais qu'une fois que IMAGE 2 est là, je puisse cliquer pour aller à la page suivante.

Et je voudrais faire ça sur 2 images différentes dans la même page. Les onmouseover marche SAUF que IMAGEbis 2 se charge aux coordonnées de IMAGE 2 !!!

Et les liens ne marchent pas ...

Voici le code :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
 
<!-- clic gauche -->
<div id="imagegauche" >
		<img src="images/00-acceuil_zone_cliquable_left_off.jpg" 
        name="image" width="202" height="130" border="0" 
        usemap="#Map" 
        id="LEFT" 
        onmouseover="(image.src='images/00-acceuil_zone_cliquable_left.jpg', 319, 359);" 
        onmouseout="(image.src='images/00-acceuil_zone_cliquable_left_off.jpg', 319, 359);"/>  
 
            <map name="Map" id="Map">
    			<area shape="rect" coords="319,359,521,498" 
                href="01.html" 
                alt="left"></a>
			</map>
</div>
 
<!-- clic droit -->
<div id="imagedroite">
		<img src="images/00-acceuil_zone_cliquable_right_off.jpg" 
        name="image2" width="203" height="130" border="0" 
        usemap="#Map2" 
        id="RIGHT" 
        onmouseover="(image.src='images/00-acceuil_zone_cliquable_right.jpg', 317, 669);" 
        onmouseout="(image.src='images/00-acceuil_zone_cliquable_right_off.jpg', 317, 669);"/>
 
  			<map name="Map2" id="Map2">
   				<area shape="rect" coords="317,669,520,799"
                href="02.html" 
                alt="right"></a>
 			</map>
</div>

Merci d'avance de votre aide !

Salut,

Cela ne viendrait pas du nom de ton image?

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<div id="imagedroite">
<img src="images/00-acceuil_zone_cliquable_right_off.jpg" 
        name="image2" width="203" height="130" border="0" 
        usemap="#Map2" 
        id="RIGHT" 
        onmouseover="(image.src='images/00-acceuil_zone_cliquable_right.jpg', 317, 669);" 
        onmouseout="(image.src='images/00-acceuil_zone_cliquable_right_off.jpg', 317, 669);"/>
        
  			<map name="Map2" id="Map2">
   				<area shape="rect" coords="317,669,520,799"
                href="02.html" 
                alt="right"></a>
 			</map>
</div>

13/04/2010, 18h33
darkart

Bien vu!

Vraiment trop nul ...

Mais les liens vers 01.html et 02.html ne marchent toujours pas !

Et la je ne vois rien non plus !
14/04/2010, 20h10
badajoz

Salut,

Ton mappage doit être avant l'image et pourquoi ferme tu ton area avec un </a>.

Est-ce que ton chemin vers ton fichier 1.html ou 2.html est correct ?

solution :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<div id="imagegauche" >

  <map name="Map" id="Map">
   	<area shape="rect" coords="319,359,521,498" 
        href="01.html" 
        alt="left"/>
	</map>
    <a href="01.html"><img src="images/00-acceuil_zone_cliquable_left_off.jpg" 
        name="image" width="202" height="130" border="0" 
        usemap="#Map" 
        id="image" 
        onmouseover="(image.src='images/00-acceuil_zone_cliquable_left.jpg', 319, 359);" 
        onmouseout="(image.src='images/00-acceuil_zone_cliquable_left_off.jpg', 319, 359);"/></a>  
</div>