|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之带注释的表格菜单特效
一：将下面的代码放在<HEAD>与</HEAD>之间: @' ~$ w- {3 {9 @ `
<SCRIPT language=javascript >
: A: H6 h. o# V: [document.write(% t; _7 n% g( d( b) a" u
"<div id=\"tooltip\" style=\"position:absolute;visibility:hidden; padding:3px;border:1px solid #528AC6;\ R0 v8 t4 d7 v/ @0 Q; t2 r8 m. M
;background-color:#ffdfd0; height: 19px; left: 77px; top: 96px\"></div>");
~$ Q: `" a) s) t: A* Q
. ~: a, B* Z- I0 ~ d- Q; o i, V/ rfunction showtip(text) //显示链接的说明- b; u y2 f5 C% z. f
{
; C: u& H3 ?; a; W6 m" o. C2 H if (document.all&&document.readyState=="complete") //针对IE- G# e6 R+ i/ I9 s
{
9 T4 L2 B7 `6 J! ^) `4 Y6 t
$ v3 ]* ?5 X; a) q2 o" ]% g1 z document.all.tooltip.innerHTML="<div vAlign=center><font SIZE=2>"+text+"</font></div>";
6 u6 M. i& V* q4 a document.all.tooltip.style.pixelLeft=event.clientX+document.body.scrollLeft+10;$ Y3 _4 K, G% j/ g. {+ z& F
document.all.tooltip.style.pixelTop=event.clientY+document.body.scrollTop+10;
( E6 O5 u, U1 c: h" N4 S document.all.tooltip.style.visibility="visible";
" j1 a9 ^% _! m4 g( ?1 q; i }8 `9 p; K+ h0 K7 k% M# o/ u( r# h
}
# x' X. C3 Y+ S5 N& X- k, s( j* f1 X/ i, P* `! i3 P( P, S( D
function hidetip() , y# Q* J1 R6 F& N: Z
{! o3 Z4 q3 A) o6 R3 v
if (document.all)) X4 B; _* \$ p
document.all.tooltip.style.visibility="hidden";) m# c8 E$ s( j2 ` P6 R7 e
}
( z8 N2 S- C+ l6 F5 N% J5 r- V5 k' F7 W( S' t" ^: n, m2 Z
function setcolor(fntcolor,bgcolor); o. a5 `' Z5 X2 N. F
{
; B0 W6 A- ^7 t- s% H$ x) ]8 \ document.all.tooltip.style.bgcolor=bgcolor;
4 E; |% o6 z4 G0 L$ Z: c document.all.tooltip.innerHTML.Color = fntcolor;7 H& ]$ W1 E [ C6 x: W# u S
}
4 W7 G1 ~/ [* }# T" J3 c
6 h' u% k3 g2 U- a' h; S, Bfunction showhint(text)/ }: g. n( y5 v" N! e5 Q
{
" S6 `. q3 M& x E1 n5 L" U- v9 T onmousemove=showtip(text);
) y. a9 a9 N) G; d- B8 d onmouseover=showtip(text);$ D9 c2 N% Q: N5 r& l& b3 K! L
onmouseout=hidetip();
# G+ X5 ]- }0 I* M}. g% c9 w5 A8 O: K2 L
</SCRIPT>
% O, Y& B" c' l8 J# S" q* i
+ K$ z$ q& z6 v' @ Z1 {+ ]2 d4 S& f; Q3 U i: u; r2 X
/ a) A4 o( w, ~3 s( L
. V$ Z& A5 W. C; n
0 G' B: V4 a* E+ L; ]) u2 F3 R. G
二：将下面的代码复制到〈BODY〉区
# w! X& p, k; P" X<table align=center border=1 bordercolordark=#ffffff bordercolorlight=#a8cbf1 ; A- E1 I+ [/ t% c
cellspacing=0 class=t width="300" bordercolor="#6699CC" cellpadding="0">9 ?6 B* c7 H* y
<tbody> " L5 \, K) y- ^( @
<tr align="center" bgcolor="#ffdfd0"> ' E: |4 O4 ], [
<td height=9 width="25%" class="css3"><a href="../../sbtx.html" onMouseMove="showtip('赏心悦目<br>精美的图像和壁纸能使你得到一些放松！')" onMouseOut=hidetip()
1 K0 f; n! F8 U" p) i9 Q, h5 Y target=_blank>赏心悦目</a></td>
! ~; ^" }" W0 g0 M' _; k <td height=9 width="25%" class="css3"><a href="../../flashmenu1.htm" onMouseMove="showtip('网页素材<br>大量的网页素材给你的网页制作提供方便！')"
3 U+ N* S$ u3 ^! D/ j onMouseOut=hidetip()>网页素材</a></td>" }5 U* @% N+ w" l
<td height=9 width="25%" class="css3"><a href="../../wyjcs.html" onMouseMove="showtip('图像处理<br>图形软件的使用以及图像的特效制作')" onMouseOut=hidetip() 4 K8 U1 n5 n( A+ Q) x
target=_blank>图像处理</a></td>
0 U1 ~$ K* w$ g" k- Z0 d6 _ <td height=9 width="25%" class="css3"><a href="../../soft.htm" onMouseMove="showtip('网页特效<br>网页特效的大宝库，有详细的使用说明')" onMouseOut=hidetip() 3 @7 \. e. P# N) p3 p& ?+ s# d, V) b
target=_blank>网页特效</a></td>
: D( `# s3 F5 s* U1 C9 k% \; v0 b9 } </tr>! ^/ w- u+ D/ t2 v! j
</tbody>
7 u" R" l/ f4 Z </table> |
|
发表于 2008-1-21 20:52
|