|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之带注释的表格菜单特效
一：将下面的代码放在<HEAD>与</HEAD>之间
# k6 l8 Y. n- c$ v<SCRIPT language=javascript >
. ]2 f. G: U$ u& l9 A. s+ u0 ~document.write(( i& u$ v# k: p, _0 L
"<div id=\"tooltip\" style=\"position:absolute;visibility:hidden; padding:3px;border:1px solid #528AC6;\" C/ g. A; u7 E
;background-color:#ffdfd0; height: 19px; left: 77px; top: 96px\"></div>");! T1 F9 s: B9 r6 W& P& p9 d/ t0 L
6 E% a# Q- `8 l H# l6 d- y1 _
function showtip(text) //显示链接的说明
2 }4 k8 a1 O5 Q& u{: [* X: b- J1 [) p
if (document.all&&document.readyState=="complete") //针对IE
" u# |# t. a8 f2 w6 e {6 H4 B6 g9 D9 x3 f6 L! Z: `
& m4 c& Z& h7 w
document.all.tooltip.innerHTML="<div vAlign=center><font SIZE=2>"+text+"</font></div>";
8 m- A* U7 y. d* v2 Q" J% @ document.all.tooltip.style.pixelLeft=event.clientX+document.body.scrollLeft+10;* f+ \, j9 R: S( }9 Q# m1 ]
document.all.tooltip.style.pixelTop=event.clientY+document.body.scrollTop+10;( a$ O, v2 O% j' H' T& P9 W! ]
document.all.tooltip.style.visibility="visible";
6 V8 q$ g# s" J9 g1 t) q: { }$ [9 e8 e2 K: {" q
}; f6 k* k. ]! v
6 @: R1 v2 c8 u( G
function hidetip()
7 p% H5 I3 m8 c' d: m$ Q1 X/ \{6 k; c0 N3 t9 z) G4 q$ P c
if (document.all)
5 R% a; h8 k0 }2 M document.all.tooltip.style.visibility="hidden";
0 O$ O/ Z" w5 J' b}9 A5 I( S) i: `3 y2 b/ u* A
) W6 @6 C/ u3 H3 Z9 U: {function setcolor(fntcolor,bgcolor)
# |4 j3 g+ P% h{! ^. z" r' z& k% O5 W
document.all.tooltip.style.bgcolor=bgcolor;% M. |4 x2 @* `# d( N" q
document.all.tooltip.innerHTML.Color = fntcolor;
' d1 D, P' Y: X}
: N* y1 v5 B( M' B+ G+ q u6 F
7 z& A) G' d' K6 F# P! F0 k) Zfunction showhint(text)
& p/ L3 B" A9 K5 Z/ R9 ]( D5 ^( Y{
4 o. A1 P K' [3 @1 s% J: Q% v1 P onmousemove=showtip(text);, q) O4 `9 r' f- n a1 }/ T: w
onmouseover=showtip(text);
) i( [3 t% P; p. {% m) b onmouseout=hidetip();
* S r: o7 V, p3 ?7 }, ~' X}
+ r0 T$ l9 J7 x8 W! v</SCRIPT>; f4 F( \( Y) w$ I5 B/ o( A) {
# o2 C0 _- d W0 {. g$ C5 |9 p' }$ z; q8 H
' e. @( V. r' b: z8 n
$ t4 P, A: d5 Y2 N: ^6 c
) M8 o# C$ R7 T7 ~
' ]$ A( P# n$ v; d' I4 p
5 q+ w0 a( I, w$ Z/ E
二：将下面的代码复制到〈BODY〉区. }& l0 a- ^. ]) _; Z
<table align=center border=1 bordercolordark=#ffffff bordercolorlight=#a8cbf1 7 h/ u- M0 j( t ~( H
cellspacing=0 class=t width="300" bordercolor="#6699CC" cellpadding="0"># {" o Q2 E& F
<tbody>
4 [- q) p. X5 e: G# I7 z6 Y <tr align="center" bgcolor="#ffdfd0">
, K! i$ x6 W/ W( I/ P <td height=9 width="25%" class="css3"><a href="../../sbtx.html" onMouseMove="showtip('赏心悦目<br>精美的图像和壁纸能使你得到一些放松！')" onMouseOut=hidetip()
6 z# k8 C8 c1 @7 j2 i+ y target=_blank>赏心悦目</a></td>
' k) U* E; A: E8 k0 e, m# E+ N <td height=9 width="25%" class="css3"><a href="../../flashmenu1.htm" onMouseMove="showtip('网页素材<br>大量的网页素材给你的网页制作提供方便！')" 2 Z' `" U& L2 a/ ]+ |0 M; y
onMouseOut=hidetip()>网页素材</a></td>
# L( g" J; r" W% ?1 R9 Q# o, i6 D <td height=9 width="25%" class="css3"><a href="../../wyjcs.html" onMouseMove="showtip('图像处理<br>图形软件的使用以及图像的特效制作')" onMouseOut=hidetip() ( t5 X) V+ p5 r- P
target=_blank>图像处理</a></td>
/ k! c/ k* R* z. X+ u2 E% j% f; S! w <td height=9 width="25%" class="css3"><a href="../../soft.htm" onMouseMove="showtip('网页特效<br>网页特效的大宝库，有详细的使用说明')" onMouseOut=hidetip() E' r0 U7 b0 }6 P8 g; t( z' E
target=_blank>网页特效</a></td>* r) n @) x/ z2 L0 g) s* Q
</tr>
) j. j% q/ z1 F7 f </tbody> 9 P6 \; n; [& E$ y. o& P5 f
</table> |
|
发表于 2008-1-21 20:52
|