|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之带注释的表格菜单特效
一：将下面的代码放在<HEAD>与</HEAD>之间( k; h( B$ B2 W- x' b3 F/ ]
<SCRIPT language=javascript >
( P, Y0 f H( x; ]2 Gdocument.write(0 @! |9 x0 _- W n R1 b
"<div id=\"tooltip\" style=\"position:absolute;visibility:hidden; padding:3px;border:1px solid #528AC6;\
- P0 z4 V! E6 W" G;background-color:#ffdfd0; height: 19px; left: 77px; top: 96px\"></div>");& i- v* N% {7 J& H% p
# T w) h8 f k$ Lfunction showtip(text) //显示链接的说明+ T4 O+ P7 W t9 C
{
$ g0 G: [4 x& p4 x* r if (document.all&&document.readyState=="complete") //针对IE1 C- V- p, }# h) P. E% u
{
7 Z/ I( V( w) D! A% b
5 H5 A2 d% O( \' `, E. t' j document.all.tooltip.innerHTML="<div vAlign=center><font SIZE=2>"+text+"</font></div>";- c( n4 s5 y% W+ T, T1 j2 ?
document.all.tooltip.style.pixelLeft=event.clientX+document.body.scrollLeft+10;
% B7 a; r8 y! L& \ document.all.tooltip.style.pixelTop=event.clientY+document.body.scrollTop+10;* j- \0 r- X9 O+ X$ Q% u
document.all.tooltip.style.visibility="visible";% N6 \6 P1 b, [" o* r1 x
}) s" }3 e5 H: F6 S* w7 k
}
4 S0 i/ Y0 w+ L$ U6 `+ s: Y9 m6 i+ E
* J+ ~ j; {: g5 Dfunction hidetip() $ u a3 p6 B0 i1 A7 s* J
{9 |( w- [7 C' Z( A/ p
if (document.all)* c6 h' P- `% v7 W- B
document.all.tooltip.style.visibility="hidden";
* T( O! F5 I$ k \8 C3 j}" ^. ]7 @$ e6 N( N. s! }
1 U5 a3 e6 K3 z- `
function setcolor(fntcolor,bgcolor)- a$ ?8 J' Y1 U0 w, I
{
! R* o6 X: U4 W- K& i: F7 I' U document.all.tooltip.style.bgcolor=bgcolor;( E* Y9 P/ W9 Z$ r
document.all.tooltip.innerHTML.Color = fntcolor;
4 \9 z3 ?7 e1 ~# `/ M}
/ ^9 U7 Q: d/ q! a* A4 w8 q9 Q8 k7 \# W- x( d) N
function showhint(text)
7 V# Q( f7 r, p, L3 z{; [, Q2 [6 f4 {# W
onmousemove=showtip(text);
9 o/ E$ u8 `$ [2 R( v1 [ onmouseover=showtip(text);) m" A& `8 L. h
onmouseout=hidetip();6 A' l+ p9 S% d& U0 X
} a% R4 E5 a/ x
</SCRIPT>
3 m5 u$ ^8 h! _+ Q* J2 F F: e& }9 S2 w* o A- {1 @* J+ G
( i3 q! [. Q, _0 S% F+ y' G, @
. J( ~2 R( w. Z+ ?1 p, I0 k- ~7 y4 F+ \7 N7 U: @% N
3 d3 P7 U) X; _. w9 _& E) J
( d) b w* T$ v, r二：将下面的代码复制到〈BODY〉区
) f7 `. D) V2 a1 z<table align=center border=1 bordercolordark=#ffffff bordercolorlight=#a8cbf1 5 `- ?) w; W) d
cellspacing=0 class=t width="300" bordercolor="#6699CC" cellpadding="0">( ]6 p! N3 `) n. Y
<tbody> 5 R6 J& v% p1 O3 w$ E
<tr align="center" bgcolor="#ffdfd0"> / p0 w) U" T* f# _8 J. R
<td height=9 width="25%" class="css3"><a href="../../sbtx.html" onMouseMove="showtip('赏心悦目<br>精美的图像和壁纸能使你得到一些放松！')" onMouseOut=hidetip()
+ A9 f' |5 q( p2 ]2 e( D. F target=_blank>赏心悦目</a></td>& R* q. l) \: N% H7 W
<td height=9 width="25%" class="css3"><a href="../../flashmenu1.htm" onMouseMove="showtip('网页素材<br>大量的网页素材给你的网页制作提供方便！')" , [4 k- p u5 k z: D
onMouseOut=hidetip()>网页素材</a></td>
% Y. v& {3 o. l& C" I9 i, w <td height=9 width="25%" class="css3"><a href="../../wyjcs.html" onMouseMove="showtip('图像处理<br>图形软件的使用以及图像的特效制作')" onMouseOut=hidetip() / b v- \* P: X' D
target=_blank>图像处理</a></td>+ Y) _7 n1 s& o" m% T6 @4 C
<td height=9 width="25%" class="css3"><a href="../../soft.htm" onMouseMove="showtip('网页特效<br>网页特效的大宝库，有详细的使用说明')" onMouseOut=hidetip()
4 G- g0 R9 s7 j( ~ target=_blank>网页特效</a></td>7 C Q3 T3 l4 B; s4 }! F' U* h( Y
</tr>: q7 Y+ N3 Y: C* ^/ j5 D, }1 e8 i$ C
</tbody> / t& ]6 J3 [: y0 x: }; @& v3 y
</table> |
|
发表于 2008-1-21 20:52
|