FORUM MP | Javascript : OnMouseOver dans une map

COMMUNAUTE MP

Identifiez vous ...

DOMAINE MP

Bavardages

Langages Généraux

Langages Web

Langages DotNet

Autres langages

Dev. Jeux Video

Sécurité

Sys. Exploitation

Graphismes

Logiciels

Réseaux

Bases de données

Méthodologies

Emplois High-tech

Aide juridique

Articles juridiques

FORUM

CHAT MP IRC

Votre pseudo ...

Srv: irc.moteurprog.com

Chan: #MoteurProg

PARTICIPER

Plus de 3500 emplois.

Visiteur MP

OnMouseOver dans une map
	Forum : JAVASCRIPT Sous Catégorie : Aucune Type du sujet : Sujet Normale FAQ : FAQ JAVASCRIPT
		SUIVI PAR MAIL INACTIF
		SUJET NON RESOLU
		SUJET ACTIF
		N'APPARTIENT PAS A LA FAQ

PAGES : [1] [2]

FORUM JAVASCRIPT
	Page précedente	Page suivante

superska
Nouveau membre

Inscrit : 04/09/2007
Messages : 10

#142261 Posté le 04/09/07 à 15:49

Le code de la page pour que cela soit plus clair :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript">
image1 = new Image;
image1.src = "Annexe cuisse1.jpg";
image2 = new Image;
image2.src = "Untitled-2.html";
image3 = new Image;
image3.src = "Untitled-3.htm";
</script>

<title>Untitled Document</title>
</head>

<body>
<img src="Annexe cuisse1.jpg" width="960" height="720" border="0" usemap="#Map" />
<map name="map" id="Map">

<area shape="poly"
coords="415,214,471,188,516,187,537,202,550,218,562,242,552,272,500,271,462,271,439,275,406,234"
href="#"
onmouseover="self.location.href=image2.src" />

<area shape="poly"
coords="575,245,587,225,609,213,631,205,635,210,635,217,604,239,589,249,578,256,571,251"
href="#"
onmouseover="self.location.href.image3.src"/>

</map>
</body>
</html>

Untitled-2 et untitled-3 (dont les noms seront plus evocateurs quand tout sera au point) sont les pages où se chargent les nouvelle simages images suite au survol respetivement de la zone jaune et de la zone verte

HAUT DE PAGE

Publicité

Inscrit : X
Messages : X

#Aucun

HAUT DE PAGE

bul
Membre du club

Inscrit : 26/01/2004
Messages : 965

#142265 Posté le 04/09/07 à 16:07

Ce que tu montres sert pour le preload d'images
effectivement. Alors pour une page html ???
Si tu veux mon avis : sucre tout ça, et
repart le plus simplement possible.
( tu ajouteras,affineras quand ça marchera...
s'il savère nécessaire d'affiner ! )

ce n'est que mon avis, mais comme c'est le mien
je le respecte, je dirais même que je le partage
avec tous ceux qui pensent comme moi, quand
aux autres.. ma foi...

@+
__________________________
~ mon site ~ m'écrire ~
Laissez une adresse Mail où vous écrire, en évitant les spams
¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯

HAUT DE PAGE

bul
Membre du club

Inscrit : 26/01/2004
Messages : 965

#142266 Posté le 04/09/07 à 16:16

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Untitled Document</title> </head> <body> <img id="img1" src="Annexe cuisse1.jpg" width="960" height="720" border="0" usemap="#Map" /> <map name="map" id="Map"> <area shape="poly" coords="415,214,471,188,516,187,537,202,550,218,562,242,552,272,500,271,462,271,439,275,406,234" href="#" onmouseover=" document.getElementById('img1').src='la page voulue'; this.coords='nouvelles coordonnées';" /> <area shape="poly" coords="575,245,587,225,609,213,631,205,635,210,635,217,604,239,589,249,578,256,571,251" href="#" onmouseover="document.getElementById('img1').src='la page voulue'; this.coords='nouvelles coordonnées';"/> </map> </body> </html>

bien entendu, dans un 2ème temps tu pourras
"automatiser"/"généraliser" ce qui se passe dans
les onmouseover ( appel fonction avec paramètres )

ou, donc, si tu y tiens,
onmouseover="self.location.href='la page html voulue';"
ces pages contenant l'image, l'area, les coords,
le javascript.... pour traiter le onmouseover et le reste

@+
__________________________
~ mon site ~ m'écrire ~
Laissez une adresse Mail où vous écrire, en évitant les spams
¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯

HAUT DE PAGE

superska
Nouveau membre

Inscrit : 04/09/2007
Messages : 10

#143207 Posté le 25/09/07 à 14:26

Bonjour,
merci à tous pour vos très bons conseils.
J'ai réécrit un code propre et depuis tout va pour le mieux.
Seulement un petit truc continue à m'embeter.
Il s'agit du trait dessinant le polygone de ma zone réactive (ou area) (dessiné avec l'outil poly dans dreamweaver).
Il apparait juste apèrs le clic, un court instant mais suffit à rendre la chose inesthétique.
Je ne trouve pas de parametre du style "border".
Avez vous une idée?
Je joins un image pour illustrer mes propos (le trait disgracieux est désigné par la flèche blanche)
Je vous remercie

HAUT DE PAGE

superska
Nouveau membre

Inscrit : 04/09/2007
Messages : 10

#143208 Posté le 25/09/07 à 14:28

L'image d'illustration:

Merci

HAUT DE PAGE

bul
Membre du club

Inscrit : 26/01/2004
Messages : 965

#143210 Posté le 25/09/07 à 14:40

>>J'ai réécrit un code propre et depuis tout va pour le mieux.
nickel.

>>trait dessinant le polygone de ma zone réactive
pas sûr qu'on puisse agir à ce niveau là ?
il faudrait ( comme ça la balle est dans ton camp ! ;o)) )
faire coïncider ce trait avec les limites de la zone.,
pile poil, ce serait plus mieux...

Tout ce qui est dans le texte de ce message est entièrement composés de
lettres, de chiffres, de caractères de ponctuation, de signes typographiques...
libres de droit.

__________________________
~ mon site ~ m'écrire ~
Laissez une adresse Mail où vous écrire, en évitant les spams
¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯

HAUT DE PAGE

superska
Nouveau membre

Inscrit : 04/09/2007
Messages : 10

#143212 Posté le 25/09/07 à 14:48

merci pour ta réponse.
Faire coincider ok, mais ca va être long (200 pages)!!
Ce que je ne comprend pas, c'est que desormais ca ne le fait plus (j'ai vidé le cache mais ca ne change rien)...
A n'y rien comprendre.
Je reconnais que les zones seront mieux dessinées en version finale (je suis encore en test) donc ca sera moins pire

Si vous avez des idées je suis preneur

merci à tous.

HAUT DE PAGE


	Page précédente	Page suivante
FORUM JAVASCRIPT

PAGES : [1] [2]

.: Site Web développé par Julien Pichot et l'équipe MPWG avec www.evolvia-web.com :.