Lien vers une ancre sur image

Version imprimable

22/10/2007, 17h56
achos

Lien vers une ancre sur image

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:

<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
23/10/2007, 12h17
Gf6HqmTW

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
23/10/2007, 23h52
jeje13009

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...

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

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

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:

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

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.
:king: