|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之带注释的表格菜单特效
一：将下面的代码放在<HEAD>与</HEAD>之间/ l% ]& K! |! f1 ^
<SCRIPT language=javascript >2 l* A2 Y9 [ [* c L
document.write(; E/ J- f. v" d# U# C, P$ x3 S
"<div id=\"tooltip\" style=\"position:absolute;visibility:hidden; padding:3px;border:1px solid #528AC6;\
% M) C3 p) ]& l1 H1 f1 O;background-color:#ffdfd0; height: 19px; left: 77px; top: 96px\"></div>");
9 c. E1 r+ ?, m) X& r' `
5 B) b3 A1 v% F7 kfunction showtip(text) //显示链接的说明
1 B* [' m) w. f# [{8 g) }+ [! s- O; _; ~* t
if (document.all&&document.readyState=="complete") //针对IE8 K7 i. C6 Z9 C! O
{7 U: ?: s( t; Q7 x) y( {! S9 O
& V* F6 v" q) X0 j document.all.tooltip.innerHTML="<div vAlign=center><font SIZE=2>"+text+"</font></div>";) P" Q: x% i" |/ _. U, i
document.all.tooltip.style.pixelLeft=event.clientX+document.body.scrollLeft+10;' Y/ ^2 ?3 V; x! _( M
document.all.tooltip.style.pixelTop=event.clientY+document.body.scrollTop+10;
; |: {4 d8 p+ ]- A, R document.all.tooltip.style.visibility="visible";1 l+ Q. a0 X. m7 W% y K
}
0 g1 _, ^; c- \2 }5 @}
8 _2 T: E1 i- z+ W, f2 n' c) K, y% T V. l) J
function hidetip() * a5 Q1 ~" Q, K2 M6 g
{
& L, }- X$ \( b) a, zif (document.all)
! l! e- Z$ J+ W# n' {& {* J3 i document.all.tooltip.style.visibility="hidden";
, g, X0 w4 \7 E7 z7 w}
( I/ j+ {: C1 t* `- j* G5 t- S2 E" N" r& }( z* O% C- T
function setcolor(fntcolor,bgcolor)% K5 B$ D" I: i g B# c9 ^
{0 h3 H3 |6 w- I1 C5 }2 A# ^
document.all.tooltip.style.bgcolor=bgcolor;
6 Z' i4 S' Z. ?( k# k) R0 Z* V) v- E- X document.all.tooltip.innerHTML.Color = fntcolor;
G# Z- W; Y4 `( X8 w9 V7 v}' U+ B: U8 h( e/ J
9 R8 l. U: Z$ ], R& ~" g! c9 Zfunction showhint(text)0 d; m% N1 ]% Y2 [/ H( H
{, W6 w- j9 ~% D
onmousemove=showtip(text);
- u& w# W* B1 q* ~/ r7 T" D5 h onmouseover=showtip(text);
9 j/ H+ O# D% E+ [: O onmouseout=hidetip();
8 |! @1 P9 T: B7 j0 J* s! _% N}
- R3 p$ D* O8 I( e# g" [</SCRIPT>- e, @8 u0 {6 n1 G" \7 |3 t
7 A- x& j! c ?( B5 ~% b5 Z$ _6 h+ B. D$ a3 W. }1 K6 l
3 W. H5 D) T( N
L. q( ~/ g1 ?; O- a! B M1 _2 h' d5 q& ~/ z8 [5 k( U& J) A) P
+ Q6 U9 Q7 w% f( m9 P: X二：将下面的代码复制到〈BODY〉区( C+ Q. l* Z# M% Z
<table align=center border=1 bordercolordark=#ffffff bordercolorlight=#a8cbf1 8 w w6 @9 W: ], H$ i% ^
cellspacing=0 class=t width="300" bordercolor="#6699CC" cellpadding="0">
4 q1 V# B: g8 n3 Z% e, k/ b$ `% ^$ f <tbody>
$ q* k3 o0 i6 ?: [* V0 [ <tr align="center" bgcolor="#ffdfd0"> 2 s L+ `! h6 K3 M3 {6 E
<td height=9 width="25%" class="css3"><a href="../../sbtx.html" onMouseMove="showtip('赏心悦目<br>精美的图像和壁纸能使你得到一些放松！')" onMouseOut=hidetip()
9 c- h6 V ]' \. \3 D5 ? target=_blank>赏心悦目</a></td>/ g5 t0 k B* \, j+ b
<td height=9 width="25%" class="css3"><a href="../../flashmenu1.htm" onMouseMove="showtip('网页素材<br>大量的网页素材给你的网页制作提供方便！')" 2 B1 }4 m1 `1 U6 n
onMouseOut=hidetip()>网页素材</a></td>
" j6 s3 g5 m0 ~8 q) | <td height=9 width="25%" class="css3"><a href="../../wyjcs.html" onMouseMove="showtip('图像处理<br>图形软件的使用以及图像的特效制作')" onMouseOut=hidetip()
$ T6 d4 e: w( l$ V! D target=_blank>图像处理</a></td>
- U. |) R m9 u6 z <td height=9 width="25%" class="css3"><a href="../../soft.htm" onMouseMove="showtip('网页特效<br>网页特效的大宝库，有详细的使用说明')" onMouseOut=hidetip()
6 m! A6 g2 B! T7 A target=_blank>网页特效</a></td>2 e3 P+ X. `$ e( K+ ^
</tr>
_# s8 A2 {0 k4 N# x9 g! ^* ^ </tbody>
! P: X% u. e6 X- C </table> |
|
发表于 2008-1-21 20:52
|