Subversion Repositories wimsdev

Rev

Rev 2071 | Show entire file | Ignore whitespace | Details | Blame | Last modification | View Log | RSS feed

Rev 2071 Rev 5787
Line 30... Line 30...
30
//-->
30
//-->
31
</script>
31
</script>
32
 
32
 
33
    <table>
33
    <table>
34
      <tbody><tr>
34
      <tbody><tr>
35
        <td width="50"><br></td>
35
        <td width="50"><br/></td>
36
        <td>
36
        <td>
37
          <table bgcolor="#000099" border="0" cellpadding="0" cellspacing="0">
37
          <table bgcolor="#000099" border="0" cellpadding="0" cellspacing="0">
38
            <tbody><tr>
38
            <tbody><tr>
39
              <td>
39
              <td>
40
                <table border="0" cellpadding="6" cellspacing="1" width="100%">
40
                <table border="0" cellpadding="6" cellspacing="1" width="100%">
Line 47... Line 47...
47
                      <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('Tooltip positioned above mouse pointer', ABOVE, true);">ABOVE</a></tt>
47
                      <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('Tooltip positioned above mouse pointer', ABOVE, true);">ABOVE</a></tt>
48
                    </td>
48
                    </td>
49
                    <td>
49
                    <td>
50
                      Positions the tooltip above the mousepointer.
50
                      Positions the tooltip above the mousepointer.
51
                      Value: true or false.
51
                      Value: true or false.
52
                      <br>&nbsp;<br>
52
                      <br/>&nbsp;<br/>
53
                      Combine with
53
                      Combine with
54
                      <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('These commands have been applied:<br>ABOVE, true, OFFSETY, 50', ABOVE,true,OFFSETY,50);">OFFSETY</a></tt>
54
                      <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('These commands have been applied:<br/>ABOVE, true, OFFSETY, 50', ABOVE,true,OFFSETY,50);">OFFSETY</a></tt>
55
                      to adjust the vertical distance from the mousepointer,
55
                      to adjust the vertical distance from the mousepointer,
56
                      or with
56
                      or with
57
                      <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('These commands have been applied:<br>ABOVE, true, CENTERMOUSE, true', ABOVE, true, CENTERMOUSE, true, OFFSETX, 0);">CENTERMOUSE</a></tt>
57
                      <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('These commands have been applied:<br/>ABOVE, true, CENTERMOUSE, true', ABOVE, true, CENTERMOUSE, true, OFFSETX, 0);">CENTERMOUSE</a></tt>
58
                      to center the tooltip horizontally above the mousepointer.
58
                      to center the tooltip horizontally above the mousepointer.
59
                    </td>
59
                    </td>
60
                  </tr>
60
                  </tr>
61
                  <tr bgcolor="#ffffff" valign="top">
61
                  <tr bgcolor="#ffffff" valign="top">
62
                    <td>
62
                    <td>
Line 64... Line 64...
64
                    </td>
64
                    </td>
65
                    <td>
65
                    <td>
66
                      Background color of the tooltip.
66
                      Background color of the tooltip.
67
                      Value: HTML color, in single quotes, e.g. '#D3E3F6' or 'DarkCyan',
67
                      Value: HTML color, in single quotes, e.g. '#D3E3F6' or 'DarkCyan',
68
                      or empty string <tt>''</tt> for
68
                      or empty string <tt>''</tt> for
69
                      <tt><a class="nodeco" href="javascript:void(0)" onmouseover="Tip('This tooltip has neither a background<br>nor a border', BORDERWIDTH, 0, BGCOLOR, '', FONTWEIGHT, 'bold', FONTCOLOR, '#00AA00')">no background</a></tt>.
69
                      <tt><a class="nodeco" href="javascript:void(0)" onmouseover="Tip('This tooltip has neither a background<br/>nor a border', BORDERWIDTH, 0, BGCOLOR, '', FONTWEIGHT, 'bold', FONTCOLOR, '#00AA00')">no background</a></tt>.
70
                      <br>Example:
70
                      <br/>Example:
71
                      <br>
71
                      <br/>
72
                      <tt><font style="font-size: 12px;" size="2">onmouseover="Tip('Some text', BGCOLOR, '#D3E3F6')"</font></tt>
72
                      <tt><font style="font-size: 12px;" size="2">onmouseover="Tip('Some text', BGCOLOR, '#D3E3F6')"</font></tt>
73
                      <br>or<br>
73
                      <br/>or<br/>
74
                      <tt><font style="font-size: 12px;" size="2">onmouseover="Tip('Some text', BGCOLOR, '')"</font></tt>
74
                      <tt><font style="font-size: 12px;" size="2">onmouseover="Tip('Some text', BGCOLOR, '')"</font></tt>
75
                    </td>
75
                    </td>
76
                  </tr>
76
                  </tr>
77
                  <tr bgcolor="#ffffff" valign="top">
77
                  <tr bgcolor="#ffffff" valign="top">
78
                    <td>
78
                    <td>
79
                      <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('Tooltip with background image', BGIMG, '../images/tooltip/tt_bg.jpg', PADDING, 10, WIDTH, 180);">BGIMG</a></tt>
79
                      <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('Tooltip with background image', BGIMG, '../images/tooltip/tt_bg.jpg', PADDING, 10, WIDTH, 180);">BGIMG</a></tt>
80
                    </td>
80
                    </td>
81
                    <td>
81
                    <td>
82
                      Background image.
82
                      Background image.
83
                      Value: Path to image, in single quotes.
83
                      Value: Path to image, in single quotes.
84
                      <br>Example:
84
                      <br/>Example:
85
                      <br>
85
                      <br/>
86
                      <tt><font style="font-size: 12px;" size="2">onmouseover="Tip('Some text', BGIMG, '../images/tipbackground.gif')"</font></tt>
86
                      <tt><font style="font-size: 12px;" size="2">onmouseover="Tip('Some text', BGIMG, '../images/tipbackground.gif')"</font></tt>
87
                    </td>
87
                    </td>
88
                  </tr>
88
                  </tr>
89
                  <tr bgcolor="#ffffff" valign="top">
89
                  <tr bgcolor="#ffffff" valign="top">
90
                    <td>
90
                    <td>
Line 110... Line 110...
110
                      <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('Width of tooltip border', BORDERWIDTH, 5);">BORDERWIDTH</a></tt>
110
                      <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('Width of tooltip border', BORDERWIDTH, 5);">BORDERWIDTH</a></tt>
111
                    </td>
111
                    </td>
112
                    <td>
112
                    <td>
113
                      Width of tooltip border.
113
                      Width of tooltip border.
114
                      Value: Integer&nbsp;&#8805;&nbsp;0. Default is 1. Use 0 for no border.
114
                      Value: Integer&nbsp;&#8805;&nbsp;0. Default is 1. Use 0 for no border.
115
                      <br>Example:
115
                      <br/>Example:
116
                      <br>
116
                      <br/>
117
                      <tt><font style="font-size: 12px;" size="2">onmouseover="Tip('Some text', BORDERWIDTH, 2)"</font></tt>
117
                      <tt><font style="font-size: 12px;" size="2">onmouseover="Tip('Some text', BORDERWIDTH, 2)"</font></tt>
118
                    </td>
118
                    </td>
119
                  </tr>
119
                  </tr>
120
                  <tr bgcolor="#ffffff" valign="top">
120
                  <tr bgcolor="#ffffff" valign="top">
121
                    <td align="right">
121
                    <td align="right">
Line 123... Line 123...
123
                    </td>
123
                    </td>
124
                    <td>
124
                    <td>
125
                      Centers the tooltip horizontally beneath (or above) the mousepointer.
125
                      Centers the tooltip horizontally beneath (or above) the mousepointer.
126
                      Value: true or false.
126
                      Value: true or false.
127
                      Consider that the tooltip is offset from the center by the value globally set in wz_tooltip.js (<tt>config.&nbsp;OffsetX</tt>), or as specified by the OFFSETX command.
127
                      Consider that the tooltip is offset from the center by the value globally set in wz_tooltip.js (<tt>config.&nbsp;OffsetX</tt>), or as specified by the OFFSETX command.
128
                      <br>Example:
128
                      <br/>Example:
129
                      <br>
129
                      <br/>
130
                      <tt><font style="font-size: 12px;" size="2">onmouseover="Tip('Some text', CENTERMOUSE, true, OFFSETX, 0)"</font></tt>
130
                      <tt><font style="font-size: 12px;" size="2">onmouseover="Tip('Some text', CENTERMOUSE, true, OFFSETX, 0)"</font></tt>
131
                    </td>
131
                    </td>
132
                  </tr>
132
                  </tr>
133
                  <tr bgcolor="#ffffff" valign="top">
133
                  <tr bgcolor="#ffffff" valign="top">
134
                    <td>
134
                    <td>
Line 152... Line 152...
152
                    <td>
152
                    <td>
153
                      <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('Altered closebutton colors', CLOSEBTN, true, STICKY, true, CLOSEBTNCOLORS, ['#7799cc', '#ffaaaa', '#ffffff', '#ff0000']);">CLOSEBTNCOLORS</a></tt>
153
                      <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('Altered closebutton colors', CLOSEBTN, true, STICKY, true, CLOSEBTNCOLORS, ['#7799cc', '#ffaaaa', '#ffffff', '#ff0000']);">CLOSEBTNCOLORS</a></tt>
154
                    </td>
154
                    </td>
155
                    <td>
155
                    <td>
156
                      Colors used for the closebutton.
156
                      Colors used for the closebutton.
157
                      <br>&nbsp;<br>
157
                      <br/>&nbsp;<br/>
158
Value must be a comma-separated array of 4 color values. Each color in
158
Value must be a comma-separated array of 4 color values. Each color in
159
single quotes. The entire array must be enclosed with a pair of square
159
single quotes. The entire array must be enclosed with a pair of square
160
brackets, see example below, since it's actually a single parameter.
160
brackets, see example below, since it's actually a single parameter.
161
The 4 colors have the following meanings: <br>
161
The 4 colors have the following meanings: <br/>
162
                      1. Background color
162
                      1. Background color
163
                      <br>
163
                      <br/>
164
                      2. Text color
164
                      2. Text color
165
                      <br>
165
                      <br/>
166
                      3. Highlighted background, while the button is being hovered
166
                      3. Highlighted background, while the button is being hovered
167
                      <br>
167
                      <br/>
168
                      4. Hilighted text color, while the button is being hovered
168
                      4. Hilighted text color, while the button is being hovered
169
                      <br>
169
                      <br/>
170
                      For each of these colors, you can also specify an empty string <tt>''</tt>,
170
                      For each of these colors, you can also specify an empty string <tt>''</tt>,
171
                      in which case the title background, or title text color, respectively, is used for that button state.
171
                      in which case the title background, or title text color, respectively, is used for that button state.
172
                      <br>&nbsp;<br>
172
                      <br/>&nbsp;<br/>
173
                      Example:<br>
173
                      Example:<br/>
174
                      <tt><font class="tt" size="2">Tip('Text', CLOSEBTN, true, CLOSEBTNCOLORS, ['', '#66ff66', 'white', '#00cc00'], STICKY, true)</font></tt>
174
                      <tt><font class="tt" size="2">Tip('Text', CLOSEBTN, true, CLOSEBTNCOLORS, ['', '#66ff66', 'white', '#00cc00'], STICKY, true)</font></tt>
175
                      <br>
175
                      <br/>
176
                      In this example, the first color value (background color) is an empty string.
176
                      In this example, the first color value (background color) is an empty string.
177
                      Therefore the closebutton inherits the titlebar background.
177
                      Therefore the closebutton inherits the titlebar background.
178
                    </td>
178
                    </td>
179
                  </tr>
179
                  </tr>
180
                  <tr bgcolor="#ffffff" valign="top">
180
                  <tr bgcolor="#ffffff" valign="top">
Line 183... Line 183...
183
                    </td>
183
                    </td>
184
                    <td>
184
                    <td>
185
                      Text in the closebutton.
185
                      Text in the closebutton.
186
                      Value must be enclosed with single quotes.
186
                      Value must be enclosed with single quotes.
187
                      Example:
187
                      Example:
188
                      <br>
188
                      <br/>
189
                      <tt><font class="tt" size="2">Tip('Tooltip text', CLOSEBTN, true, CLOSEBTNTEXT, 'Click Me', STICKY, true)</font></tt>
189
                      <tt><font class="tt" size="2">Tip('Tooltip text', CLOSEBTN, true, CLOSEBTNTEXT, 'Click Me', STICKY, true)</font></tt>
190
                      <br>
190
                      <br/>
191
Globally preset in wz_tooltip.js is '&amp;nbsp;X&amp;nbsp;' - the
191
Globally preset in wz_tooltip.js is '&amp;nbsp;X&amp;nbsp;' - the
192
whitespace entities '&amp;nbsp;' add some horizontal padding to the
192
whitespace entities '&amp;nbsp;' add some horizontal padding to the
193
button. </td>
193
button. </td>
194
                  </tr>
194
                  </tr>
195
                  <tr bgcolor="#ffffff" valign="top">
195
                  <tr bgcolor="#ffffff" valign="top">
Line 199... Line 199...
199
Actually, this DIV was embedded right into the HTML of the document,
199
Actually, this DIV was embedded right into the HTML of the document,
200
but it has been temporarily converted to a tooltip. </div>
200
but it has been temporarily converted to a tooltip. </div>
201
                    </td>
201
                    </td>
202
                    <td>
202
                    <td>
203
                      COPYCONTENT has only effect on tooltips created with <tt>TagToTip()</tt>, that is, if an HTML element is to be converted to a tooltip.
203
                      COPYCONTENT has only effect on tooltips created with <tt>TagToTip()</tt>, that is, if an HTML element is to be converted to a tooltip.
204
                      <br>
204
                      <br/>
205
                      Value: true, false.
205
                      Value: true, false.
206
                      <br>
206
                      <br/>
207
If true (this is the default behaviour preset in wz_tooltip.js), just a
207
If true (this is the default behaviour preset in wz_tooltip.js), just a
208
copy of the text (or inner HTML) of the HTML element is inserted into
208
copy of the text (or inner HTML) of the HTML element is inserted into
209
the tooltip. If false, the entire HTML element (its DOM node) by itself
209
the tooltip. If false, the entire HTML element (its DOM node) by itself
210
is temporarily converted to a tooltip, which may be useful in the
210
is temporarily converted to a tooltip, which may be useful in the
211
following aspects: <br> 1.) If the HTML element converted to a
211
following aspects: <br/> 1.) If the HTML element converted to a
212
tooltip contains a form with inputs, their current user input will be
212
tooltip contains a form with inputs, their current user input will be
213
maintained even while the tooltip is not displayed. <br>
213
maintained even while the tooltip is not displayed. <br/>
214
                      2.) The tooltip inherits the style properties of the HTML element.
214
                      2.) The tooltip inherits the style properties of the HTML element.
215
                      <br>
215
                      <br/>
216
                      Example how to convert an HTML element entirely to a tooltip, by applying COPYCONTENT with the value <tt>false</tt>:
216
                      Example how to convert an HTML element entirely to a tooltip, by applying COPYCONTENT with the value <tt>false</tt>:
217
                      <br>
217
                      <br/>
218
                      <tt><font class="tt" size="2">TagToTip('SomeID', COPYCONTENT, false, BORDERWIDTH, 0, PADDING, 0)</font></tt>
218
                      <tt><font class="tt" size="2">TagToTip('SomeID', COPYCONTENT, false, BORDERWIDTH, 0, PADDING, 0)</font></tt>
219
                      <br>
219
                      <br/>
220
Moreover, this example turns off the native tooltip border
220
Moreover, this example turns off the native tooltip border
221
(BORDERWIDTH,&nbsp;0), and sets the native tooltip padding to zero, so
221
(BORDERWIDTH,&nbsp;0), and sets the native tooltip padding to zero, so
222
only the padding and border defined for the HTML element itself are
222
only the padding and border defined for the HTML element itself are
223
displayed. </td>
223
displayed. </td>
224
                  </tr>
224
                  </tr>
225
                  <tr bgcolor="#ffffff" valign="top">
225
                  <tr bgcolor="#ffffff" valign="top">
226
                    <td>
226
                    <td>
227
                      <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('Delay of 1000 ms until the tooltip shows up.<br><br>A small delay of 400 ms is preset in wz_tooltip.js (in the section &quot;GLOBAL TOOLTIP CONFIGURATION&quot;) and can be changed there. Note, however, that values much shorter or longer than 500 ms might be perceived as irritating.', DELAY, 1000, WIDTH, 360);">DELAY</a></tt>
227
                      <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('Delay of 1000 ms until the tooltip shows up.<br/><br/>A small delay of 400 ms is preset in wz_tooltip.js (in the section &quot;GLOBAL TOOLTIP CONFIGURATION&quot;) and can be changed there. Note, however, that values much shorter or longer than 500 ms might be perceived as irritating.', DELAY, 1000, WIDTH, 360);">DELAY</a></tt>
228
                    </td>
228
                    </td>
229
                    <td>
229
                    <td>
230
                      Tooltip shows up after the specified timeout, in milliseconds.
230
                      Tooltip shows up after the specified timeout, in milliseconds.
231
                      A behavior similar to OS based tooltips.
231
                      A behavior similar to OS based tooltips.
232
                      <br>
232
                      <br/>
233
                      Value:
233
                      Value:
234
                      Integer&nbsp;&#8805;&nbsp;0. Use 0 for no delay.
234
                      Integer&nbsp;&#8805;&nbsp;0. Use 0 for no delay.
235
                      In wz_tooltip.js preset and recommended is 400.
235
                      In wz_tooltip.js preset and recommended is 400.
236
                      <br>Example:
236
                      <br/>Example:
237
                      <br>
237
                      <br/>
238
                      <tt><font style="font-size: 12px;" size="2">onmouseover="Tip('Some text', DELAY, 1000)"</font></tt>
238
                      <tt><font style="font-size: 12px;" size="2">onmouseover="Tip('Some text', DELAY, 1000)"</font></tt>
239
                    </td>
239
                    </td>
240
                  </tr>
240
                  </tr>
241
                  <tr bgcolor="#ffffff" valign="top">
241
                  <tr bgcolor="#ffffff" valign="top">
242
                    <td>
242
                    <td>
Line 244... Line 244...
244
                    </td>
244
                    </td>
245
                    <td>
245
                    <td>
246
                      Time span, in milliseconds, until the tooltip will be hidden,
246
                      Time span, in milliseconds, until the tooltip will be hidden,
247
                      even if the <tt>STICKY</tt> command has been applied,
247
                      even if the <tt>STICKY</tt> command has been applied,
248
                      or even if the mouse is still on the HTML element that has triggered the tooltip.
248
                      or even if the mouse is still on the HTML element that has triggered the tooltip.
249
                      <br>
249
                      <br/>
250
                      Value:
250
                      Value:
251
                      Integer&nbsp;&#8805;&nbsp;0.
251
                      Integer&nbsp;&#8805;&nbsp;0.
252
                      Use 0 for no limitation (this is the default)
252
                      Use 0 for no limitation (this is the default)
253
                    </td>
253
                    </td>
254
                  </tr>
254
                  </tr>
Line 258... Line 258...
258
                    </td>
258
                    </td>
259
                    <td>
259
                    <td>
260
                      Fade-in animation.
260
                      Fade-in animation.
261
                      The value (integer&nbsp;&#8805;&nbsp;0) specifies the duration of the animation, in milliseconds.
261
                      The value (integer&nbsp;&#8805;&nbsp;0) specifies the duration of the animation, in milliseconds.
262
                      0 for no animation.
262
                      0 for no animation.
263
                      <br>&nbsp;<br>
263
                      <br/>&nbsp;<br/>
264
                      Not supported in Opera prior to v.9.0, old versions of Safari, some versions of Konqueror.
264
                      Not supported in Opera prior to v.9.0, old versions of Safari, some versions of Konqueror.
265
                      These fall back to normal, non-animated behaviour.
265
                      These fall back to normal, non-animated behaviour.
266
                    </td>
266
                    </td>
267
                  </tr>
267
                  </tr>
268
                  <tr bgcolor="#ffffff" valign="top">
268
                  <tr bgcolor="#ffffff" valign="top">
Line 271... Line 271...
271
                    </td>
271
                    </td>
272
                    <td>
272
                    <td>
273
                      Fade-out animation.
273
                      Fade-out animation.
274
                      The value (integer&nbsp;&#8805;&nbsp;0) specifies the duration of the animation, in milliseconds.
274
                      The value (integer&nbsp;&#8805;&nbsp;0) specifies the duration of the animation, in milliseconds.
275
                      0 for no animation.
275
                      0 for no animation.
276
                      <br>&nbsp;<br>
276
                      <br/>&nbsp;<br/>
277
                      Recommended: combine with
277
                      Recommended: combine with
278
                      <tt><a class="nodeco" href="javascript:void(0)" onmouseover="Tip('On another fast trip in Bavaria<br><img src=\'../images/ko5obersoech.jpg\' width=\'180\' height=\'115\' \/>', FADEIN, 800, FADEOUT, 800, TEXTALIGN, 'center', BGCOLOR, '#ffffff')">FADEIN</a></tt>.
278
                      <tt><a class="nodeco" href="javascript:void(0)" onmouseover="Tip('On another fast trip in Bavaria<br/><img src=\'../images/ko5obersoech.jpg\' width=\'180\' height=\'115\' \/>', FADEIN, 800, FADEOUT, 800, TEXTALIGN, 'center', BGCOLOR, '#ffffff')">FADEIN</a></tt>.
279
                      <br>&nbsp;<br>
279
                      <br/>&nbsp;<br/>
280
                      Not supported in Opera prior to v.9.0, old versions of Safari, some versions of Konqueror.
280
                      Not supported in Opera prior to v.9.0, old versions of Safari, some versions of Konqueror.
281
                      These fall back to normal, non-animated behaviour.
281
                      These fall back to normal, non-animated behaviour.
282
                    </td>
282
                    </td>
283
                  </tr>
283
                  </tr>
284
                  <tr bgcolor="#ffffff" valign="top">
284
                  <tr bgcolor="#ffffff" valign="top">
Line 286... Line 286...
286
                      <tt><a class="nodeco" href="javascript:void(0);" onmouseover=" Tip('Tooltip at fixed position', FIX, FixCalcXY(this));">FIX</a></tt>
286
                      <tt><a class="nodeco" href="javascript:void(0);" onmouseover=" Tip('Tooltip at fixed position', FIX, FixCalcXY(this));">FIX</a></tt>
287
                    </td>
287
                    </td>
288
                    <td>
288
                    <td>
289
                      Shows the tooltip at the fixed coordinates [x, y].
289
                      Shows the tooltip at the fixed coordinates [x, y].
290
                      Value: Square-bracketed array of two integers.
290
                      Value: Square-bracketed array of two integers.
291
                      Example:<br>
291
                      Example:<br/>
292
                      <tt>onmouseover="Tip('Some text', FIX, [230, 874])"</tt>
292
                      <tt>onmouseover="Tip('Some text', FIX, [230, 874])"</tt>
293
                      <br>
293
                      <br/>
294
                      You can also call function(s) defined elsewhere that calculate the coordinates dynamically:
294
                      You can also call function(s) defined elsewhere that calculate the coordinates dynamically:
295
                      <br>
295
                      <br/>
296
                      <tt>onmouseover="Tip('Text', FIX, [CalcFixX(), CalcFixY()], BORDERWIDTH, 2)"</tt>
296
                      <tt>onmouseover="Tip('Text', FIX, [CalcFixX(), CalcFixY()], BORDERWIDTH, 2)"</tt>
297
                      <br>
297
                      <br/>
298
                      or
298
                      or
299
                      <br>
299
                      <br/>
300
                      <tt>onmouseover="Tip('Text', FIX, CalcFixXY(), ABOVE, true)"</tt>
300
                      <tt>onmouseover="Tip('Text', FIX, CalcFixXY(), ABOVE, true)"</tt>
301
                      <br>
301
                      <br/>
302
                      In the latter example, the function CalcFixXY() must return an array containing the two numbers.
302
                      In the latter example, the function CalcFixXY() must return an array containing the two numbers.
303
                    </td>
303
                    </td>
304
                  </tr>
304
                  </tr>
305
                  <tr bgcolor="#ffffff" valign="top">
305
                  <tr bgcolor="#ffffff" valign="top">
306
                    <td>
306
                    <td>
307
                      <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('This tooltip doesn\'t follow the movements of the mouse since we\'ve applied the FOLLOWMOUSE command with the value false', FOLLOWMOUSE, false, WIDTH, 300);">FOLLOWMOUSE</a></tt>
307
                      <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('This tooltip doesn\'t follow the movements of the mouse since we\'ve applied the FOLLOWMOUSE command with the value false', FOLLOWMOUSE, false, WIDTH, 300);">FOLLOWMOUSE</a></tt>
308
                    </td>
308
                    </td>
309
                    <td>
309
                    <td>
310
                      The tooltip follows the movements of the mouse.
310
                      The tooltip follows the movements of the mouse.
311
                      Value: true, false. Default: true.
311
                      Value: true, false. Default: true.
312
                      <br>&nbsp;<br>
312
                      <br/>&nbsp;<br/>
313
                      When turning this off by applying the value false,
313
                      When turning this off by applying the value false,
314
                      the tooltip behaves like OS-based tooltips which don't follow the mouse.
314
                      the tooltip behaves like OS-based tooltips which don't follow the mouse.
315
                    </td>
315
                    </td>
316
                  </tr>
316
                  </tr>
317
                  <tr bgcolor="#ffffff" valign="top">
317
                  <tr bgcolor="#ffffff" valign="top">
Line 327... Line 327...
327
                    <td>
327
                    <td>
328
                      <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('Changed font face', FONTFACE, 'Courier New, Courier, mono');">FONTFACE</a></tt>
328
                      <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('Changed font face', FONTFACE, 'Courier New, Courier, mono');">FONTFACE</a></tt>
329
                    </td>
329
                    </td>
330
                    <td>
330
                    <td>
331
                      Font face (font family).
331
                      Font face (font family).
332
                      <br>
332
                      <br/>
333
                      Value:
333
                      Value:
334
                      As you'd specify it in HTML or CSS, enclosed with single quotes, e.g.
334
                      As you'd specify it in HTML or CSS, enclosed with single quotes, e.g.
335
                      <tt>Tip('Some text', FONTFACE, 'Arial, Helvetica, sans-serif', FONTSIZE, '12pt')</tt>
335
                      <tt>Tip('Some text', FONTFACE, 'Arial, Helvetica, sans-serif', FONTSIZE, '12pt')</tt>
336
                    </td>
336
                    </td>
337
                  </tr>
337
                  </tr>
Line 359... Line 359...
359
                      <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('On the other side', LEFT, true);">LEFT</a></tt>
359
                      <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('On the other side', LEFT, true);">LEFT</a></tt>
360
                    </td>
360
                    </td>
361
                    <td>
361
                    <td>
362
                      Tooltip positioned on the left side of the mousepointer.
362
                      Tooltip positioned on the left side of the mousepointer.
363
                      Value: true, false.
363
                      Value: true, false.
364
                      <br>
364
                      <br/>
365
                      <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('LEFT and ABOVE combined...', LEFT, true, ABOVE, true);">LEFT and ABOVE commands combined</a></tt>.
365
                      <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('LEFT and ABOVE combined...', LEFT, true, ABOVE, true);">LEFT and ABOVE commands combined</a></tt>.
366
                      <br>Example:
366
                      <br/>Example:
367
                      <br>
367
                      <br/>
368
                      <tt><font style="font-size: 12px;" size="2">onmouseover="Tip('Some text', LEFT, true, ABOVE, true)"</font></tt>
368
                      <tt><font style="font-size: 12px;" size="2">onmouseover="Tip('Some text', LEFT, true, ABOVE, true)"</font></tt>
369
                    </td>
369
                    </td>
370
                  </tr>
370
                  </tr>
371
                  <tr bgcolor="#ffffff" valign="top">
371
                  <tr bgcolor="#ffffff" valign="top">
372
                    <td>
372
                    <td>
Line 391... Line 391...
391
                      <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('A semi-transparent Tooltip', OPACITY, 70, PADDING, 14);">OPACITY</a></tt>
391
                      <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('A semi-transparent Tooltip', OPACITY, 70, PADDING, 14);">OPACITY</a></tt>
392
                    </td>
392
                    </td>
393
                    <td>
393
                    <td>
394
                      Transparency of tooltip.
394
                      Transparency of tooltip.
395
                      Value: Integer between 0 (fully transparent) and 100 (opaque, no transparency).
395
                      Value: Integer between 0 (fully transparent) and 100 (opaque, no transparency).
396
                      <br>&nbsp;<br>
396
                      <br/>&nbsp;<br/>
397
                      Opacity is the opposite of transparency, i.e.<br>
397
                      Opacity is the opposite of transparency, i.e.<br/>
398
                      opacity&nbsp;=&nbsp;100&nbsp;-&nbsp;transparency&nbsp;(in&nbsp;percent).<br>
398
                      opacity&nbsp;=&nbsp;100&nbsp;-&nbsp;transparency&nbsp;(in&nbsp;percent).<br/>
399
                      <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('<img src=../images/dragdrop/fateba_fi.jpg width=130 height=103><br>Tooltip with image, shadow, background image and fade-in/fade-out animation.', WIDTH, 180, OPACITY, 80, TEXTALIGN, 'center', TITLEALIGN, 'center', SHADOW, true, TITLE, 'Nifty', BGIMG, '../images/tooltip/tt_bg.jpg', FADEIN, 700, FADEOUT, 700);">Another example</a></tt>
399
                      <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('<img src=../images/dragdrop/fateba_fi.jpg width=130 height=103/><br/>Tooltip with image, shadow, background image and fade-in/fade-out animation.', WIDTH, 180, OPACITY, 80, TEXTALIGN, 'center', TITLEALIGN, 'center', SHADOW, true, TITLE, 'Nifty', BGIMG, '../images/tooltip/tt_bg.jpg', FADEIN, 700, FADEOUT, 700);">Another example</a></tt>
400
with image (taken on my 9000-km / 5500-miles recumbent bicycle trip
400
with image (taken on my 9000-km / 5500-miles recumbent bicycle trip
401
Hamburg-Northcape-Munich), shadow via SHADOW command, content centered
401
Hamburg-Northcape-Munich), shadow via SHADOW command, content centered
402
using TEXTALIGN, background image via BGIMG and animation via FADEIN
402
using TEXTALIGN, background image via BGIMG and animation via FADEIN
403
and FADEOUT commands. <br>&nbsp;<br>
403
and FADEOUT commands. <br/>&nbsp;<br/>
404
                      Not supported in Opera prior to v.9.0, old versions of Safari and some versions of Konqueror.
404
                      Not supported in Opera prior to v.9.0, old versions of Safari and some versions of Konqueror.
405
                    </td>
405
                    </td>
406
                  </tr>
406
                  </tr>
407
                  <tr bgcolor="#ffffff" valign="top">
407
                  <tr bgcolor="#ffffff" valign="top">
408
                    <td>
408
                    <td>
Line 422... Line 422...
422
                      Value: true, false
422
                      Value: true, false
423
                    </td>
423
                    </td>
424
                  </tr>
424
                  </tr>
425
                  <tr bgcolor="#ffffff" valign="top">
425
                  <tr bgcolor="#ffffff" valign="top">
426
                    <td>
426
                    <td>
427
                      <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('This one drops a shadow (SHADOW command),<br>and its shadow color has been changed (SHADOWCOLOR command)', PADDING, 8, SHADOW, true, SHADOWCOLOR, '#dd99aa');">SHADOWCOLOR</a></tt>
427
                      <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('This one drops a shadow (SHADOW command),<br/>and its shadow color has been changed (SHADOWCOLOR command)', PADDING, 8, SHADOW, true, SHADOWCOLOR, '#dd99aa');">SHADOWCOLOR</a></tt>
428
                      <!--br>
428
                      <!--br>
429
 
429
 
430
                      <form> &nbsp; &nbsp; <select><option>aaa</option><option>bbb</option><option>ccc</option></select></form-->
430
                      <form> &nbsp; &nbsp; <select><option>aaa</option><option>bbb</option><option>ccc</option></select></form-->
431
                    </td>
431
                    </td>
432
                    <td>
432
                    <td>
433
                      Shadow color.
433
                      Shadow color.
434
                      Value: HTML color, in single quotes.
434
                      Value: HTML color, in single quotes.
435
                      <br>Example:
435
                      <br/>Example:
436
                      <br>
436
                      <br/>
437
                      <tt><font style="font-size: 12px;" size="2">onmouseover="Tip('Some text', SHADOW, true, SHADOWCOLOR, '#dd99aa')"</font></tt>
437
                      <tt><font style="font-size: 12px;" size="2">onmouseover="Tip('Some text', SHADOW, true, SHADOWCOLOR, '#dd99aa')"</font></tt>
438
                    </td>
438
                    </td>
439
                  </tr>
439
                  </tr>
440
                  <tr bgcolor="#ffffff" valign="top">
440
                  <tr bgcolor="#ffffff" valign="top">
441
                    <td>
441
                    <td>
442
                      <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('Increased shadow width', SHADOW, true, SHADOWWIDTH, 10, PADDING, 8);">SHADOWWIDTH</a></tt>
442
                      <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('Increased shadow width', SHADOW, true, SHADOWWIDTH, 10, PADDING, 8);">SHADOWWIDTH</a></tt>
443
                    </td>
443
                    </td>
444
                    <td>
444
                    <td>
445
                      Shadow width (offset).
445
                      Shadow width (offset).
446
                      Value: Integer&nbsp;&#8805;&nbsp;0.
446
                      Value: Integer&nbsp;&#8805;&nbsp;0.
447
                      <br>Example:
447
                      <br/>Example:
448
                      <br>
448
                      <br/>
449
                      <tt><font style="font-size: 12px;" size="2">onmouseover="Tip('Some text', SHADOW, true, SHADOWWIDTH, 7)"</font></tt>
449
                      <tt><font style="font-size: 12px;" size="2">onmouseover="Tip('Some text', SHADOW, true, SHADOWWIDTH, 7)"</font></tt>
450
                    </td>
450
                    </td>
451
                  </tr>
451
                  </tr>
452
                  <tr bgcolor="#ffffff" valign="top">
452
                  <tr bgcolor="#ffffff" valign="top">
453
                    <td>
453
                    <td>
454
                      <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('STICKY, true<ul><li style=\'font-family:Verdana,Geneva,sans-serif;font-size:8pt;\'><a href=#top>Top of page<\/a><\/li><li style=\'font-family:Verdana,Geneva,sans-serif;font-size:8pt;\'><a href=\'#docu\'>Begin of documentation<\/a><\/li><\/ul>', STICKY, true, CLICKCLOSE, true, PADDING, 6);">STICKY</a></tt>
454
                      <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('STICKY, true<ul><li style=\'font-family:Verdana,Geneva,sans-serif;font-size:8pt;\'><a href=#top>Top of page<\/a><\/li><li style=\'font-family:Verdana,Geneva,sans-serif;font-size:8pt;\'><a href=\'#docu\'>Begin of documentation<\/a><\/li><\/ul>', STICKY, true, CLICKCLOSE, true, PADDING, 6);">STICKY</a></tt>
455
                    </td>
455
                    </td>
456
                    <td>
456
                    <td>
457
                      The tooltip stays fixed at its initial position until another tooltip pops up.
457
                      The tooltip stays fixed at its initial position until another tooltip pops up.
458
                      Value: true, false.
458
                      Value: true, false.
459
                      <br>&nbsp;<br>
459
                      <br/>&nbsp;<br/>
460
                      With
460
                      With
461
                      <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('STICKY, true, DURATION, 2500<br>This tip is sticky, but its lifetime has been limited to 2.5 seconds.', STICKY, true, CLICKCLOSE, true, DURATION, 2500, WIDTH, 280)">DURATION</a></tt>
461
                      <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('STICKY, true, DURATION, 2500<br/>This tip is sticky, but its lifetime has been limited to 2.5 seconds.', STICKY, true, CLICKCLOSE, true, DURATION, 2500, WIDTH, 280)">DURATION</a></tt>
462
                      you can enforce the tooltip to disappear after a certain time span.
462
                      you can enforce the tooltip to disappear after a certain time span.
463
                    </td>
463
                    </td>
464
                  </tr>
464
                  </tr>
465
                  <tr bgcolor="#ffffff" valign="top">
465
                  <tr bgcolor="#ffffff" valign="top">
466
                    <td>
466
                    <td>
467
                      <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('The TEXTALIGN command takes as values either \'right\', \'center\', \'justify\' or \'left\', the latter being unnecessary since it is the default value.', WIDTH, 200, TITLE, 'Right-Aligned Text', TEXTALIGN, 'right');">TEXTALIGN</a></tt>
467
                      <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('The TEXTALIGN command takes as values either \'right\', \'center\', \'justify\' or \'left\', the latter being unnecessary since it is the default value.', WIDTH, 200, TITLE, 'Right-Aligned Text', TEXTALIGN, 'right');">TEXTALIGN</a></tt>
468
                    </td>
468
                    </td>
469
                    <td>
469
                    <td>
470
                      Aligns the text in the body of the tooltip.
470
                      Aligns the text in the body of the tooltip.
471
                      Value: 'right', 'center',
471
                      Value: 'right', 'center',
472
                      <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('<img align=\'right\' src=\'..\/images\/dragdrop\/muckl.jpg\' width=\'100\' height=\'130\'>This is some quite lengthy text which demonstrates the justification effect which can be achieved by sending the TEXTALIGN command with the \'justify\' value. Note that text justification is not recommended for text that consists of relatively short lines - as is also the case in this tooltip, in particular with the text alongside the Muckl image above.', TITLE, 'Justified text with Muckl', TEXTALIGN, 'justify', WIDTH, 250);">'justify'</a></tt>
472
                      <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('<img align=\'right\' src=\'..\/images\/dragdrop\/muckl.jpg\' width=\'100\' height=\'130\'/>This is some quite lengthy text which demonstrates the justification effect which can be achieved by sending the TEXTALIGN command with the \'justify\' value. Note that text justification is not recommended for text that consists of relatively short lines - as is also the case in this tooltip, in particular with the text alongside the Muckl image above.', TITLE, 'Justified text with Muckl', TEXTALIGN, 'justify', WIDTH, 250);">'justify'</a></tt>
473
                      or 'left'.
473
                      or 'left'.
474
                      <br>Example:
474
                      <br/>Example:
475
                      <br>
475
                      <br/>
476
                      <tt><font style="font-size: 12px;" size="2">onmouseover="Tip('Some text', TEXTALIGN, 'right')"</font></tt>
476
                      <tt><font style="font-size: 12px;" size="2">onmouseover="Tip('Some text', TEXTALIGN, 'right')"</font></tt>
477
                    </td>
477
                    </td>
478
                  </tr>
478
                  </tr>
479
                  <tr bgcolor="#ffffff" valign="top">
479
                  <tr bgcolor="#ffffff" valign="top">
480
                    <td>
480
                    <td>
Line 522... Line 522...
522
                    </td>
522
                    </td>
523
                    <td>
523
                    <td>
524
                      Font face for title text.
524
                      Font face for title text.
525
                      Value: Like in HTML or CSS. Enclosed with single quotes.
525
                      Value: Like in HTML or CSS. Enclosed with single quotes.
526
                      If the value is an empty string <tt>''</tt>, the tooltip body font, in boldified form, is used (this is the default).
526
                      If the value is an empty string <tt>''</tt>, the tooltip body font, in boldified form, is used (this is the default).
527
                      <br>
527
                      <br/>
528
                      Example:
528
                      Example:
529
                      <br>
529
                      <br/>
530
                      <tt><font style="font-size: 12px;" size="2">onmouseover="Tip('Some text', TITLE, 'Some Title', TITLEFONTFACE, 'Verdana,sans-serif')"</font></tt>
530
                      <tt><font style="font-size: 12px;" size="2">onmouseover="Tip('Some text', TITLE, 'Some Title', TITLEFONTFACE, 'Verdana,sans-serif')"</font></tt>
531
                      <br>
531
                      <br/>
532
                    </td>
532
                    </td>
533
                  </tr>
533
                  </tr>
534
                  <tr bgcolor="#ffffff" valign="top">
534
                  <tr bgcolor="#ffffff" valign="top">
535
                    <td>
535
                    <td>
536
                      <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('TITLEFONTSIZE, \'18pt\'', TITLE, 'Big Title',  TITLEFONTSIZE, '18pt');">TITLEFONTSIZE</a></tt>
536
                      <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('TITLEFONTSIZE, \'18pt\'', TITLE, 'Big Title',  TITLEFONTSIZE, '18pt');">TITLEFONTSIZE</a></tt>
Line 548... Line 548...
548
                    </td>
548
                    </td>
549
                    <td>
549
                    <td>
550
                      Width of tooltip.
550
                      Width of tooltip.
551
                      Value: Integer&nbsp;&#8805;&nbsp;0.
551
                      Value: Integer&nbsp;&#8805;&nbsp;0.
552
                      If 0 (the default), the width is automatically adapted to the content of the tooltip.
552
                      If 0 (the default), the width is automatically adapted to the content of the tooltip.
553
                      <br>&nbsp;<br>
553
                      <br/>&nbsp;<br/>
554
                      Note that the tooltips follow the W3C box model,
554
                      Note that the tooltips follow the W3C box model,
555
                      which means that the specified width applies to the actual content of the tooltip,
555
                      which means that the specified width applies to the actual content of the tooltip,
556
                      excluding padding (see PADDING command), border and shadow.
556
                      excluding padding (see PADDING command), border and shadow.
557
                    </td>
557
                    </td>
558
                  </tr>
558
                  </tr>
559
                </tbody></table>
559
                </tbody></table>
560
              </td>
560
              </td>
561
            </tr>
561
            </tr>
562
          </tbody></table>
562
          </tbody></table>
563
        </td>
563
        </td>
564
        <td width="50"><br></td>
564
        <td width="50"><br/></td>
565
      </tr>
565
      </tr>
566
    </tbody></table>
566
    </tbody></table>
567
 
567