|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之带注释的表格菜单特效
一：将下面的代码放在<HEAD>与</HEAD>之间
* G* w$ T% b0 e" @! m7 O# Z, M<SCRIPT language=javascript >8 o! B+ ]$ [5 x4 P8 i
document.write(/ f" J) a9 Y# i( B
"<div id=\"tooltip\" style=\"position:absolute;visibility:hidden; padding:3px;border:1px solid #528AC6;\
5 n; Z. n; d# g4 i, w;background-color:#ffdfd0; height: 19px; left: 77px; top: 96px\"></div>");4 M" p& l4 m4 Q; D% w. k& | K1 r
6 Z6 ^ k) _3 s# Y$ _% g# Lfunction showtip(text) //显示链接的说明
+ b5 u+ Y7 n' Y# ?2 j+ ~& d" l{; n9 Y' x3 E: u# B0 j9 V |! j* h5 e
if (document.all&&document.readyState=="complete") //针对IE
; V9 Y( U' h5 B {
* q7 `( ?, X+ h# G4 B0 r& z 0 N" `$ r4 F) [' f6 I% e, m8 x
document.all.tooltip.innerHTML="<div vAlign=center><font SIZE=2>"+text+"</font></div>";
# j1 ?/ Z6 m8 U6 ]0 d& c, Z document.all.tooltip.style.pixelLeft=event.clientX+document.body.scrollLeft+10;. X' Q( R0 y8 ~
document.all.tooltip.style.pixelTop=event.clientY+document.body.scrollTop+10;
' P. K* P/ P, J document.all.tooltip.style.visibility="visible";
1 J) o- `5 E0 K( O }' v+ Y0 b; s; P. N' \4 ]
}
/ p% w O& O+ B) F& w/ P# K" h9 W* l3 O& H: E2 O6 _5 V% P
function hidetip() 7 I8 S- D/ C8 M2 g
{
8 n0 C+ J0 u$ u) A3 oif (document.all)
4 k$ ?/ B" f6 q4 _0 F document.all.tooltip.style.visibility="hidden";1 R+ n5 Z( i) T
}
/ R: z% \( e* w+ U @) Q0 [8 q: B) F6 _# Z
function setcolor(fntcolor,bgcolor) o" k5 X! v( ?* ]' @9 k* l
{ v+ a6 z, Z& O
document.all.tooltip.style.bgcolor=bgcolor;6 D- F1 T: X- |3 P$ v8 h6 C
document.all.tooltip.innerHTML.Color = fntcolor;
' y, h& ]' n) t' d/ \# T2 l, \}
# N1 A3 o* P" ~7 K
. T: M+ Z' U* n- z% _/ V7 {# c/ Yfunction showhint(text)
6 ]0 Z+ P8 Q7 I{
$ B) c( X4 S9 S f: O8 c onmousemove=showtip(text);- I; F: V' j! h) m5 d
onmouseover=showtip(text);
* z' e0 m0 Q' g" {5 C* E6 c onmouseout=hidetip();1 b" b' t* ]! z$ E
}0 r# N' |8 J) @/ L! Q8 C
</SCRIPT>- w$ M# g* a- _
6 M, o3 N( f; F: V' @
1 L8 f: x$ @+ T2 g
9 r6 y8 A% p7 k7 W/ d& j2 N6 W( y: R" h( ?
9 d6 M$ \) h& A) i/ d, p
% \. O+ r7 X% j! h* \0 k
二：将下面的代码复制到〈BODY〉区
) J' H* k1 X9 C" ^<table align=center border=1 bordercolordark=#ffffff bordercolorlight=#a8cbf1 / H6 E& G2 P1 y" M! i& n3 J
cellspacing=0 class=t width="300" bordercolor="#6699CC" cellpadding="0">
" K. d' z) s+ }3 ` <tbody> 0 P0 K1 L- y5 I( o2 @
<tr align="center" bgcolor="#ffdfd0"> * L$ }1 }; c* x, Q: {9 @" y! \
<td height=9 width="25%" class="css3"><a href="../../sbtx.html" onMouseMove="showtip('赏心悦目<br>精美的图像和壁纸能使你得到一些放松！')" onMouseOut=hidetip()
3 r/ V# w: X5 v* G target=_blank>赏心悦目</a></td>
. S) j9 Z" G) C H2 T5 }( N" t; p <td height=9 width="25%" class="css3"><a href="../../flashmenu1.htm" onMouseMove="showtip('网页素材<br>大量的网页素材给你的网页制作提供方便！')" 7 D" ^5 G3 h7 A/ y2 D$ Q2 H. x
onMouseOut=hidetip()>网页素材</a></td>. M9 m1 N- r1 q
<td height=9 width="25%" class="css3"><a href="../../wyjcs.html" onMouseMove="showtip('图像处理<br>图形软件的使用以及图像的特效制作')" onMouseOut=hidetip()
# I( c; B+ I% U2 Z. v target=_blank>图像处理</a></td>1 f8 u: U. i0 K: R
<td height=9 width="25%" class="css3"><a href="../../soft.htm" onMouseMove="showtip('网页特效<br>网页特效的大宝库，有详细的使用说明')" onMouseOut=hidetip() T* B$ }, n. l+ a- N1 f6 D- `" l
target=_blank>网页特效</a></td>" P6 B: ^ w7 [
</tr>
* W! R) _0 T4 W+ u& i0 o& d! V </tbody> : G- S3 V! R. K$ q. }
</table> |
|
发表于 2008-1-21 20:52
|