|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之带注释的表格菜单特效
一：将下面的代码放在<HEAD>与</HEAD>之间
/ U: _- m# g3 \+ _<SCRIPT language=javascript >
/ T: t# _) R* D0 Y9 n. Jdocument.write(* `* a0 `7 {; G) G( N& Z, C
"<div id=\"tooltip\" style=\"position:absolute;visibility:hidden; padding:3px;border:1px solid #528AC6;\
% N* p9 H" h w4 i' z;background-color:#ffdfd0; height: 19px; left: 77px; top: 96px\"></div>");
7 U5 t+ J' [8 p: h6 X7 S+ u n" k1 g1 D4 s9 i
function showtip(text) //显示链接的说明
, g" t' z ^' v: Z{
; Y" \! Z7 v7 t if (document.all&&document.readyState=="complete") //针对IE
* H+ ^1 i$ a2 D. S% J, u {: C4 p8 U+ }! \$ g6 q
( i8 J" C% }! m# y! g9 V4 P document.all.tooltip.innerHTML="<div vAlign=center><font SIZE=2>"+text+"</font></div>";
& P' @: X- f W5 A document.all.tooltip.style.pixelLeft=event.clientX+document.body.scrollLeft+10;
1 G6 l) |% C N" Q1 C document.all.tooltip.style.pixelTop=event.clientY+document.body.scrollTop+10;
: t4 }' a3 q6 Y* ?. ^ document.all.tooltip.style.visibility="visible";
7 ~$ _ z, e e5 z% o }
1 } f5 l' m. E+ T8 q$ Q* p}
/ N$ ?0 s4 ?( T9 [5 O! y9 k+ r: [0 @4 D; Z6 S8 X
function hidetip() $ [* _" o! H2 G Q. ^8 V- W4 E
{( \1 R! e. {, s! P
if (document.all)" Y" v/ E- F0 c' W! T5 h" H
document.all.tooltip.style.visibility="hidden";! I( u, C/ m, G! r$ V# W
}
8 O5 M/ l% `( j4 a. u- k$ X1 W. _% m1 i6 |3 y( ~% n0 S
function setcolor(fntcolor,bgcolor)
; M. }, B2 B# @7 j7 Y. [2 P/ `{* u0 G- A; j: {; d) o7 B- v
document.all.tooltip.style.bgcolor=bgcolor;5 [4 a; t2 m! t# F) P4 H
document.all.tooltip.innerHTML.Color = fntcolor;' } T9 m2 M1 o, q9 i
}
: @' G% h$ \8 r$ y3 T3 f! j8 h5 J& X6 H4 V& P3 p0 w+ }. d
function showhint(text)
0 w( ]. ?# _' i{
: @1 h5 y6 |6 h$ U) b onmousemove=showtip(text);, |7 C( A3 w" B# e0 ]+ R" h9 h
onmouseover=showtip(text);3 ]- L" e8 u }( L
onmouseout=hidetip();
/ i) n. g! s- O$ S}
) `5 n( ?1 R/ E7 C; |1 `</SCRIPT>
2 D! h F* f3 v' b8 y/ e# r; s1 v+ d# W5 p
& ~5 \$ m" Z/ y& x) G1 C
( @" ]6 G7 n; Q. L: g
6 K$ N' D$ y6 U/ X; t( }$ _
0 s+ a' O4 E O5 Y- v: X
& d! Q: w. r0 V4 q7 ^( x" f* ~二：将下面的代码复制到〈BODY〉区
& U/ B5 S, Q, q2 u2 q4 Y& L, r<table align=center border=1 bordercolordark=#ffffff bordercolorlight=#a8cbf1 4 F; k" S% e+ f) q& Z4 i
cellspacing=0 class=t width="300" bordercolor="#6699CC" cellpadding="0">/ x* n9 f( l0 D3 c1 x3 W
<tbody>
, k9 t: J7 B6 Z" R. O <tr align="center" bgcolor="#ffdfd0">
4 N1 N9 Z5 K1 u, ] <td height=9 width="25%" class="css3"><a href="../../sbtx.html" onMouseMove="showtip('赏心悦目<br>精美的图像和壁纸能使你得到一些放松！')" onMouseOut=hidetip()
( ^; m' L5 K5 M! A. G5 o* q% Y target=_blank>赏心悦目</a></td>
, ~7 _; y: }; Q; f( r <td height=9 width="25%" class="css3"><a href="../../flashmenu1.htm" onMouseMove="showtip('网页素材<br>大量的网页素材给你的网页制作提供方便！')"
9 T H7 z( z2 W. U+ B8 I onMouseOut=hidetip()>网页素材</a></td>
# ]# O8 v- d K/ s <td height=9 width="25%" class="css3"><a href="../../wyjcs.html" onMouseMove="showtip('图像处理<br>图形软件的使用以及图像的特效制作')" onMouseOut=hidetip() ' q" S1 z4 A7 j1 R5 I9 s
target=_blank>图像处理</a></td>
/ y% ]$ P f, K <td height=9 width="25%" class="css3"><a href="../../soft.htm" onMouseMove="showtip('网页特效<br>网页特效的大宝库，有详细的使用说明')" onMouseOut=hidetip()
; c: X2 k4 Q6 q; D target=_blank>网页特效</a></td> P/ N+ _6 T! d
</tr>
: }# n: j' X- X7 r% k( x& v </tbody>
5 h1 K V4 _ D/ z2 v9 d# _) X </table> |
|
发表于 2008-1-21 20:52
|