|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之带注释的表格菜单特效
一：将下面的代码放在<HEAD>与</HEAD>之间
' E5 M0 M _ D+ ]2 ^* x<SCRIPT language=javascript >7 ~1 E" \" b# `3 n
document.write(& g& J$ d: z# Z' g1 Y
"<div id=\"tooltip\" style=\"position:absolute;visibility:hidden; padding:3px;border:1px solid #528AC6;\
( [+ e/ S3 d" b8 B: l4 s;background-color:#ffdfd0; height: 19px; left: 77px; top: 96px\"></div>");0 Y9 }9 J5 c* w; v$ t
. d1 e3 q: j# [$ u8 F/ J7 c6 {function showtip(text) //显示链接的说明
" V. @' E' y9 z* \8 t{
; o9 w7 W$ d- L4 A4 H8 _ if (document.all&&document.readyState=="complete") //针对IE4 G) T F5 p# x4 K$ U# c4 a" e
{ y7 g9 K$ r9 s& S1 d
9 a8 x8 [; |7 U2 Q X" ~5 ?
document.all.tooltip.innerHTML="<div vAlign=center><font SIZE=2>"+text+"</font></div>";
2 j. V3 `$ `+ C3 { document.all.tooltip.style.pixelLeft=event.clientX+document.body.scrollLeft+10;+ D6 Z Z/ P1 y: W8 |
document.all.tooltip.style.pixelTop=event.clientY+document.body.scrollTop+10;
4 G/ y1 w( h$ ^2 F! c document.all.tooltip.style.visibility="visible";* R% s0 m7 D, C! \
}3 ] |, @2 E8 Z4 A
}
4 m8 Q7 u% q& J1 ~1 p& v# Y4 s3 x& t4 g! v
function hidetip()
/ L4 Z1 c# p$ m{
* P. i! G9 A; ^* T4 Fif (document.all)
- p) s3 d: d; r; ` document.all.tooltip.style.visibility="hidden";
U% Z$ l; Q! Q3 g+ B/ S7 D( Z}
: w1 w# G8 [7 Q, `8 C
: q0 X& d" v$ W9 F8 W5 Bfunction setcolor(fntcolor,bgcolor); g3 H/ q5 G- Q% H: X
{- I& B% Z' f) g& Z- j% c/ f
document.all.tooltip.style.bgcolor=bgcolor;
+ ]* r+ B: ?$ u1 a document.all.tooltip.innerHTML.Color = fntcolor;
0 c* d5 m$ y. G5 d! p0 P}* z& F8 K3 u' L/ I5 D- q
0 {" b- s" N7 `" w0 W3 q
function showhint(text)
6 r/ E) i& [( Y3 x/ i{
* c9 H4 D; l5 L: X onmousemove=showtip(text);9 f/ D/ ?9 t! U
onmouseover=showtip(text);
! z7 r" q# U( a2 z( I onmouseout=hidetip();' ]5 P4 H( l1 j* e
}+ f) V2 C* s8 R- O' y
</SCRIPT>! d M- L# M( ^$ p. z
9 h6 r1 C! u) |9 Z
I+ n1 D; R" T- _2 q2 p' R$ L
, \. Q* ]" j. a; c8 N0 W) x4 H4 m# V6 k, [+ s% B# H$ N! ^1 j
& i: s6 {' p& E- x( {/ r7 u1 i e* G) X9 b% D5 z: y0 l
二：将下面的代码复制到〈BODY〉区. Q+ G) q* ^* R
<table align=center border=1 bordercolordark=#ffffff bordercolorlight=#a8cbf1 $ z/ w$ G% N( X" d; |( P$ d
cellspacing=0 class=t width="300" bordercolor="#6699CC" cellpadding="0">. s8 C, ?- w, G& R# B. m5 t
<tbody> $ N/ k$ Q; a, x3 u& Z
<tr align="center" bgcolor="#ffdfd0">
" W8 W$ H+ T9 |9 r* {* h9 z6 ~6 `' d3 J <td height=9 width="25%" class="css3"><a href="../../sbtx.html" onMouseMove="showtip('赏心悦目<br>精美的图像和壁纸能使你得到一些放松！')" onMouseOut=hidetip()
8 W: A8 ~; L+ U; d target=_blank>赏心悦目</a></td>
7 S9 Y& G$ x2 r& @7 Z <td height=9 width="25%" class="css3"><a href="../../flashmenu1.htm" onMouseMove="showtip('网页素材<br>大量的网页素材给你的网页制作提供方便！')" ' m8 T+ O9 e- c
onMouseOut=hidetip()>网页素材</a></td>+ C, F e. [$ N' [% r, e
<td height=9 width="25%" class="css3"><a href="../../wyjcs.html" onMouseMove="showtip('图像处理<br>图形软件的使用以及图像的特效制作')" onMouseOut=hidetip()
1 o5 y+ V. D% G# X) B' f i target=_blank>图像处理</a></td>' V! K/ w! z: c# F7 w& ?
<td height=9 width="25%" class="css3"><a href="../../soft.htm" onMouseMove="showtip('网页特效<br>网页特效的大宝库，有详细的使用说明')" onMouseOut=hidetip() ! ^* J3 u: C& ?4 `
target=_blank>网页特效</a></td>& F7 {% N; A) G/ M
</tr>; [! [7 y+ J5 A: E& j8 z
</tbody>
# C" j; J& F: G8 h Y5 c4 r* u( b </table> |
|
发表于 2008-1-21 20:52
|