|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之带注释的表格菜单特效
一：将下面的代码放在<HEAD>与</HEAD>之间
: l/ E; h0 j7 A/ ]( z# z<SCRIPT language=javascript >; x! ?! e- D' [) K' k
document.write(
6 u b* Z# c3 X: E"<div id=\"tooltip\" style=\"position:absolute;visibility:hidden; padding:3px;border:1px solid #528AC6;\2 Q' f8 K: W/ h
;background-color:#ffdfd0; height: 19px; left: 77px; top: 96px\"></div>");
! W8 n1 }% m4 E8 q5 C% c) O# n8 T9 h5 z, ]
function showtip(text) //显示链接的说明
7 v$ }2 y8 M: V& ?6 k1 Y, Y{' v7 e4 }+ G1 i2 b }
if (document.all&&document.readyState=="complete") //针对IE/ x, @6 |' T; s. D P+ S! Y' G
{
( V1 x* x( G0 g0 g
* {9 Q% X" a; n document.all.tooltip.innerHTML="<div vAlign=center><font SIZE=2>"+text+"</font></div>";, I! W. B+ N8 T1 t; e9 |/ K/ U/ c
document.all.tooltip.style.pixelLeft=event.clientX+document.body.scrollLeft+10;/ `% d F2 `7 O8 m/ {8 B
document.all.tooltip.style.pixelTop=event.clientY+document.body.scrollTop+10;
% k2 ^+ u) w6 X0 } document.all.tooltip.style.visibility="visible";: i) E( q6 }5 B/ ^. U. u/ b
}
( A& z/ }; a9 J) _9 j; ~}: Q' Y7 m" ~0 V5 k
$ I4 ]% t( m9 X/ r$ g# |
function hidetip()
; _2 P& D* K# y4 j9 W* J0 a& t) G{
2 H0 _- y; L& p. ?, O# Nif (document.all)
% X! b. c( z* U, k) h document.all.tooltip.style.visibility="hidden";
' i1 h [9 z" P, Q}
$ I G& C1 |( R
% ]0 V7 ~5 Y9 _4 ~, v& E0 v/ }function setcolor(fntcolor,bgcolor)0 w% h9 G, O* v: m( h( @ o# U4 M1 c
{& A9 h6 X! ~& h
document.all.tooltip.style.bgcolor=bgcolor;
# F% r. A9 V+ E# h1 ~ document.all.tooltip.innerHTML.Color = fntcolor;
0 [& n: ?& J s/ }& P, U}
8 F; h4 |$ c5 P" }
# j: L6 _' i3 T$ u0 cfunction showhint(text)) ?/ I& b4 w( R- h# A! X+ ?, |
{+ ~6 e a5 `7 ^9 R
onmousemove=showtip(text);7 ?8 k8 \* k9 n; Z' f/ Y! z
onmouseover=showtip(text);& q2 F# |1 z+ ?7 G
onmouseout=hidetip();, u8 j* m9 @( R
}
0 n& t# L$ Z; z% M' P5 E" Q: B8 \</SCRIPT>
& s# j+ J4 f. H% @, T* S0 _; z6 F& X# y& ~$ m4 U
2 D8 S: Q- Q2 Y% k8 s) J7 \
# |2 L8 A6 {+ W+ N& q
' d+ ^( U* x5 P& Q/ I8 v
. N# z7 u4 I, x
]7 @, b% s8 Q- P; x二：将下面的代码复制到〈BODY〉区
' ^0 q |/ A8 M3 M$ k7 R<table align=center border=1 bordercolordark=#ffffff bordercolorlight=#a8cbf1 / O8 z+ l# h3 m' H3 i8 a
cellspacing=0 class=t width="300" bordercolor="#6699CC" cellpadding="0">
5 }6 B. i0 K& u* ^( a+ M <tbody>
Q- T8 e1 e, Q' C& H6 p* \4 N <tr align="center" bgcolor="#ffdfd0"> 1 q& ^/ Q; w) m' m* |# u' P
<td height=9 width="25%" class="css3"><a href="../../sbtx.html" onMouseMove="showtip('赏心悦目<br>精美的图像和壁纸能使你得到一些放松！')" onMouseOut=hidetip() + i9 W" j# ~* x ^
target=_blank>赏心悦目</a></td>
$ C9 j$ Y p& f. b: [4 \ <td height=9 width="25%" class="css3"><a href="../../flashmenu1.htm" onMouseMove="showtip('网页素材<br>大量的网页素材给你的网页制作提供方便！')" . M! w( ~4 B, b$ a: f% B' p# X
onMouseOut=hidetip()>网页素材</a></td>
4 L% E' ]7 D! F, @8 }! ~ <td height=9 width="25%" class="css3"><a href="../../wyjcs.html" onMouseMove="showtip('图像处理<br>图形软件的使用以及图像的特效制作')" onMouseOut=hidetip()
( H5 C i" e! j" ]* p6 m9 {7 e target=_blank>图像处理</a></td>
/ h2 B- g9 I; [2 k <td height=9 width="25%" class="css3"><a href="../../soft.htm" onMouseMove="showtip('网页特效<br>网页特效的大宝库，有详细的使用说明')" onMouseOut=hidetip()
6 T9 V0 ^+ G* l$ k8 O target=_blank>网页特效</a></td>
1 [/ C/ m7 w( q2 M* k- I1 H; u </tr>
7 |. G# O" a" ~ </tbody>
" |% _( e* C% `1 L) A </table> |
|
发表于 2008-1-21 20:52
|