|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之带注释的表格菜单特效
一：将下面的代码放在<HEAD>与</HEAD>之间
( m/ N( z, b; d% r" y/ e% t) h<SCRIPT language=javascript >
5 ~( J4 ?1 n2 i$ P( H# u2 }. k- s. Udocument.write(7 A% K& C1 b% ]! h! [+ m4 N
"<div id=\"tooltip\" style=\"position:absolute;visibility:hidden; padding:3px;border:1px solid #528AC6;\
( Q7 `8 i6 ]- t# q5 g;background-color:#ffdfd0; height: 19px; left: 77px; top: 96px\"></div>");/ z U5 @8 _0 P Q) K5 Z
, h- q) C( H& s i' h. ^4 [8 e
function showtip(text) //显示链接的说明
1 E4 P( _) _ g- n, m4 X{/ }9 N% y3 q* ^ b2 r; H1 R
if (document.all&&document.readyState=="complete") //针对IE; V# H7 h" U+ N; b
{
8 Z1 B5 W" s" @
& e3 {+ p2 f2 h" \" P3 P7 x8 v document.all.tooltip.innerHTML="<div vAlign=center><font SIZE=2>"+text+"</font></div>"; o1 Q! l$ @' Y) K7 m1 @
document.all.tooltip.style.pixelLeft=event.clientX+document.body.scrollLeft+10;
) D+ L% l6 V6 Z: F4 Q) j+ S document.all.tooltip.style.pixelTop=event.clientY+document.body.scrollTop+10;
) D0 U/ [! K/ h" X& L document.all.tooltip.style.visibility="visible";
7 j/ V" l; E. v& j8 r/ @& D2 J6 \ }
% o% a: W5 L7 P2 H}
0 K) [% W) w7 {: m" \" m2 r8 M! ?, l6 a( c: _- _) D* |% P
function hidetip()
! e$ k1 ]/ P! G1 d7 L2 I6 @/ S/ u{3 y# e; B7 f! \! W
if (document.all)! J! u) I0 h& E) h# t8 y3 \
document.all.tooltip.style.visibility="hidden";
! L* p- ?4 ?- ?: J8 O( s8 b}
: R+ x( _3 R }+ G/ Y! v! { B
) c4 u1 {7 \# N' B" V9 u' jfunction setcolor(fntcolor,bgcolor)
, X' }" J$ v/ M6 A9 Q1 l% v* J{
, T2 f' H) @. F6 V0 }& p document.all.tooltip.style.bgcolor=bgcolor;; P7 N4 ]$ }; |2 s7 M. y0 T5 o8 k
document.all.tooltip.innerHTML.Color = fntcolor;6 M {. l3 k3 ^1 D- E6 F$ ^8 L
}8 x4 |0 T0 O3 e2 f0 B
! h$ f. Z* U4 h( R' B; [2 X
function showhint(text)
" V, v, Y: ]0 N# N* C7 A6 m/ d+ ~{, C: d7 \) V( h& r' R
onmousemove=showtip(text);0 E* i" q/ F6 c! H! h
onmouseover=showtip(text);
: n" W1 h5 b. H1 | onmouseout=hidetip();( F. Y B& |4 K J/ `$ `. L8 _) C
}
4 |9 U$ F0 e, V8 v, Q5 s0 I2 Z</SCRIPT>! h9 }4 `, N' @1 \' u# G- J3 s% c
1 e& _# G1 _. l# m! L4 R
6 }9 J! [# e& \7 P$ p" Q1 |" l4 E. t" Y' Z. u8 D
# v) T- y1 u* d" r
. e& N% E0 O: ]$ b
, I. Q0 z* y- k) L5 B二：将下面的代码复制到〈BODY〉区
! W E, X; V& J<table align=center border=1 bordercolordark=#ffffff bordercolorlight=#a8cbf1 ! N/ t( s: r) r5 \ b3 [" i5 B
cellspacing=0 class=t width="300" bordercolor="#6699CC" cellpadding="0">- a+ ^, I. B9 m q! C5 s
<tbody> ) x- S: v+ m% {; ^" W+ P
<tr align="center" bgcolor="#ffdfd0">
1 ^! \$ z3 x" V4 f5 Y <td height=9 width="25%" class="css3"><a href="../../sbtx.html" onMouseMove="showtip('赏心悦目<br>精美的图像和壁纸能使你得到一些放松！')" onMouseOut=hidetip()
5 G' U0 b d3 x0 a# A! R target=_blank>赏心悦目</a></td>
9 l& f+ Y, [" p <td height=9 width="25%" class="css3"><a href="../../flashmenu1.htm" onMouseMove="showtip('网页素材<br>大量的网页素材给你的网页制作提供方便！')" ) H0 ?$ ?, N# [: z' s, m
onMouseOut=hidetip()>网页素材</a></td>
[3 V9 h7 v# s5 t2 o <td height=9 width="25%" class="css3"><a href="../../wyjcs.html" onMouseMove="showtip('图像处理<br>图形软件的使用以及图像的特效制作')" onMouseOut=hidetip() ; ?' H) E4 m0 \: \
target=_blank>图像处理</a></td>$ H1 ~) Q: y5 B
<td height=9 width="25%" class="css3"><a href="../../soft.htm" onMouseMove="showtip('网页特效<br>网页特效的大宝库，有详细的使用说明')" onMouseOut=hidetip()
2 `; U# T) J! u9 V" S1 ^ target=_blank>网页特效</a></td>
' Y, y$ u2 [3 M" I" Y. T& u% h- F </tr>5 G. c8 O+ |+ h' z/ g# `2 C \% `
</tbody> 1 T# B( J+ R! [9 @4 e
</table> |
|
发表于 2008-1-21 20:52
|