|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之带注释的表格菜单特效
一：将下面的代码放在<HEAD>与</HEAD>之间
0 u2 |- C1 Z( }6 ?: @6 @$ X<SCRIPT language=javascript ># F$ Z; y8 u- B2 P# N+ N5 o
document.write(7 K! x. Z3 _$ B7 r: k3 i2 }# B
"<div id=\"tooltip\" style=\"position:absolute;visibility:hidden; padding:3px;border:1px solid #528AC6;\
4 a* C0 ~5 U) y8 a! _# B2 u2 |;background-color:#ffdfd0; height: 19px; left: 77px; top: 96px\"></div>");
- J- j+ R# J! l0 r. f, ^7 ]( V' k' m
- u) a( ~- {# ?function showtip(text) //显示链接的说明
- t5 B+ O, p! B3 [- O{4 P+ N. s, g8 R; N. |7 z% l" B, _+ w
if (document.all&&document.readyState=="complete") //针对IE4 n8 L4 ^ a) w+ N. \8 r
{
, V$ o& i$ H1 X5 d9 r( y / n4 h* \- B- l5 l$ ~2 h
document.all.tooltip.innerHTML="<div vAlign=center><font SIZE=2>"+text+"</font></div>";
& M4 I6 @1 }, u. h document.all.tooltip.style.pixelLeft=event.clientX+document.body.scrollLeft+10;3 p# z4 J6 t: y8 m+ |5 @! S+ ^
document.all.tooltip.style.pixelTop=event.clientY+document.body.scrollTop+10;
7 `; S; I$ P k" h5 Y V document.all.tooltip.style.visibility="visible";% Y( j; e6 D8 @1 t. g; I
}
. V# g8 K4 _, Z}3 l9 O+ [2 ^6 X& }( m" b$ |' b/ v+ g
1 _5 L1 i8 ^# m8 r/ s
function hidetip() ) n3 |/ k, R; n' f
{
5 H% w$ r1 [8 e# z3 m j: [if (document.all)
5 l$ v" `0 c+ L$ H, ]+ m7 e1 X document.all.tooltip.style.visibility="hidden";
! R6 W; [6 z7 W, ^5 g V}! }1 |- L6 o2 d3 s5 ^4 ]( m3 k+ b) O
1 d! z, r0 L+ H6 ^, Zfunction setcolor(fntcolor,bgcolor)6 c' H# ~$ d% e$ x. H) Z
{% f7 v6 D2 r3 k$ l/ Z: z! T0 C$ k
document.all.tooltip.style.bgcolor=bgcolor;
, f& | z- b$ H5 O. n document.all.tooltip.innerHTML.Color = fntcolor; I# k$ U+ i1 [
}: q. Y8 F$ W; J, r% d2 I' d0 I1 F2 l
: r: V' B2 S" Y+ S! b0 W4 I5 y1 Zfunction showhint(text)
+ [. S0 K }3 R. B7 t{) i* b& d$ D8 C: h0 i0 a5 J: ?6 B
onmousemove=showtip(text); ?; h$ |& E& n8 }9 g( f6 t
onmouseover=showtip(text);" Z' S/ |/ u( c4 P, J5 Y6 a
onmouseout=hidetip();
* X% L7 z- w/ l}
" W' g2 J+ `5 k' a</SCRIPT>6 \6 q% s+ S o2 H
' ?, A6 d$ Z, \6 _
8 s' P6 j: c z3 E5 L" ~5 u4 p4 ^8 Y- W; P- g4 ^
6 ~' P# a2 c+ b) D6 `; o
- L; Z. \/ j3 N2 m+ r7 R* o
( L3 W. l5 q# _2 R9 D. q0 [二：将下面的代码复制到〈BODY〉区
$ ^- Y5 X# B) x( m( y: ]5 I- o/ s<table align=center border=1 bordercolordark=#ffffff bordercolorlight=#a8cbf1 8 Q+ f% H( s! ~) i8 r/ a
cellspacing=0 class=t width="300" bordercolor="#6699CC" cellpadding="0">
, S% J2 X) }$ ~! D( |* @: |* d <tbody>
" P \2 O' l, K9 e/ N4 R( ` <tr align="center" bgcolor="#ffdfd0">
1 b" c# a0 G. l, i& l" l1 w <td height=9 width="25%" class="css3"><a href="../../sbtx.html" onMouseMove="showtip('赏心悦目<br>精美的图像和壁纸能使你得到一些放松！')" onMouseOut=hidetip() ' I3 U! O& g( D% p2 S
target=_blank>赏心悦目</a></td>
8 W; P& V- }$ W5 D& z& X <td height=9 width="25%" class="css3"><a href="../../flashmenu1.htm" onMouseMove="showtip('网页素材<br>大量的网页素材给你的网页制作提供方便！')"
* L0 M4 x6 P) [ onMouseOut=hidetip()>网页素材</a></td>
* ^1 |5 G5 F. G; b/ N( \ <td height=9 width="25%" class="css3"><a href="../../wyjcs.html" onMouseMove="showtip('图像处理<br>图形软件的使用以及图像的特效制作')" onMouseOut=hidetip()
( }- u" @, V! X5 b6 A" W C target=_blank>图像处理</a></td>- f: w" _+ j# z2 ?: l. `! `1 n* N; w
<td height=9 width="25%" class="css3"><a href="../../soft.htm" onMouseMove="showtip('网页特效<br>网页特效的大宝库，有详细的使用说明')" onMouseOut=hidetip()
8 m. a3 ]. h+ f# o2 K( m- j target=_blank>网页特效</a></td>2 R6 V1 L) s1 m) D
</tr>: e, Y# j! `: N" d" x7 ` \- L% \8 e
</tbody> # {$ D# E! Z1 C `" Q; s
</table> |
|
发表于 2008-1-21 20:52
|