|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之带注释的表格菜单特效
一：将下面的代码放在<HEAD>与</HEAD>之间$ \0 R4 d' K& e
<SCRIPT language=javascript >
3 `! U8 Z2 F9 ?5 y2 j' z' I! i, Z+ Vdocument.write(, w" P4 C4 a" x* u1 O" r
"<div id=\"tooltip\" style=\"position:absolute;visibility:hidden; padding:3px;border:1px solid #528AC6;\
5 h3 B$ v& h9 `0 N2 h% A. o9 N( r;background-color:#ffdfd0; height: 19px; left: 77px; top: 96px\"></div>");
5 S% W4 Y& c, ^# j' l# U- t+ I1 F5 n" R. p7 ]
function showtip(text) //显示链接的说明
0 k* z/ E7 H: g( u{
' R8 q7 G! x: ^* \6 v, M if (document.all&&document.readyState=="complete") //针对IE& {9 ~* {0 V- p# U! Q+ |! P5 Y
{3 e' b4 v7 V; ?! d+ s
2 ~( I) W' s: H# s( B# z9 i$ Z( |2 ^ document.all.tooltip.innerHTML="<div vAlign=center><font SIZE=2>"+text+"</font></div>";
+ j0 v; N/ |. v; B! {& d document.all.tooltip.style.pixelLeft=event.clientX+document.body.scrollLeft+10;
' c' |& C) x9 G1 Q j document.all.tooltip.style.pixelTop=event.clientY+document.body.scrollTop+10;
$ w/ W X$ X6 u# P. ^: y document.all.tooltip.style.visibility="visible";
0 V1 R# `0 `. n! O* h7 H Z" _ }
; V& I1 Q" o# H9 a}& U7 b' X( s: z/ ^( y
) j+ J* L$ M( [: N6 L9 z+ T
function hidetip()
- K& z* G: f* ?{
# q% ?5 f& \. Iif (document.all)
! @5 A" q3 Q/ J& F) d+ N document.all.tooltip.style.visibility="hidden";
* J9 ^* e/ }8 \! J7 t}+ J( w- Q2 h3 A# M9 o" i
; C3 N9 d& c& Z0 Z4 z0 f
function setcolor(fntcolor,bgcolor)! q4 o; W* B: }; w( s; g
{" s0 ?, c& c+ k n3 u N
document.all.tooltip.style.bgcolor=bgcolor;* t* F/ {2 x; _' S* |# S
document.all.tooltip.innerHTML.Color = fntcolor;$ U9 D3 ?1 Q$ }8 P+ K+ [2 X: w
}
0 }5 R6 o7 ~: ^) Q6 H. v, P. J& Q. Z
function showhint(text)% ?- y# Y9 b) f$ k
{- ^. ^& x4 Z" J6 B
onmousemove=showtip(text);
1 Q% q$ K# v, R, f onmouseover=showtip(text);
" q/ ?2 l' i& `- A/ ` onmouseout=hidetip();" c$ @# P# Q& x3 j( ~, ]
}, f& ~% c* m' l `' [! f9 @6 r- l9 O
</SCRIPT>
/ v4 Z" p9 {" ]+ X) A" }( F7 M- I/ X2 x0 I% L- L5 l
5 s* [. `; }- D+ ]5 K9 I% Y7 f2 e! f% u. q6 P
$ X. w J, q) @) \7 K
( S/ h J% ^3 W7 r ? Z; c4 K8 o8 ~) d: A% E# L2 i
二：将下面的代码复制到〈BODY〉区
1 D& _( L8 E3 G) B P( `# E<table align=center border=1 bordercolordark=#ffffff bordercolorlight=#a8cbf1
/ E* A7 K2 J( L; I" Icellspacing=0 class=t width="300" bordercolor="#6699CC" cellpadding="0">
# t+ ~- m% A. s) s8 e; p2 ~+ U: l7 |; h <tbody> . j: F' P" I( t7 Y) g, F
<tr align="center" bgcolor="#ffdfd0"> 9 e R- D" \4 R' l- H6 A5 ?
<td height=9 width="25%" class="css3"><a href="../../sbtx.html" onMouseMove="showtip('赏心悦目<br>精美的图像和壁纸能使你得到一些放松！')" onMouseOut=hidetip() ) w- _! @7 J) J. d) D$ E* T5 {" L
target=_blank>赏心悦目</a></td>2 I, a0 U4 B6 V3 J" }: K" X2 Z
<td height=9 width="25%" class="css3"><a href="../../flashmenu1.htm" onMouseMove="showtip('网页素材<br>大量的网页素材给你的网页制作提供方便！')" 2 H# f# P. P$ Y- R$ i
onMouseOut=hidetip()>网页素材</a></td>7 y. r7 _ E5 i2 ~+ y+ R
<td height=9 width="25%" class="css3"><a href="../../wyjcs.html" onMouseMove="showtip('图像处理<br>图形软件的使用以及图像的特效制作')" onMouseOut=hidetip() 1 \- J2 n# D- Z% r4 D/ c
target=_blank>图像处理</a></td>2 Z/ J; w8 O) G8 V3 y# }* r9 O" J
<td height=9 width="25%" class="css3"><a href="../../soft.htm" onMouseMove="showtip('网页特效<br>网页特效的大宝库，有详细的使用说明')" onMouseOut=hidetip()
4 I8 Y+ \3 j2 ?& T" j2 {) v target=_blank>网页特效</a></td>" U& Q2 D9 z$ H8 s e: G9 T9 z) J- i
</tr># a. n8 A. m2 p* r7 {& o
</tbody>
3 F. W& E3 }% c$ T </table> |
|
发表于 2008-1-21 20:52
|