Bonjour,
Je suis débutant en javascript, merci d'avance pour votre indulgence.
J'ai une carte sur laquelle je fait apparaitre une image en fonction des régions sur lesquelles on passe son curseur. Le script fonctionne correctement mais l'image reste en bas à droite peu importe les paramètres que je donne.
Voir site : www.latreve.be
J'aimerais que l'image soit à côté de la région.
Voici le code :
page html
Code html : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19 <link href="style.css" rel="stylesheet" type="text/css" /> <link href="http://www.latreve.be/wp-includes/css/style2.css" rel="stylesheet" type="text/css" /> <script type="text/javascript" src="http://www.latreve.be/wp-content/themes/latreve3/ajax.js"></script> <script type="text/javascript" src="http://www.latreve.be/wp-content/themes/latreve3/tooltip.js"></script> <div> <center><img alt="" src="/wp-admin/images/carte petit.png" usemap="#map" width="300" height="421" border="0"></center> <map name="map"> <area onmouseover="showtrail(300,195,'http://www.latreve.be/wp-content/themes/latreve3/images/vielsalm.jpg')" onmouseout="hidetrail()" coords="210,74,203,90,229,94,278,70,280,84,294,78,290,44,251,30,243,38,246,62,257,63,251,69" shape="poly" href="http://www.letreve.be" /> <area onmouseover="showtrail(310,195,'http://www.latreve.be/wp-content/themes/latreve3/images/Bastogne2.jpg')" onmouseout="hidetrail()" coords="208,162,206,184,195,188,208,210,213,235,217,237,228,223,247,196,252,165,238,162,234,150,225,140,224,141" shape="poly" href="http://www.latreve.be/bastogne" /> <area coords="188,417,191,405,198,388,190,365,177,360,178,368,165,366,158,396,164,417" shape="poly" href="http://www.latreve.be/virton" /> <area coords="214,375,221,402,230,403,236,395,245,400,260,391,265,379,252,381,250,384,219,370" shape="poly" href="http://www.latreve.be/athus" /> <area coords="211,351,205,333,210,328,221,331,236,318,239,325,259,313,263,324,261,335,270,346,265,364,244,348,225,367,226,367" shape="poly" href="http://www.latreve.be/arlon" /> </map></img> </div>
code Tooltip.js :
Voila, je ne sais pas si j'ai été clair.
Code : Sélectionner tout - Visualiser dans une fenêtre à part
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
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81 var w=1 var h=1 if (document.getElementById || document.all) document.write('<div id="trailimageid" style="position:absolute";visibility:hidden;left:0px;top:0px;width:1px;height:1px;border:1px solid #888888;background:#01D4B8;"><img id="ttimg" src="img/s.gif" /></div>') function gettrailobj() { if (document.getElementById) return document.getElementById("trailimageid").style else if (document.all) return document.all.trailimagid.style } function truebody() { return (!window.opera && document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body } function hidetrail() { document.onmousemove="" document.getElementById('ttimg').src='/img/s.gif' gettrailobj().visibility="hidden" gettrailobj().left=0 gettrailobj().top=0 } function showtrail(width,height,file) { if(navigator.userAgent.toLowerCase().indexOf('opera') == -1) { w=width h=height // followmouse() document.getElementById('ttimg').src=file document.onmousemove=followmouse gettrailobj().visibility="visible" gettrailobj().width=w+"px" gettrailobj().height=h+"px" } } function followmouse(e) { if(navigator.userAgent.toLowerCase().indexOf('opera') == -1) { var xcoord=20 var ycoord=20 if (typeof e != "undefined") { xcoord+=e.pageX ycoord+=e.pageY } else if (typeof window.event !="undefined") { xcoord+=truebody().scrollLeft+event.clientX ycoord+=truebody().scrollTop+event.clientY } var docwidth=document.all? truebody().scrollLeft+truebody().clientWidth : pageXOffset+window.innerWidth-15 var docheight=document.all? Math.max(truebody().scrollHeight, truebody().clientHeight) : Math.max(document.body.offsetHeight, window.innerHeight) if (xcoord+w+3>docwidth) xcoord=xcoord-w-(20*2) if (ycoord-truebody().scrollTop+h>truebody().clientHeight) ycoord=ycoord-h-20; gettrailobj().left=xcoord+"px" gettrailobj().top=ycoord+"px" } }
Si quelqu'un peut m'aider a trouver la ou les erreurs, un grand merci d'avance.
Partager