Go to most recent revision | Details | Last modification | View Log | RSS feed
Rev | Author | Line No. | Line |
---|---|---|---|
2071 | zjchen | 1 | |
2 | <style type="text/css"> |
||
3 | <!-- |
||
4 | .tt { |
||
5 | font-size:12px; |
||
6 | } |
||
7 | |||
8 | #T2tDirect { |
||
9 | border:2px solid red; |
||
10 | background:yellow; |
||
11 | padding:3px; |
||
12 | } |
||
13 | --> |
||
14 | </style> |
||
15 | <script type="text/javascript"> |
||
16 | <!-- |
||
17 | function FixCalcXY(el) |
||
18 | { |
||
19 | if(typeof(el.offsetParent) == "undefined") |
||
20 | return [70, 4000]; |
||
21 | var a = new Array(0, -70); |
||
22 | while(el) |
||
23 | { |
||
24 | a[0] += el.offsetLeft || 0; |
||
25 | a[1] += el.offsetTop || 0; |
||
26 | el = el.offsetParent || null; |
||
27 | } |
||
28 | return a; |
||
29 | } |
||
30 | //--> |
||
31 | </script> |
||
32 | |||
33 | <table> |
||
34 | <tbody><tr> |
||
35 | <td width="50"><br></td> |
||
36 | <td> |
||
37 | <table bgcolor="#000099" border="0" cellpadding="0" cellspacing="0"> |
||
38 | <tbody><tr> |
||
39 | <td> |
||
40 | <table border="0" cellpadding="6" cellspacing="1" width="100%"> |
||
41 | <tbody><tr bgcolor="#eeeeee"> |
||
42 | <th align="center">命令</th> |
||
43 | <th align="center">描述</th> |
||
44 | </tr> |
||
45 | <tr bgcolor="#ffffff" valign="top"> |
||
46 | <td> |
||
47 | <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('tooltip 放在鼠标点上面', ABOVE, true);">ABOVE</a></tt> |
||
48 | </td> |
||
49 | <td> |
||
50 | tooltip 放在鼠标点上面. |
||
51 | 取值: true 或 false. |
||
52 | <br> <br> |
||
53 | 与 |
||
54 | <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('此处用了以下命令:<br>ABOVE, true, OFFSETY, 50', ABOVE,true,OFFSETY,50);">OFFSETY</a></tt> |
||
55 | 联用可调节到鼠标点的垂直距离, |
||
56 | 或用 |
||
57 | <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('此处用了以下命令:<br>ABOVE, true, CENTERMOUSE, true', ABOVE, true, CENTERMOUSE, true, OFFSETX, 0);">CENTERMOUSE</a></tt> |
||
58 | 使得 tooltip 的中心位于鼠标点上面. |
||
59 | </td> |
||
60 | </tr> |
||
61 | <tr bgcolor="#ffffff" valign="top"> |
||
62 | <td> |
||
63 | <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('改变 tooltip 的背景色', BGCOLOR,'#f3e0f3');">BGCOLOR</a></tt> |
||
64 | </td> |
||
65 | <td> |
||
66 | tooltip 的背景色. |
||
67 | 取值: 放在单引号里面的 HTML 色彩, 例如 '#D3E3F6' 或 'DarkCyan', |
||
68 | 空色彩 <tt>''</tt> 表示 |
||
69 | <tt><a class="nodeco" href="javascript:void(0)" onmouseover="Tip('此 tooltip 既无背景<br>也无边框', BORDERWIDTH, 0, BGCOLOR, '', FONTWEIGHT, 'bold', FONTCOLOR, '#00AA00')">无背景</a></tt>. |
||
70 | <br>例: |
||
71 | <br> |
||
72 | <tt><font style="font-size: 12px;" size="2">onmouseover="Tip('某些文字', BGCOLOR, '#D3E3F6')"</font></tt> |
||
73 | <br>or<br> |
||
74 | <tt><font style="font-size: 12px;" size="2">onmouseover="Tip('某些文字', BGCOLOR, '')"</font></tt> |
||
75 | </td> |
||
76 | </tr> |
||
77 | <tr bgcolor="#ffffff" valign="top"> |
||
78 | <td> |
||
79 | <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('带背景图像的 tooltip', BGIMG, '../images/tooltip/tt_bg.jpg', PADDING, 10, WIDTH, 180);">BGIMG</a></tt> |
||
80 | </td> |
||
81 | <td> |
||
82 | 背景图像. |
||
83 | 取值: 用单引号括起来的到图像的路径. |
||
84 | <br>例: |
||
85 | <br> |
||
86 | <tt><font style="font-size: 12px;" size="2">onmouseover="Tip('某些文字', BGIMG, '../images/tipbackground.gif')"</font></tt> |
||
87 | </td> |
||
88 | </tr> |
||
89 | <tr bgcolor="#ffffff" valign="top"> |
||
90 | <td> |
||
91 | <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('改变边框颜色', BORDERCOLOR, '#dd00aa');">BORDERCOLOR</a></tt> |
||
92 | </td> |
||
93 | <td> |
||
94 | 边框颜色. |
||
95 | 取值: 用单引号括起来的 HTML 色彩, 例如 '#dd00aa'. |
||
96 | </td> |
||
97 | </tr> |
||
98 | <tr bgcolor="#ffffff" valign="top"> |
||
99 | <td> |
||
100 | <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('虚线边框', BORDERSTYLE, 'dashed', PADDING, 8);">BORDERSTYLE</a></tt> |
||
101 | </td> |
||
102 | <td> |
||
103 | 边框格式. |
||
104 | 取值: 用单引号括起来的 CSS 边框格式. |
||
105 | 推荐值为 'solid' (默认), 'dashed' 或 'dotted', 其它值可能不适用于某些浏览器. |
||
106 | </td> |
||
107 | </tr> |
||
108 | <tr bgcolor="#ffffff" valign="top"> |
||
109 | <td> |
||
110 | <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('tooltip 边框宽度', BORDERWIDTH, 5);">BORDERWIDTH</a></tt> |
||
111 | </td> |
||
112 | <td> |
||
113 | tooltip 边框宽度. |
||
114 | 取值: 非负整数. 默认是 1. 0 表示无框. |
||
115 | <br>例: |
||
116 | <br> |
||
117 | <tt><font style="font-size: 12px;" size="2">onmouseover="Tip('某些文字', BORDERWIDTH, 2)"</font></tt> |
||
118 | </td> |
||
119 | </tr> |
||
120 | <tr bgcolor="#ffffff" valign="top"> |
||
121 | <td align="right"> |
||
122 | <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('居中处于鼠标下方', CENTERMOUSE, true, OFFSETX, 0, OFFSETY, 22);">CENTERMOUSE</a></tt> |
||
123 | </td> |
||
124 | <td> |
||
125 | 使 tooltip 居中处于鼠标下方(或上方). |
||
126 | 取值: true 或 false. |
||
127 | tooltip 离中心的水平偏移量整体由 wz_tooltip.js (<tt>设置 OffsetX</tt>) 规定, 或者利用 OFFSETX 命令设定. |
||
128 | <br>例: |
||
129 | <br> |
||
130 | <tt><font style="font-size: 12px;" size="2">onmouseover="Tip('某些文字', CENTERMOUSE, true, OFFSETX, 0)"</font></tt> |
||
131 | </td> |
||
132 | </tr> |
||
133 | <tr bgcolor="#ffffff" valign="top"> |
||
134 | <td> |
||
135 | <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('由于使用了 CLICKCLOSE, true, 这个 tooltip 是 "粘滞的", 但可以通过点击 tooltip 或文件而关闭.', CLICKCLOSE, true, STICKY, true, WIDTH, 300);">CLICKCLOSE</a></tt> |
||
136 | </td> |
||
137 | <td> |
||
138 | 当用户在 tooltip 或文件内部点击才能关闭此 tooltip. |
||
139 | 取值: true, false. |
||
140 | </td> |
||
141 | </tr> |
||
142 | <tr bgcolor="#ffffff" valign="top"> |
||
143 | <td> |
||
144 | <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('关闭按钮位于标题栏', CLOSEBTN, true, STICKY, true);">CLOSEBTN</a></tt> |
||
145 | </td> |
||
146 | <td> |
||
147 | 关闭按钮位于标题栏. |
||
148 | 取值: true, false. |
||
149 | </td> |
||
150 | </tr> |
||
151 | <tr bgcolor="#ffffff" valign="top"> |
||
152 | <td> |
||
153 | <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('改变关闭按钮的颜色', CLOSEBTN, true, STICKY, true, CLOSEBTNCOLORS, ['#7799cc', '#ffaaaa', '#ffffff', '#ff0000']);">CLOSEBTNCOLORS</a></tt> |
||
154 | </td> |
||
155 | <td> |
||
156 | 关闭按钮的颜色. |
||
157 | <br> <br> |
||
158 | 其取值必须是用逗号分隔的 4 个颜色值. 每个颜色放在一对单引号内. |
||
159 | 整个数组用一对方括号括起来, 参见下例. |
||
160 | 4 个颜色参数的含义如下 : <br> |
||
161 | 1. 背景色 |
||
162 | <br> |
||
163 | 2. 文字色 |
||
164 | <br> |
||
165 | 3. 当鼠标移至按钮上面时, 加亮的背景色 |
||
166 | <br> |
||
167 | 4. 当鼠标移至按钮上面时, 加亮的文字色 |
||
168 | <br> |
||
169 | 可以用空串 <tt>''</tt> 作为颜色参数, |
||
170 | 此时分别使用标题栏的背景色或文字色作为按钮的颜色. |
||
171 | <br> <br> |
||
172 | 例:<br> |
||
173 | <tt><font class="tt" size="2">Tip('文字', CLOSEBTN, true, CLOSEBTNCOLORS, ['', '#66ff66', 'white', '#00cc00'], STICKY, true)</font></tt> |
||
174 | <br> |
||
175 | 这个例子里的背景色是空串, 因此关闭按钮继承标题栏的背景色. |
||
176 | </td> |
||
177 | </tr> |
||
178 | <tr bgcolor="#ffffff" valign="top"> |
||
179 | <td> |
||
180 | <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('改变关闭按钮的文字', CLOSEBTN, true, STICKY, true, CLOSEBTNTEXT, '点击这里');">CLOSEBTNTEXT</a></tt> |
||
181 | </td> |
||
182 | <td> |
||
183 | 关闭按钮的文字. |
||
184 | 取值必须放在单引号里面. |
||
185 | 例: |
||
186 | <br> |
||
187 | <tt><font class="tt" size="2">Tip('Tooltip 文字', CLOSEBTN, true, CLOSEBTNTEXT, '点击这里', STICKY, true)</font></tt> |
||
188 | <br> |
||
189 | 在 wz_tooltip.js 里被整体预置为 '&nbsp;X&nbsp;' - |
||
190 | 空格 '&nbsp;' 用来作为按钮的水平铺垫. </td> |
||
191 | </tr> |
||
192 | <tr bgcolor="#ffffff" valign="top"> |
||
193 | <td> |
||
194 | <tt><a class="nodeco" href="javascript:void(0);" onmouseover="TagToTip('T2tDirect', COPYCONTENT, false, PADDING, 0, BORDERWIDTH, 0, WIDTH, 280);">COPYCONTENT</a></tt> |
||
195 | <div style="display: none;" id="T2tDirect"> |
||
196 | 这个 DIV 实际上已被放入文件的 HTML, |
||
197 | 但它暂时转换成一个 tooltip. </div> |
||
198 | </td> |
||
199 | <td> |
||
200 | COPYCONTENT 仅当使用 <tt>TagToTip()</tt> 创建 tooltip 时才有效, 也就是说, 当一个 HTML 元素被转换成 tooltip 时. |
||
201 | <br> |
||
202 | 取值: true, false. |
||
203 | <br> |
||
204 | 若是 true (这是 wz_tooltip.js 里预置的默认值), HTML 的仅仅一段文字(或内部 HTML)被插入 tooltip. |
||
205 | 若是 false, 整个 HTML 元素(它的 DOM 结点)被暂时转换成一个 tooltip, |
||
206 | 这在以下情形可能有用:<br> 1) 如果转换成 tooltip 的 HTML 元素包含输入表格, |
||
207 | 那么即使 tooltip 没有显示, 当前用户仍能输入. <br> |
||
208 | 2) tooltip 继承 HTML 元素的格式性质. |
||
209 | <br> |
||
210 | 下例显示通过运用 COPYCONTENT 并设值为 <tt>false</tt>, 如何把一个 HTML 元素全部转换成 tooltip: |
||
211 | <br> |
||
212 | <tt><font class="tt" size="2">TagToTip('某个识别符id', COPYCONTENT, false, BORDERWIDTH, 0, PADDING, 0)</font></tt> |
||
213 | <br> |
||
214 | 这个例子关闭了 tooltip 的自然边框 (BORDERWIDTH, 0), |
||
215 | 并把 tooltip 的自然铺垫设成零, 这样就只显示 HTML 元素本身设定的边框及铺垫.</td> |
||
216 | </tr> |
||
217 | <tr bgcolor="#ffffff" valign="top"> |
||
218 | <td> |
||
219 | <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('延迟 1000 ms 才显示 tooltip.<br><br>在 wz_tooltip.js (GLOBAL TOOLTIP CONFIGURATION) 中预置了较短的 400 ms 延迟, 这里可以改变. 不过要注意过短或过长于 500 ms 可能会激起不快.', DELAY, 1000, WIDTH, 360);">DELAY</a></tt> |
||
220 | </td> |
||
221 | <td> |
||
222 | 经一段延迟后才显示 tooltip, 以毫秒为单位. |
||
223 | <br> |
||
224 | 取值: |
||
225 | 非负整数. 0 意为无延迟. |
||
226 | 在 wz_tooltip.js 预置为 400. |
||
227 | <br>例: |
||
228 | <br> |
||
229 | <tt><font style="font-size: 12px;" size="2">onmouseover="Tip('某些文字', DELAY, 1000)"</font></tt> |
||
230 | </td> |
||
231 | </tr> |
||
232 | <tr bgcolor="#ffffff" valign="top"> |
||
233 | <td> |
||
234 | <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('这个提示的生存期限制为 2500 毫秒', DURATION, 2500);">DURATION</a></tt> |
||
235 | </td> |
||
236 | <td> |
||
237 | 提示显示的时间, 以毫秒为单位. |
||
238 | 即使使用了 <tt>STICKY</tt> 命令或甚至仍然位于触发 tooltip 的 HTML 元素上, |
||
239 | 本命令仍然起作用. |
||
240 | <br> |
||
241 | 取值: |
||
242 | 非负整数. |
||
243 | |||
244 | </td> |
||
245 | </tr> |
||
246 | <tr bgcolor="#ffffff" valign="top"> |
||
247 | <td> |
||
248 | <tt><a class="nodeco" href="javascript:void(0);" onmouseover=" Tip('渐显', FADEIN, 1000, PADDING, 10);">FADEIN</a></tt> |
||
249 | </td> |
||
250 | <td> |
||
251 | 渐显. |
||
252 | 其取值 (非负整数) 规定了渐显持续时间, 以毫秒为单位. |
||
253 | |||
254 | <br> <br> |
||
255 | 早于 v.9.0 的 Opera, Safari 的旧版本, 某些版本的 Konqueror 不支持此命令. |
||
256 | 它们只显示通常的无渐变的提示. |
||
257 | </td> |
||
258 | </tr> |
||
259 | <tr bgcolor="#ffffff" valign="top"> |
||
260 | <td> |
||
261 | <tt><a class="nodeco" href="javascript:void(0);" onmouseover=" Tip('渐淡', FADEOUT, 1000, PADDING, 10);">FADEOUT</a></tt> |
||
262 | </td> |
||
263 | <td> |
||
264 | 渐淡. |
||
265 | 其取值 (非负整数) 规定了渐淡持续时间, 以毫秒为单位. |
||
266 | |||
267 | <br> <br> |
||
268 | 推荐: 与 |
||
269 | <tt><a class="nodeco" href="javascript:void(0)" onmouseover="Tip('例<br><img src=\'../../data/maps/fr.jpg\' width=\'132\' height=\'141\' \/>', FADEIN, 800, FADEOUT, 800, TEXTALIGN, 'center', BGCOLOR, '#ffffff')">FADEIN</a></tt> |
||
270 | 联用.<br> <br> |
||
271 | 早于 v.9.0 的 Opera, Safari 的旧版本, 某些版本的 Konqueror 不支持此命令. |
||
272 | 它们只显示通常的无渐变的提示. |
||
273 | </td> |
||
274 | </tr> |
||
275 | <tr bgcolor="#ffffff" valign="top"> |
||
276 | <td> |
||
277 | <tt><a class="nodeco" href="javascript:void(0);" onmouseover=" Tip('Tooltip 放在取定位置', FIX, FixCalcXY(this));">FIX</a></tt> |
||
278 | </td> |
||
279 | <td> |
||
280 | 在坐标 [x, y] 的地方显示 tooltip. |
||
281 | 取值: 用方括号括起来的一对整数. |
||
282 | 例:<br> |
||
283 | <tt>onmouseover="Tip('某些文字', FIX, [230, 874])"</tt> |
||
284 | <br> |
||
285 | 你也可以调用其它地方定义的函数动态地计算坐标: |
||
286 | <br> |
||
287 | <tt>onmouseover="Tip('文字', FIX, [CalcFixX(), CalcFixY()], BORDERWIDTH, 2)"</tt> |
||
288 | <br> |
||
289 | 或 |
||
290 | <br> |
||
291 | <tt>onmouseover="Tip('文字', FIX, CalcFixXY(), ABOVE, true)"</tt> |
||
292 | <br> |
||
293 | 在后一情形, 函数 CalcFixXY() 返回包含两个数的数组. |
||
294 | </td> |
||
295 | </tr> |
||
296 | <tr bgcolor="#ffffff" valign="top"> |
||
297 | <td> |
||
298 | <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('由于使用了命令 FOLLOWMOUSE 并接着取值 false, 此 tooltip 不会跟随鼠标移动', FOLLOWMOUSE, false, WIDTH, 300);">FOLLOWMOUSE</a></tt> |
||
299 | </td> |
||
300 | <td> |
||
301 | tooltip 跟随鼠标移动. |
||
302 | 取值: true, false. 默认: true. |
||
303 | <br> <br> |
||
304 | 当取值 false 关掉这个命令时, tooltip 不会跟随鼠标移动. |
||
305 | </td> |
||
306 | </tr> |
||
307 | <tr bgcolor="#ffffff" valign="top"> |
||
308 | <td> |
||
309 | <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('改变文字色彩', FONTCOLOR, '#ff0000');">FONTCOLOR</a></tt> |
||
310 | </td> |
||
311 | <td> |
||
312 | 改变文字色彩. |
||
313 | 取值: 包含在单引号里面的 HTML 色彩, 例如 '#990099' |
||
314 | </td> |
||
315 | </tr> |
||
316 | <tr bgcolor="#ffffff" valign="top"> |
||
317 | <td> |
||
318 | <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('改变字体', FONTFACE, 'Courier New, Courier, mono');">FONTFACE</a></tt> |
||
319 | </td> |
||
320 | <td> |
||
321 | 改变字体. |
||
322 | <br> |
||
323 | 取值: |
||
324 | 如同 HTML 或 CSS 里使用的字体名称, 用单引号括起来, 例如 |
||
325 | <tt>Tip('某些文字', FONTFACE, 'Arial, Helvetica, sans-serif', FONTSIZE, '12pt')</tt> |
||
326 | </td> |
||
327 | </tr> |
||
328 | <tr bgcolor="#ffffff" valign="top"> |
||
329 | <td> |
||
330 | <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('改变字体大小', FONTSIZE, '72pt');">FONTSIZE</a></tt> |
||
331 | </td> |
||
332 | <td> |
||
333 | 字体大小. |
||
334 | 取值: 带单位的度量, 用单引号括起来. |
||
335 | 单位可以是 'px', 'pt', 'em' 等. |
||
336 | </td> |
||
337 | </tr> |
||
338 | <tr bgcolor="#ffffff" valign="top"> |
||
339 | <td> |
||
340 | <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('FONTWEIGHT, \'bold\'', FONTWEIGHT, 'bold');">FONTWEIGHT</a></tt> |
||
341 | </td> |
||
342 | <td> |
||
343 | 字体粗细. |
||
344 | 取值: 'normal' 或 'bold', 用单引号括起来. |
||
345 | </td> |
||
346 | </tr> |
||
347 | <tr bgcolor="#ffffff" valign="top"> |
||
348 | <td align="right"> |
||
349 | <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('放在另一侧', LEFT, true);">LEFT</a></tt> |
||
350 | </td> |
||
351 | <td> |
||
352 | 把 tooltip 放在鼠标的左边. |
||
353 | 取值: true, false. |
||
354 | <br> |
||
355 | <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('LEFT 和 ABOVE 联合使用...', LEFT, true, ABOVE, true);">LEFT 和 ABOVE 联合使用</a></tt>. |
||
356 | <br>例: |
||
357 | <br> |
||
358 | <tt><font style="font-size: 12px;" size="2">onmouseover="Tip('某些文字', LEFT, true, ABOVE, true)"</font></tt> |
||
359 | </td> |
||
360 | </tr> |
||
361 | <tr bgcolor="#ffffff" valign="top"> |
||
362 | <td> |
||
363 | <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('增加水平偏移', OFFSETX, 150);">OFFSETX</a></tt> |
||
364 | </td> |
||
365 | <td> |
||
366 | 从鼠标点的水平偏移. |
||
367 | 取值: 任意整数. 也可取负值. |
||
368 | </td> |
||
369 | </tr> |
||
370 | <tr bgcolor="#ffffff" valign="top"> |
||
371 | <td> |
||
372 | <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('增加垂直偏移', OFFSETY, 70);">OFFSETY</a></tt> |
||
373 | </td> |
||
374 | <td> |
||
375 | 从鼠标点的水平偏移. |
||
376 | 取值: 任意整数. 也可取负值. |
||
377 | </td> |
||
378 | </tr> |
||
379 | <tr bgcolor="#ffffff" valign="top"> |
||
380 | <td> |
||
381 | <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('半透明的 tooltip', OPACITY, 70, PADDING, 14);">OPACITY</a></tt> |
||
382 | </td> |
||
383 | <td> |
||
384 | 透明程度. |
||
385 | 取值: 从 0 (完全透明) 到 100 (不透明) 间的整数. |
||
386 | <br> <br> |
||
387 | 不透明度(opacity) = 100 - 透明度 (取百分比).<br> |
||
388 | <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('<img src=../../data/maps/fr.jpg width=130 height=103><br>带有图形、阴影、背景图像以及渐显渐隐效果的 tooltip', WIDTH, 180, OPACITY, 80, TEXTALIGN, 'center', TITLEALIGN, 'center', SHADOW, true, TITLE, '例', BGIMG, '../../data/maps/it.jpg', FADEIN, 700, FADEOUT, 700);">另一例子</a></tt> |
||
389 | 用到了 SHADOW, TEXTALIGN, BGIMG 以及 FADEIN / FADEOUT 命令. <br> <br> |
||
390 | 早于 v.9.0 的 Opera, Safari 的旧版本, 某些版本的 Konqueror 不支持此命令. |
||
391 | </td> |
||
392 | </tr> |
||
393 | <tr bgcolor="#ffffff" valign="top"> |
||
394 | <td> |
||
395 | <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('内容旁有足够铺垫的 tooltip', PADDING, 30);">PADDING</a></tt> |
||
396 | </td> |
||
397 | <td> |
||
398 | 在边界与提示内容间的内部铺垫空间. |
||
399 | 取值: 非负整数. |
||
400 | </td> |
||
401 | </tr> |
||
402 | <tr bgcolor="#ffffff" valign="top"> |
||
403 | <td> |
||
404 | <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('SHADOW, true', SHADOW, true);">SHADOW</a></tt> |
||
405 | </td> |
||
406 | <td> |
||
407 | 带有阴影的 tooltip. |
||
408 | 取值: true, false |
||
409 | </td> |
||
410 | </tr> |
||
411 | <tr bgcolor="#ffffff" valign="top"> |
||
412 | <td> |
||
413 | <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('这个提示有阴影 (SHADOW 命令),<br>而且改变了它的阴影颜色 (SHADOWCOLOR 命令)', PADDING, 8, SHADOW, true, SHADOWCOLOR, '#dd99aa');">SHADOWCOLOR</a></tt> |
||
414 | <!--br> |
||
415 | |||
416 | <form> <select><option>aaa</option><option>bbb</option><option>ccc</option></select></form--> |
||
417 | </td> |
||
418 | <td> |
||
419 | 阴影颜色. |
||
420 | 取值: 放在单引号内部的 HTML 色彩. |
||
421 | <br>例: |
||
422 | <br> |
||
423 | <tt><font style="font-size: 12px;" size="2">onmouseover="Tip('某些文字', SHADOW, true, SHADOWCOLOR, '#dd99aa')"</font></tt> |
||
424 | </td> |
||
425 | </tr> |
||
426 | <tr bgcolor="#ffffff" valign="top"> |
||
427 | <td> |
||
428 | <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('增加阴影宽度', SHADOW, true, SHADOWWIDTH, 10, PADDING, 8);">SHADOWWIDTH</a></tt> |
||
429 | </td> |
||
430 | <td> |
||
431 | 阴影宽度 (偏移). |
||
432 | 取值: 非负整数. |
||
433 | <br>例: |
||
434 | <br> |
||
435 | <tt><font style="font-size: 12px;" size="2">onmouseover="Tip('某些文字', SHADOW, true, SHADOWWIDTH, 7)"</font></tt> |
||
436 | </td> |
||
437 | </tr> |
||
438 | <tr bgcolor="#ffffff" valign="top"> |
||
439 | <td> |
||
440 | <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>页顶<\/a><\/li><li style=\'font-family:Verdana,Geneva,sans-serif;font-size:8pt;\'><a href=\'#docu\'>文件开始<\/a><\/li><\/ul>', STICKY, true, CLICKCLOSE, true, PADDING, 6);">STICKY</a></tt> |
||
441 | </td> |
||
442 | <td> |
||
443 | Tooltip 停留在初始位置直至弹出另一个 tooltip. |
||
444 | 取值: true, false. |
||
445 | <br> <br> |
||
446 | 利用 |
||
447 | <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('STICKY, true, DURATION, 2500<br>这个提示是粘滞的, 但它的生存周期限制在 2.5 秒.', STICKY, true, CLICKCLOSE, true, DURATION, 2500, WIDTH, 280)">DURATION</a></tt> |
||
448 | 你可以让 tooltip 过一段时间后自动消失. |
||
449 | </td> |
||
450 | </tr> |
||
451 | <tr bgcolor="#ffffff" valign="top"> |
||
452 | <td> |
||
453 | <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('TEXTALIGN 命令取值 \'right\', \'center\', \'justify\' 或 \'left\', 最后一个值是多余的, 因为这是默认值.', WIDTH, 200, TITLE, '右端对齐的文字', TEXTALIGN, 'right');">TEXTALIGN</a></tt> |
||
454 | </td> |
||
455 | <td> |
||
456 | 规定提示内容的对齐方式. |
||
457 | 取值: 'right', 'center', |
||
458 | <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('<img align=\'right\' src=\'..\/..\/data\/photos\/small.gif\' width=\'60\' height=\'40\'>这是一段相当长的文字, 它展示了命令 TEXTALIGN 取值 \'justify\' 后的效应. 请注意, 对于行数较少的文字不推荐使用对齐 - 这也是这个 tooltip 的情形, 特别是上面还有一个图像的情形.', TITLE, '文字与图像对齐', TEXTALIGN, 'justify', WIDTH, 250);">'justify'</a></tt> |
||
459 | 或 'left'. |
||
460 | <br>例: |
||
461 | <br> |
||
462 | <tt><font style="font-size: 12px;" size="2">onmouseover="Tip('某些文字', TEXTALIGN, 'right')"</font></tt> |
||
463 | </td> |
||
464 | </tr> |
||
465 | <tr bgcolor="#ffffff" valign="top"> |
||
466 | <td> |
||
467 | <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('TITLE, \'某个标题\'', TITLE, '某个标题');">TITLE</a></tt> |
||
468 | </td> |
||
469 | <td> |
||
470 | 显示标题栏. |
||
471 | 取值: 放在单引号里面的标题文本. |
||
472 | 可以包含 HTML, 它使你在设计标题栏时有更多的自由度. |
||
473 | </td> |
||
474 | </tr> |
||
475 | <tr bgcolor="#ffffff" valign="top"> |
||
476 | <td> |
||
477 | <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('TITLEALIGN 命令可取值 \'right\', \'justify\' 或 \'left\', 最后的值是多余的, 因为这是默认值.', WIDTH, 240, TITLE, '右端对齐的标题', TITLEALIGN, 'right');">TITLEALIGN</a></tt> |
||
478 | </td> |
||
479 | <td> |
||
480 | 标题栏内文字的对齐方式. |
||
481 | 取值: 'right', 'center', 'justify' 或 'left' |
||
482 | </td> |
||
483 | </tr> |
||
484 | <tr bgcolor="#ffffff" valign="top"> |
||
485 | <td> |
||
486 | <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('TITLEBGCOLOR, \'#990099\'', TITLE, '标题背景色', TITLEBGCOLOR, '#990099');">TITLEBGCOLOR</a></tt> |
||
487 | </td> |
||
488 | <td> |
||
489 | 标题栏的背景色. |
||
490 | 取值: 放在单引号里面的 HTML 颜色. |
||
491 | 如果它取空串 <tt>''</tt>, |
||
492 | 则使用边界的颜色 (参见 BORDERCOLOR 命令), 这也是默认值. |
||
493 | </td> |
||
494 | </tr> |
||
495 | <tr bgcolor="#ffffff" valign="top"> |
||
496 | <td> |
||
497 | <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('TITLEFONTCOLOR, \'#ff6666\'', TITLE, '红色标题', TITLEFONTCOLOR, '#ff6666');">TITLEFONTCOLOR</a></tt> |
||
498 | </td> |
||
499 | <td> |
||
500 | 标题文字的颜色. |
||
501 | 取值: 放在单引号里面的 HTML 颜色. |
||
502 | 如果它取空串 <tt>''</tt>, |
||
503 | 则使用 tooltip 主体的背景色 (参见 BGCOLOR 命令), 这也是默认值. |
||
504 | </td> |
||
505 | </tr> |
||
506 | <tr bgcolor="#ffffff" valign="top"> |
||
507 | <td> |
||
508 | <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('TITLEFONTFACE, \'Courier New, Courier, mono\'', TITLE, '改变标题字体', TITLEFONTFACE, 'Courier New, Courier, mono');">TITLEFONTFACE</a></tt> |
||
509 | </td> |
||
510 | <td> |
||
511 | 标题字体. |
||
512 | 取值: 放在单引号里面的 HTML 或 CSS 格式. |
||
513 | 如果它取空串 <tt>''</tt>, 则使用 tooltip 主体的字体, 这也是默认值. |
||
514 | <br> |
||
515 | 例: |
||
516 | <br> |
||
517 | <tt><font style="font-size: 12px;" size="2">onmouseover="Tip('某些文字', TITLE, '某个标题', TITLEFONTFACE, 'Verdana,sans-serif')"</font></tt> |
||
518 | <br> |
||
519 | </td> |
||
520 | </tr> |
||
521 | <tr bgcolor="#ffffff" valign="top"> |
||
522 | <td> |
||
523 | <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('TITLEFONTSIZE, \'18pt\'', TITLE, '大标题', TITLEFONTSIZE, '18pt');">TITLEFONTSIZE</a></tt> |
||
524 | </td> |
||
525 | <td> |
||
526 | 标题字体大小. |
||
527 | 取值: 放在单引号里面的带单位的度量. |
||
528 | 单位可取 'px', 'pt', 'em' 等. |
||
529 | 如果它取空串 <tt>''</tt>, 则使用 tooltip 主体的字体大小. |
||
530 | </td> |
||
531 | </tr> |
||
532 | <tr bgcolor="#ffffff" valign="top"> |
||
533 | <td> |
||
534 | <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('WIDTH, 200', WIDTH, 200);">WIDTH</a></tt> |
||
535 | </td> |
||
536 | <td> |
||
537 | 宽度. |
||
538 | 取值: 非负整数. |
||
539 | 若取默认值 0, 宽度将根据 tooltip 的内容自动调整. |
||
540 | <br> <br> |
||
541 | 注意 tooltip 遵从 W3C box 模式, |
||
542 | 也就是被指定的宽度仅应用于 tooltip 的实际内容, |
||
543 | 不包含铺垫 (见 PADDING 命令), 边界及阴影. |
||
544 | </td> |
||
545 | </tr> |
||
546 | </tbody></table> |
||
547 | </td> |
||
548 | </tr> |
||
549 | </tbody></table> |
||
550 | </td> |
||
551 | <td width="50"><br></td> |
||
552 | </tr> |
||
553 | </tbody></table> |
||
554 |