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
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
| <head>
<meta content="text/html; charset=UTF-8" http-equiv="content-type">
<title>Test</title>
<style type="text/css">
<!--
td,th {font-size:12px; background:#ffe;
border:1px solid black; margin:0px; padding2px;}
td.mid {background:#faf5d7; border:0px;}
/* style pour les bulles. Il faudra rajouter width et height */
.sbulle {position:absolute; visibility:hidden; text-align:left;}
-->
</style>
<!-- ================== script de bulle d aide ================== -->
<SCRIPT TYPE="text/java_script" >
<!--
/* Script basé sur le script "z'experts" : http://perso.wanadoo.fr/coin.des.experts/
délivré sans aucune garanti.
Diffusion libre, mais merci de conserver cette signature :-) */
/* Attention au doctype : si vous en mettez un (c'est quand meme mieux) et
si voulez que ca fonctionne avec IE6 il faut un HTLM 4 transitional **SANS URL**
(cf ci-dessus), c.a.d. IE6 doit rester dans son mode "microsoft".
Toujours à cause des bugs de IE6, n'essayez pas de permuter les
tests sur document.all et sur document.getElementById */
/* Les bulles doivent avoir été préparées dans autant de calques séparés
en position:absolute (sans qu'il soit nécessaire de préciser de top ou
left) que l'on rendra invisible (visibility:hidden). Il est important
d'avoir fixe la largeur et la hauteur de ces calques-bulles EN PIXELS. */
/* La fonction bullepop() qui ouvre la bulle d'aide doit être appelée
avec 4 arguments :
- le premier est l'identificateur (ID) du calque à faire apparaitre.
- les 2 suivants sont les coordonnées du coin haut-gauche du calque.
- LE DERNIER EST OBLIGATOIREMENT "event" (sans les guillemets)
c.à.d. un mot clé dujava_script.
*/
var bulleStyle=null;
var clic=0;
if (!document.layers && !document.all && !document.getElementById)
event="chut"; //pour apaiser NN3 et autres antiquites
function bullepop(idd,coord_x,coord_y,evt){
var element=null;
var bulleWidth=200; // largeur par défaut
var hauteur=50; // hauteur par défaut
bulleStyle=null;
if (document.layers) { // Pour les versions de Netscape >4 et <6
bulleStyle=document.layers[idd];
} else if (document.all) { // Pour les versions d'IE >4 et <5
element=document.all[idd];
} else if (document.getElementById) { // Pour les versions d'IE >5 et les versions de Netscape =>6
element=document.getElementById(idd);
}
if(element) bulleStyle=element.style;
if(bulleStyle) {
/* tests incongrus à cause d'Opera5 */
if(bulleStyle.width) bulleWidth = parseFloat(bulleStyle.width);
if(bulleStyle.height) hauteur = parseFloat(bulleStyle.height);
if(typeof(bulleStyle.left)=='string') {
bulleStyle.left=coord_x+'px'; bulleStyle.top=coord_y+'px';
} else {
bulleStyle.left=coord_x; bulleStyle.top=coord_y; }
bulleStyle.visibility="visible";
bulleStyle.zIndex="99";
}
}
function couic(){
if(bulleStyle) bulleStyle.visibility="hidden";
}
function bulleclic(idd,coord_x,coord_y,evt){
if(clic==0) {
bulleStyle.visibility="hidden";
clic=1;
} else {
bulleStyle.visibility="visible";
clic=0;
}
}
//-->
</SCRIPT>
<!-- ================== fin du script de bulle d'aide ============== -->
</head>
<body>
<div class="sbulle" id="catamaran_strategie" style="width:150px; height:60px;">
<IMG SRC="img/catamaran_strategie_ON.png" ALT="image" ALIGN="LEFT" HSPACE="4">
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<p style="font-style:italic; background:#f00;">
Cette bulle doit s'ouvrir ici
</p>
</div>
<div class="sbulle" id="catamaran_portefeuille" style="width:150px; height:60px;">
<IMG SRC="img/catamaran_portefeuille_ON.png" ALT="image" ALIGN="LEFT" HSPACE="4">
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<p style="font-style:italic; background:#f00;">
Cette bulle doit s'ouvrir ici
</p>
</div>
<div class="sbulle" id="catamaran_accompagnement" style="width:150px; height:60px;">
<IMG SRC="img/catamaran_accompagnement_ON.png" ALT="image" ALIGN="LEFT" HSPACE="4">
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<p style="font-style:italic; background:#f00;">
Cette bulle doit s'ouvrir ici
</p>
</div>
<div class="sbulle" id="catamaran_developpement" style="width:150px; height:60px;">
<IMG SRC="img/catamaran_developpement_ON.png" ALT="image" ALIGN="LEFT" HSPACE="4">
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<p style="font-style:italic; background:#f00;">
Cette bulle doit s'ouvrir ici
</p>
</div>
<div>
<p>
<map name="map_catamaran">
<area alt="strategie" shape="poly" coords="267,116,381,116,366,196,301,275,187,275,249,196" nohref="nohref" onclick="bulleclic('catamaran_strategie',193,134,event)" onmouseover="bullepop('catamaran_strategie',193,134,event)" onmouseout="couic()">
<area alt="portefeuille" shape="poly" coords="398,116,513,116,498,196,433,275,319,275,380,196" nohref="nohref" onclick="return false" onmouseover="bullepop('catamaran_portefeuille',325,134,event)" onmouseout="couic()">
<area alt="accompagnement" shape="poly" coords="530,116,644,116,628,196,565,275,451,275,512,196" nohref="nohref" onclick="return false" onmouseover="bullepop('catamaran_accompagnement',457,134,event)" onmouseout="couic()">
<area alt="developpement" shape="poly" coords="685,116,800,116,785,196,721,275,606,275,667,196" nohref="nohref" onclick="return false" onmouseover="bullepop('catamaran_developpement',612,134,event)" onmouseout="couic()">
</map>
<img src="img/catamaran.png" usemap="#map_catamaran">
</p>
</div>
</body>
</html> |
