Rev 2071 | Details | Compare with Previous | 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> |
||
| 5787 | bpr | 35 | <td width="50"><br/></td> |
| 2071 | zjchen | 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. |
||
| 5787 | bpr | 52 | <br/> <br/> |
| 2071 | zjchen | 53 | 与 |
| 5787 | bpr | 54 | <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('此处用了以下命令:<br/>ABOVE, true, OFFSETY, 50', ABOVE,true,OFFSETY,50);">OFFSETY</a></tt> |
| 2071 | zjchen | 55 | 联用可调节到鼠标点的垂直距离, |
| 56 | 或用 |
||
| 5787 | bpr | 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> |
| 2071 | zjchen | 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> 表示 |
||
| 5787 | bpr | 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/> |
||
| 2071 | zjchen | 72 | <tt><font style="font-size: 12px;" size="2">onmouseover="Tip('某些文字', BGCOLOR, '#D3E3F6')"</font></tt> |
| 5787 | bpr | 73 | <br/>or<br/> |
| 2071 | zjchen | 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 | 取值: 用单引号括起来的到图像的路径. |
||
| 5787 | bpr | 84 | <br/>例: |
| 85 | <br/> |
||
| 2071 | zjchen | 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 表示无框. |
||
| 5787 | bpr | 115 | <br/>例: |
| 116 | <br/> |
||
| 2071 | zjchen | 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 命令设定. |
||
| 5787 | bpr | 128 | <br/>例: |
| 129 | <br/> |
||
| 2071 | zjchen | 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 | 关闭按钮的颜色. |
||
| 5787 | bpr | 157 | <br/> <br/> |
| 2071 | zjchen | 158 | 其取值必须是用逗号分隔的 4 个颜色值. 每个颜色放在一对单引号内. |
| 159 | 整个数组用一对方括号括起来, 参见下例. |
||
| 5787 | bpr | 160 | 4 个颜色参数的含义如下 : <br/> |
| 2071 | zjchen | 161 | 1. 背景色 |
| 5787 | bpr | 162 | <br/> |
| 2071 | zjchen | 163 | 2. 文字色 |
| 5787 | bpr | 164 | <br/> |
| 2071 | zjchen | 165 | 3. 当鼠标移至按钮上面时, 加亮的背景色 |
| 5787 | bpr | 166 | <br/> |
| 2071 | zjchen | 167 | 4. 当鼠标移至按钮上面时, 加亮的文字色 |
| 5787 | bpr | 168 | <br/> |
| 2071 | zjchen | 169 | 可以用空串 <tt>''</tt> 作为颜色参数, |
| 170 | 此时分别使用标题栏的背景色或文字色作为按钮的颜色. |
||
| 5787 | bpr | 171 | <br/> <br/> |
| 172 | 例:<br/> |
||
| 2071 | zjchen | 173 | <tt><font class="tt" size="2">Tip('文字', CLOSEBTN, true, CLOSEBTNCOLORS, ['', '#66ff66', 'white', '#00cc00'], STICKY, true)</font></tt> |
| 5787 | bpr | 174 | <br/> |
| 2071 | zjchen | 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 | 例: |
||
| 5787 | bpr | 186 | <br/> |
| 2071 | zjchen | 187 | <tt><font class="tt" size="2">Tip('Tooltip 文字', CLOSEBTN, true, CLOSEBTNTEXT, '点击这里', STICKY, true)</font></tt> |
| 5787 | bpr | 188 | <br/> |
| 2071 | zjchen | 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 时. |
||
| 5787 | bpr | 201 | <br/> |
| 2071 | zjchen | 202 | 取值: true, false. |
| 5787 | bpr | 203 | <br/> |
| 2071 | zjchen | 204 | 若是 true (这是 wz_tooltip.js 里预置的默认值), HTML 的仅仅一段文字(或内部 HTML)被插入 tooltip. |
| 205 | 若是 false, 整个 HTML 元素(它的 DOM 结点)被暂时转换成一个 tooltip， |
||
| 5787 | bpr | 206 | 这在以下情形可能有用:<br/> 1) 如果转换成 tooltip 的 HTML 元素包含输入表格, |
| 207 | 那么即使 tooltip 没有显示, 当前用户仍能输入. <br/> |
||
| 2071 | zjchen | 208 | 2) tooltip 继承 HTML 元素的格式性质. |
| 5787 | bpr | 209 | <br/> |
| 2071 | zjchen | 210 | 下例显示通过运用 COPYCONTENT 并设值为 <tt>false</tt>, 如何把一个 HTML 元素全部转换成 tooltip: |
| 5787 | bpr | 211 | <br/> |
| 2071 | zjchen | 212 | <tt><font class="tt" size="2">TagToTip('某个识别符id', COPYCONTENT, false, BORDERWIDTH, 0, PADDING, 0)</font></tt> |
| 5787 | bpr | 213 | <br/> |
| 2071 | zjchen | 214 | 这个例子关闭了 tooltip 的自然边框 (BORDERWIDTH, 0), |
| 215 | 并把 tooltip 的自然铺垫设成零, 这样就只显示 HTML 元素本身设定的边框及铺垫.</td> |
||
| 216 | </tr> |
||
| 217 | <tr bgcolor="#ffffff" valign="top"> |
||
| 218 | <td> |
||
| 5787 | bpr | 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> |
| 2071 | zjchen | 220 | </td> |
| 221 | <td> |
||
| 222 | 经一段延迟后才显示 tooltip, 以毫秒为单位. |
||
| 5787 | bpr | 223 | <br/> |
| 2071 | zjchen | 224 | 取值: |
| 225 | 非负整数. 0 意为无延迟. |
||
| 226 | 在 wz_tooltip.js 预置为 400. |
||
| 5787 | bpr | 227 | <br/>例: |
| 228 | <br/> |
||
| 2071 | zjchen | 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 | 本命令仍然起作用. |
||
| 5787 | bpr | 240 | <br/> |
| 2071 | zjchen | 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 | |||
| 5787 | bpr | 254 | <br/> <br/> |
| 2071 | zjchen | 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 | |||
| 5787 | bpr | 267 | <br/> <br/> |
| 2071 | zjchen | 268 | 推荐: 与 |
| 5787 | bpr | 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/> |
||
| 2071 | zjchen | 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 | 取值: 用方括号括起来的一对整数. |
||
| 5787 | bpr | 282 | 例:<br/> |
| 2071 | zjchen | 283 | <tt>onmouseover="Tip('某些文字', FIX, [230, 874])"</tt> |
| 5787 | bpr | 284 | <br/> |
| 2071 | zjchen | 285 | 你也可以调用其它地方定义的函数动态地计算坐标: |
| 5787 | bpr | 286 | <br/> |
| 2071 | zjchen | 287 | <tt>onmouseover="Tip('文字', FIX, [CalcFixX(), CalcFixY()], BORDERWIDTH, 2)"</tt> |
| 5787 | bpr | 288 | <br/> |
| 2071 | zjchen | 289 | 或 |
| 5787 | bpr | 290 | <br/> |
| 2071 | zjchen | 291 | <tt>onmouseover="Tip('文字', FIX, CalcFixXY(), ABOVE, true)"</tt> |
| 5787 | bpr | 292 | <br/> |
| 2071 | zjchen | 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. |
||
| 5787 | bpr | 303 | <br/> <br/> |
| 2071 | zjchen | 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 | 改变字体. |
||
| 5787 | bpr | 322 | <br/> |
| 2071 | zjchen | 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. |
||
| 5787 | bpr | 354 | <br/> |
| 2071 | zjchen | 355 | <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('LEFT 和 ABOVE 联合使用...', LEFT, true, ABOVE, true);">LEFT 和 ABOVE 联合使用</a></tt>. |
| 5787 | bpr | 356 | <br/>例: |
| 357 | <br/> |
||
| 2071 | zjchen | 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 (不透明) 间的整数. |
||
| 5787 | bpr | 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/> |
||
| 2071 | zjchen | 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> |
||
| 5787 | bpr | 413 | <tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('这个提示有阴影 (SHADOW 命令),<br/>而且改变了它的阴影颜色 (SHADOWCOLOR 命令)', PADDING, 8, SHADOW, true, SHADOWCOLOR, '#dd99aa');">SHADOWCOLOR</a></tt> |
| 2071 | zjchen | 414 | <!--br> |
| 415 | |||
| 416 | <form> <select><option>aaa</option><option>bbb</option><option>ccc</option></select></form--> |
||
| 417 | </td> |
||
| 418 | <td> |
||
| 419 | 阴影颜色. |
||
| 420 | 取值: 放在单引号内部的 HTML 色彩. |
||
| 5787 | bpr | 421 | <br/>例: |
| 422 | <br/> |
||
| 2071 | zjchen | 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 | 取值: 非负整数. |
||
| 5787 | bpr | 433 | <br/>例: |
| 434 | <br/> |
||
| 2071 | zjchen | 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. |
||
| 5787 | bpr | 445 | <br/> <br/> |
| 2071 | zjchen | 446 | 利用 |
| 5787 | bpr | 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> |
| 2071 | zjchen | 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', |
||
| 5787 | bpr | 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> |
| 2071 | zjchen | 459 | 或 'left'. |
| 5787 | bpr | 460 | <br/>例: |
| 461 | <br/> |
||
| 2071 | zjchen | 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 主体的字体, 这也是默认值. |
||
| 5787 | bpr | 514 | <br/> |
| 2071 | zjchen | 515 | 例: |
| 5787 | bpr | 516 | <br/> |
| 2071 | zjchen | 517 | <tt><font style="font-size: 12px;" size="2">onmouseover="Tip('某些文字', TITLE, '某个标题', TITLEFONTFACE, 'Verdana,sans-serif')"</font></tt> |
| 5787 | bpr | 518 | <br/> |
| 2071 | zjchen | 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 的内容自动调整. |
||
| 5787 | bpr | 540 | <br/> <br/> |
| 2071 | zjchen | 541 | 注意 tooltip 遵从 W3C box 模式, |
| 542 | 也就是被指定的宽度仅应用于 tooltip 的实际内容, |
||
| 543 | 不包含铺垫 (见 PADDING 命令), 边界及阴影. |
||
| 544 | </td> |
||
| 545 | </tr> |
||
| 546 | </tbody></table> |
||
| 547 | </td> |
||
| 548 | </tr> |
||
| 549 | </tbody></table> |
||
| 550 | </td> |
||
| 5787 | bpr | 551 | <td width="50"><br/></td> |
| 2071 | zjchen | 552 | </tr> |
| 553 | </tbody></table> |
||
| 554 |