Lien vers une ancre sur image

**achos** · 22/10/2007, 17h56

Bonjour tout le monde;
J'ai une page HTML qui contient une image d'une carte d'une ville et dans une autre page j'ai des liens qui mènent sur des zones sur la carte;
Par exemple lorsque je clique sur le lien "station bus" il me mène sur la page de la carte et précisément dans la zone "station bus" que j'ai définie précédemment sur ma carte par la balise

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<map name="Map" id="Map"><area shape="rect" coords="2,2,420,104" /></map>

.
Mais je ne sais pas comment faire pour que ces liens fonctionnent correctement.

Merci d'avance

Gf6HqmTW · 23/10/2007, 12h17

Je ne suis pas sure que ca fonctionne mais tente de donner un nom à ta shape (par exemple BUS au hasard) et apres dans tes liens tu met http://monsite.fr/mapage.html#BUS

**jeje13009** · 23/10/2007, 23h52

slt,

c'est une possibilité intéressante que propose GujMan...

si ça ne marche pas, il faudrait peut être voir en définissant d'une part les coordonnées du centre de chaque zone (donc un valeur x et une valeur y qu'on peut mettre dans le lien) et calculer à partir de là la position de l'image pour que la zone recherchée soit au centre...

**achos** · 24/10/2007, 12h29

Bonjour;
Merci bien pour vos réponses, j'ai bien testé cette proposition est ca marche bien.
voici le code:
Page lien

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
<a href="cible.html#Map">Lien</a>

Page cible

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
 
<html>
<body>
<p><img src="image.jpg" border="0" usemap="#Map" /></p>
<map name="Map" id="Map"><area shape="rect" coords="565,622,675,696" /></map>
</body>
</html>

J'ai essayé de mettre mon image dans une balise <div> avec barre de défilement horizontale (pour minimiser l'espace occupé par l'image sur la page web) mais le lien n'a pas fonctionné et sans la <div> il fonctionne à merveille.
Si vous avez des remarques ou des modifications qui peuvent m'aider à résoudre ce problème je serai très reconnaissant.

Voici le code pour la version avec la balise <div> :
Page lien

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
<a href="cible.html#Map">Lien</a>

Page cible

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
 
<html>
<body>
<div style="height: 400px; overflow:auto;"><img src="image.jpg" border="0" usemap="#Map" /></div>
<map name="Map" id="Map"><area shape="rect" coords="565,622,675,696" /></map>
</body>
</html>

Et Merci d'avance.

Lien vers une ancre sur image

HTML

Discussions similaires

Partager

Partager