|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之带注释的表格菜单特效
一：将下面的代码放在<HEAD>与</HEAD>之间
/ w* o, L" K0 {1 @8 Q- K0 Q; Y<SCRIPT language=javascript >
% P/ b7 g$ e1 T3 odocument.write(
`2 q; q) w# f; z"<div id=\"tooltip\" style=\"position:absolute;visibility:hidden; padding:3px;border:1px solid #528AC6;\
5 ~" D; {! s2 A- k* E2 F% U' N( h' r;background-color:#ffdfd0; height: 19px; left: 77px; top: 96px\"></div>");
7 n% h7 ^4 k4 H- g7 R
9 U0 C' S$ d& p& K. p5 ~function showtip(text) //显示链接的说明
/ }' d5 v: s c4 r3 U{
) F" V8 M4 j! J0 i# O if (document.all&&document.readyState=="complete") //针对IE) Y/ g* c0 {# O6 r- ^
{; \' @1 m( q8 v. E
9 X5 |+ ^, U8 G
document.all.tooltip.innerHTML="<div vAlign=center><font SIZE=2>"+text+"</font></div>";. X1 K2 Y \; b, B' S5 O8 o
document.all.tooltip.style.pixelLeft=event.clientX+document.body.scrollLeft+10;- a3 W# z5 H0 }3 K3 q
document.all.tooltip.style.pixelTop=event.clientY+document.body.scrollTop+10;# G) W- R( p& E* A$ T/ O$ M. o1 l4 k
document.all.tooltip.style.visibility="visible";& ?4 r$ _2 m3 N \; L, h) |
}
1 y( K7 e4 r) i}
( f7 y3 R- ~6 z3 P5 j" t% y$ C/ }1 Y
function hidetip()
7 F0 t) I, e+ y; u: e9 e, {{' \5 B2 i- b9 Z! d
if (document.all)% N' e3 O+ Q2 b2 i, ]
document.all.tooltip.style.visibility="hidden";
$ J6 v& m3 y. \& Y* J* S}
' E6 Q" h1 y3 J ~4 F& w$ n$ l, o
function setcolor(fntcolor,bgcolor)
* X, m& Z1 e/ j{5 ^$ S. \3 e2 q5 q M: `
document.all.tooltip.style.bgcolor=bgcolor;- o* V: @, [; p I8 w; m
document.all.tooltip.innerHTML.Color = fntcolor;
. E" v R# B$ N3 J0 N}
4 X5 p1 Q) a% N7 K
" L; D0 K, B+ E' Nfunction showhint(text)' s) j% S( o6 V3 H
{6 S) ^; }" |" h# X2 Q. R3 W
onmousemove=showtip(text);
T3 n8 S6 g6 K# E onmouseover=showtip(text);
; ] e5 R4 U6 l% ` onmouseout=hidetip();
2 l; A: s' M$ S3 j8 h' u}
4 G4 A: ]) D, w</SCRIPT>
( O. q9 \! o0 B" U
3 @& J: n n" I- _: f/ w" z
$ q/ G2 O; m1 ~2 k5 V; f; l( }7 B( I2 ~- N
, d9 b( C( p/ k9 O7 w5 a2 {$ f) S* J& m2 i0 y @: d
1 T: T5 P5 N; v( m7 n* I# W" P# g
二：将下面的代码复制到〈BODY〉区* M3 T) Q4 `, A: _0 K
<table align=center border=1 bordercolordark=#ffffff bordercolorlight=#a8cbf1
) b% W* w6 g; X0 B- icellspacing=0 class=t width="300" bordercolor="#6699CC" cellpadding="0">
; e' d! l& x' s2 ~ <tbody> 8 S. U7 s% W- |% H2 n) M' D
<tr align="center" bgcolor="#ffdfd0">
, u" c9 `0 ?% d; v/ w <td height=9 width="25%" class="css3"><a href="../../sbtx.html" onMouseMove="showtip('赏心悦目<br>精美的图像和壁纸能使你得到一些放松！')" onMouseOut=hidetip()
/ I9 {2 o2 q& R e3 |! E target=_blank>赏心悦目</a></td>
7 D" T0 y; H$ h" y: K" S5 |: k" b/ O <td height=9 width="25%" class="css3"><a href="../../flashmenu1.htm" onMouseMove="showtip('网页素材<br>大量的网页素材给你的网页制作提供方便！')" 4 k& ?& } j; h7 p" p0 C
onMouseOut=hidetip()>网页素材</a></td>2 d! P5 {2 `0 `) q* G
<td height=9 width="25%" class="css3"><a href="../../wyjcs.html" onMouseMove="showtip('图像处理<br>图形软件的使用以及图像的特效制作')" onMouseOut=hidetip() + f z5 ]$ p' T; G
target=_blank>图像处理</a></td>
" t# ?% K# d7 n2 F5 |$ [, P <td height=9 width="25%" class="css3"><a href="../../soft.htm" onMouseMove="showtip('网页特效<br>网页特效的大宝库，有详细的使用说明')" onMouseOut=hidetip()
; b. l7 C; ^% H# S+ u( L& H target=_blank>网页特效</a></td>
; _ M0 d0 f8 Y c/ F </tr>
6 ?( ~( u/ m0 k/ ]# x. c; q </tbody>
! g; Q4 @' Y8 W# ~8 j+ d# C$ Q: E </table> |
|
发表于 2008-1-21 20:52
|