OVH Cloud OVH Cloud

usemap d'une image

4 réponses
Avatar
LEMAIRE Mathieu
comment on l'atteint en javascript ?

Voila ce que j'ai essayé...et qui marche pas

<img src='contenu.jpg' alt='' name='contenu' usemap='#map1'/>

<map name="map1"><area shape="rect" coords="0,0,20,20" href="#" /></map>
<map name="map2"><area shape="rect" coords="200,20,40,40" href="#" />
</map>

<a href='#' onclick="document['contenu'].usemap='map2';" >map2</a>
<a href='#' onclick="document['contenu'].usemap='map1';" >map1</a>

merci

--
Mathieu LEMAIRE

4 réponses

Avatar
BMR
comment on l'atteint en javascript ?

Voila ce que j'ai essayé...et qui marche pas

<img src='contenu.jpg' alt='' name='contenu' usemap='#map1'/>

<map name="map1"><area shape="rect" coords="0,0,20,20" href="#" /></map>
<map name="map2"><area shape="rect" coords="200,20,40,40" href="#" />
</map>

<a href='#' onclick="document['contenu'].usemap='map2';" >map2</a>
<a href='#' onclick="document['contenu'].usemap='map1';" >map1</a>

merci



Par similitude, en mettant un "#" : document['contenu'].usemap='#map2' ?

Sinon, avec des <div> positionnés de façon absolue, ce serait plus
simple. Ca dépend de ce que tu veux faire... Première chose à indiquer
lorsqu'on poste un code.

BMR

Avatar
Thibault TAILLANDIER
comment on l'atteint en javascript ?

Voila ce que j'ai essayé...et qui marche pas

<img src='contenu.jpg' alt='' name='contenu' usemap='#map1'/>

<map name="map1"><area shape="rect" coords="0,0,20,20" href="#" /></map>
<map name="map2"><area shape="rect" coords="200,20,40,40" href="#" />
</map>

<a href='#' onclick="document['contenu'].usemap='map2';" >map2</a>
<a href='#' onclick="document['contenu'].usemap='map1';" >map1</a>

merci



Salut,

Il faut utiliser les id, et non les names pour appeller les objets d'une
page. "name" marche avec IE, mais ce n'est pas standard pour appeller un
objet.
Voici la technique conseillée :
<img src="contenu.jpg" alt="mettre qqch" name="contenu" id="contenu"
usemap="#map1" />
<a href="#"
onclick="document.getElementById('contenu').useMap.value='#map2';">map2</a>

sinon, avec ta syntaxe ou pour un vieux navigateur, ca aurait été :
document.contenu.usemap.value='#map2'
ou document.all['contenu'].usemap.value='#map2'

Bye
--
Thibault

Avatar
LEMAIRE Mathieu
Sinon, avec des <div> positionnés de façon absolue, ce serait plus
simple. Ca dépend de ce que tu veux faire... Première chose à indiquer
lorsqu'on poste un code.


désolé d'avoir été un peu trop concis... en fait j'ai une mappemonde
(mon image) avec dessus un trajet parsemé de 'stops'. Je veux qu'un
tooltip apparaisse qd l'utilisateur passe sa souris au dessus..

Positionner les liens en absolu me parait un peu laborieux dans ce cas :
les coordonnées peuvent facilement être données en relatif.. d'où le
usemap...

merci pour le code ca marche très bien :
document.images['contenu'].useMap = '#map2';

++

--
Mathieu LEMAIRE

Avatar
LEMAIRE Mathieu
Il faut utiliser les id, et non les names pour appeller les objets d'une
page. "name" marche avec IE, mais ce n'est pas standard pour appeller un
objet.
Quand c'est une image qui a l'attribut name ca marche très bien non ? tu

connais des navigateurs qui doivent passer par l'id ?
J'ai appelé mon image comme ça : document.images['contenu'] et tout
semble bien se passer sous ie gecko et opera...

Voici la technique conseillée :
<img src="contenu.jpg" alt="mettre qqch" name="contenu" id="contenu"
usemap="#map1" />
<a href="#"
onclick="document.getElementById('contenu').useMap.value='#map2';">map2</a>


merci !


--
LEMAIRE Mathieu