|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之带注释的表格菜单特效
一：将下面的代码放在<HEAD>与</HEAD>之间
( E) P4 @1 d8 l) s" w<SCRIPT language=javascript >
/ \, x* Q6 K8 l- c7 Q E2 w: A' `document.write(
* y9 I; |1 T4 b& ]! N4 i1 `"<div id=\"tooltip\" style=\"position:absolute;visibility:hidden; padding:3px;border:1px solid #528AC6;\+ w8 g; E6 w5 C
;background-color:#ffdfd0; height: 19px; left: 77px; top: 96px\"></div>");
2 ^( Z$ _3 R n C
' q* }' ]. Q9 C$ F" T, f; W7 Sfunction showtip(text) //显示链接的说明! H: @0 R t/ g( \1 p* h8 X8 }/ O+ Q0 W
{2 K8 u, C" t5 `# M) V
if (document.all&&document.readyState=="complete") //针对IE$ H8 i0 K/ }5 _7 ~/ E/ N
{" U# ~ R2 F3 j( A
) a) v8 e: k8 f l' h
document.all.tooltip.innerHTML="<div vAlign=center><font SIZE=2>"+text+"</font></div>";
! m. Y% Q+ T9 ?( z3 t, f I document.all.tooltip.style.pixelLeft=event.clientX+document.body.scrollLeft+10;
, d4 X& z+ h$ g, H document.all.tooltip.style.pixelTop=event.clientY+document.body.scrollTop+10;
, ?" ~7 n' ?: s3 o8 ^/ m+ P% v0 Q document.all.tooltip.style.visibility="visible";) w6 G5 Q# ]* O; p3 C$ W
}
1 b5 j& h% A) t/ Y}
3 G2 l% R. S5 E
* Y1 k" H+ I, P: i: z/ Ofunction hidetip()
) ^5 S! K8 {" Q- I B) M8 f9 M{
! R4 q2 K, }4 k2 `. mif (document.all)9 w9 Q) @( l- ?/ K
document.all.tooltip.style.visibility="hidden";
7 L# o% V4 `; f3 B} [9 P6 b1 c' P5 `* Q/ D
9 S# `. G# U, [9 X" a0 n2 b
function setcolor(fntcolor,bgcolor)
6 _1 a9 e& K& o! I" a9 m4 V{
# A* i% r0 @5 a" a% s; T2 [1 S+ A document.all.tooltip.style.bgcolor=bgcolor;
3 Y: J! D( L, o" Y$ Q5 b document.all.tooltip.innerHTML.Color = fntcolor;! F: w1 L; I2 f
}( e- ?9 ?! u/ ^4 Z1 \6 i
! Z6 _& B7 t* N
function showhint(text)0 l/ t% ?- ] [8 R: b" k* H- l
{8 V+ B- `1 r; }( G' j
onmousemove=showtip(text);% u7 f3 X! g8 \! a: f
onmouseover=showtip(text);
+ y% T# D9 P: ]% @; t! i! j onmouseout=hidetip();
B( g) M. S3 _& g}" t |' O( _, d1 m1 W L' `! z1 S8 A
</SCRIPT>
4 ~, `0 m& y( ~
6 L* ?% [+ k$ p0 W
- B. s4 r. U6 U/ R' _, |, t* D+ M* n. x' d
7 B0 i4 U0 A, p' \1 C1 {
3 c7 Y) ?: R6 a3 v8 | u- |+ c' u4 q; n: c
( z* F; L$ T, Q1 |: Y二：将下面的代码复制到〈BODY〉区
0 s& f) v( D6 ~! P( j<table align=center border=1 bordercolordark=#ffffff bordercolorlight=#a8cbf1 / u9 M- M5 D2 |$ ]1 l7 l
cellspacing=0 class=t width="300" bordercolor="#6699CC" cellpadding="0">4 C ~2 P" h6 ^' j0 }
<tbody>
$ u* s- M& j3 |6 g7 b+ q2 B <tr align="center" bgcolor="#ffdfd0"> + d1 p7 J) @8 C9 c2 J' _ P3 G: W' W( k
<td height=9 width="25%" class="css3"><a href="../../sbtx.html" onMouseMove="showtip('赏心悦目<br>精美的图像和壁纸能使你得到一些放松！')" onMouseOut=hidetip()
& [3 v8 _& ]/ @( h2 R! D6 W. J target=_blank>赏心悦目</a></td>
: F4 n# E7 m) L0 [$ s6 V7 o <td height=9 width="25%" class="css3"><a href="../../flashmenu1.htm" onMouseMove="showtip('网页素材<br>大量的网页素材给你的网页制作提供方便！')"
) L& O2 i; M& k: b2 d0 j8 F! h onMouseOut=hidetip()>网页素材</a></td>$ I# t- @# {& v, H6 G9 n
<td height=9 width="25%" class="css3"><a href="../../wyjcs.html" onMouseMove="showtip('图像处理<br>图形软件的使用以及图像的特效制作')" onMouseOut=hidetip() & z2 o7 K9 b1 m) x; Z4 ^
target=_blank>图像处理</a></td>
7 V4 m0 [, x+ {8 Z# R <td height=9 width="25%" class="css3"><a href="../../soft.htm" onMouseMove="showtip('网页特效<br>网页特效的大宝库，有详细的使用说明')" onMouseOut=hidetip()
4 J) J& u0 w% Z1 b; l1 U: I0 o target=_blank>网页特效</a></td>
7 r! N, I- [1 A& Q2 w# V; d </tr>
8 W* x6 _2 g0 F& B; [6 C </tbody>
" P- w. i7 G) H' ?' p9 ^$ F/ v </table> |
|
发表于 2008-1-21 20:52
|