|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之带注释的表格菜单特效
一：将下面的代码放在<HEAD>与</HEAD>之间 o/ f& E% L) K
<SCRIPT language=javascript >
' O; h Z M. [3 T5 ^2 V1 ?; Xdocument.write(
: h& C0 y0 ], K"<div id=\"tooltip\" style=\"position:absolute;visibility:hidden; padding:3px;border:1px solid #528AC6;\
]+ {7 D ? j; j, z;background-color:#ffdfd0; height: 19px; left: 77px; top: 96px\"></div>");6 @' }! g5 x7 D$ f+ n
7 x/ n6 Y$ `5 [, U# kfunction showtip(text) //显示链接的说明6 A) {* L% A" a4 O
{0 o9 ?, e4 d6 r5 d/ C( j, `: H: \
if (document.all&&document.readyState=="complete") //针对IE, r4 Z* Q, M% q3 O
{
- P+ a: j r3 ?
3 V. q: d n& W9 X document.all.tooltip.innerHTML="<div vAlign=center><font SIZE=2>"+text+"</font></div>";3 S# h; ?( p+ o5 o
document.all.tooltip.style.pixelLeft=event.clientX+document.body.scrollLeft+10;
' d" P) d4 \+ I4 Q% s document.all.tooltip.style.pixelTop=event.clientY+document.body.scrollTop+10;
& L N# e4 Y" e" `4 W% ~ document.all.tooltip.style.visibility="visible";
3 {8 p1 P& _$ l% ~ }
% M3 i0 U6 d. J3 B" o}8 p# f7 j, L% E! f; x P- k
R- x! H( p# {. a' `" t
function hidetip()
9 A1 \3 K* S, s* V6 ]4 ^{+ g3 }$ k4 q# z9 q, [
if (document.all)
2 R! B% _3 G4 I4 Z9 s document.all.tooltip.style.visibility="hidden";% G3 W4 C& r1 x% C
} Z4 J. R o+ y0 w* U5 b) l
1 f- k. s5 Y/ [* nfunction setcolor(fntcolor,bgcolor)
4 n* F. f& K4 o' m/ G) B{
& f( m# ]8 P3 a document.all.tooltip.style.bgcolor=bgcolor;7 \+ U) V9 r: s ?
document.all.tooltip.innerHTML.Color = fntcolor;
! n5 C% k% V) B8 W- ~}
: B8 {6 _9 F5 a. j* J2 r4 S9 z) R/ K2 s0 I: D: @. Y
function showhint(text)
0 A, N- i) G# w/ H1 }0 T{# O5 f" Y( u2 T0 j+ Q
onmousemove=showtip(text);; |, e0 D0 F0 v0 @- g- p
onmouseover=showtip(text);( R3 p$ r* V4 {4 q3 J$ \. v' P
onmouseout=hidetip();* C4 {) F" k) ~4 P* k! r
}
9 M2 g; m3 E$ f</SCRIPT>
% a. W' B3 ?2 h7 k% e
# j: k( i! s1 V
$ ]$ C: }: z5 O7 G, b) T$ T+ o- o* L' B( F
S$ u/ s5 |7 k, r6 Q
7 h# c4 s7 Y* M3 H% C: x
' b; o6 R# |% N6 h3 I0 c二：将下面的代码复制到〈BODY〉区
k0 x' v/ J, s' K<table align=center border=1 bordercolordark=#ffffff bordercolorlight=#a8cbf1
4 j1 @, o& R+ ~4 L0 e5 b5 \! W" pcellspacing=0 class=t width="300" bordercolor="#6699CC" cellpadding="0">
- j/ S7 K! y8 h5 L1 X <tbody>
) O( l& G* m1 C+ r% \ k <tr align="center" bgcolor="#ffdfd0"> * h1 Y, Y! G# Z1 ~' x1 ?
<td height=9 width="25%" class="css3"><a href="../../sbtx.html" onMouseMove="showtip('赏心悦目<br>精美的图像和壁纸能使你得到一些放松！')" onMouseOut=hidetip()
8 e8 U6 A# h, \ target=_blank>赏心悦目</a></td>9 ?! o5 v6 F/ q
<td height=9 width="25%" class="css3"><a href="../../flashmenu1.htm" onMouseMove="showtip('网页素材<br>大量的网页素材给你的网页制作提供方便！')" 9 X0 f m, s, `0 q9 m V' d+ F
onMouseOut=hidetip()>网页素材</a></td>
5 P& K, T( H8 E$ q. X <td height=9 width="25%" class="css3"><a href="../../wyjcs.html" onMouseMove="showtip('图像处理<br>图形软件的使用以及图像的特效制作')" onMouseOut=hidetip()
9 c( S# u, Q* J/ D1 E u target=_blank>图像处理</a></td>
9 E+ j' { q0 P <td height=9 width="25%" class="css3"><a href="../../soft.htm" onMouseMove="showtip('网页特效<br>网页特效的大宝库，有详细的使用说明')" onMouseOut=hidetip() $ w" p$ F) v0 h6 I! F( Q
target=_blank>网页特效</a></td>0 S% S: T4 j; h! O7 `) b3 B" k" o
</tr>
' \ L/ H) |) J k/ ] </tbody> - _% n6 A! `9 @+ z9 w) V. Y. l
</table> |
|
发表于 2008-1-21 20:52
|