|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之带注释的表格菜单特效
一：将下面的代码放在<HEAD>与</HEAD>之间% f: [! S8 K1 r0 _
<SCRIPT language=javascript > F) L+ N0 `- |- @ {+ w6 O) J
document.write(& q9 K7 a$ H1 R- j8 N4 A5 w$ J
"<div id=\"tooltip\" style=\"position:absolute;visibility:hidden; padding:3px;border:1px solid #528AC6;\
: I" I O! B9 [& f( X7 t# }2 Q;background-color:#ffdfd0; height: 19px; left: 77px; top: 96px\"></div>");7 ^% X7 n0 E+ y8 O# x/ P/ R6 a
1 o6 o# R4 Y5 ^! }function showtip(text) //显示链接的说明
0 C: S4 u# w% W! r{3 ?" B7 O# u# x
if (document.all&&document.readyState=="complete") //针对IE
1 P- q! H6 ^, s3 q2 S {0 L% i( k, K8 U
+ B( |: \( w4 j0 F2 X- n) i document.all.tooltip.innerHTML="<div vAlign=center><font SIZE=2>"+text+"</font></div>";
! I7 k( H8 J9 w/ o document.all.tooltip.style.pixelLeft=event.clientX+document.body.scrollLeft+10;8 L9 f/ z. o# _
document.all.tooltip.style.pixelTop=event.clientY+document.body.scrollTop+10;
: w9 B% w. O7 ^, T& y8 s document.all.tooltip.style.visibility="visible";
" Z: r S) _2 V! {- X3 f }& Z3 W' }0 b7 }$ B/ _7 ~: v8 s g
}6 [& o% ~ z, e4 _
. }* k0 [+ d3 I& l
function hidetip()
: C7 C7 K. }- w7 x& V$ {! T{
" F$ Z7 L8 `+ j6 I8 lif (document.all)/ Y: Z/ F) N0 L, D( ?
document.all.tooltip.style.visibility="hidden";' c1 E2 L% N3 n( c. u, \3 x" n
}
* Q' y' Y) C: j- i- N2 X6 x
) K6 b( ^3 A% Y. |1 @) Gfunction setcolor(fntcolor,bgcolor)
0 e6 J6 d3 {* t& S# ?{7 ^2 G t' s5 `4 ]% e, @: B+ ]5 Z+ S& n
document.all.tooltip.style.bgcolor=bgcolor;! O4 E/ W5 l R5 x4 x9 v) h
document.all.tooltip.innerHTML.Color = fntcolor;) o# b( U1 G* `; F4 S% {7 j
}
3 h% A1 j7 q0 ?0 n3 ~! z! Z6 e* x \0 d- m- B6 Q
function showhint(text)0 e5 u# q* Y8 p5 ^) N4 `# y: m
{( \1 P0 v" W6 K" \7 `4 F
onmousemove=showtip(text);
" L; ~. u' d7 O$ L$ F onmouseover=showtip(text);" W$ D! y' ^3 {6 Z8 m
onmouseout=hidetip();
O! k# N) f5 e: _3 u}' `$ [1 n: I. a1 b' V2 I
</SCRIPT>
$ R- X; x* f1 g% [8 ~4 ?3 P' u4 c, |3 n0 p& P( K7 [, H
6 U9 `* n' i3 S
" q, a0 D( v+ D @$ \$ G
0 i/ r2 E8 e% i5 W8 Y5 N; b
( P2 F8 j {' z+ a
1 S1 k ~$ F* x* E二：将下面的代码复制到〈BODY〉区1 j6 f" `7 j& ^2 ^5 c6 n; t
<table align=center border=1 bordercolordark=#ffffff bordercolorlight=#a8cbf1
9 ~5 S o- w u u1 H6 Ccellspacing=0 class=t width="300" bordercolor="#6699CC" cellpadding="0">
+ t$ W7 {. a% O/ m! s0 l( [( j- [( y <tbody>
" y* T% G1 ?+ A6 v <tr align="center" bgcolor="#ffdfd0">
. p" c$ S; y* r t% \( y& M! A+ g <td height=9 width="25%" class="css3"><a href="../../sbtx.html" onMouseMove="showtip('赏心悦目<br>精美的图像和壁纸能使你得到一些放松！')" onMouseOut=hidetip()
4 z" F3 |; `; w+ E+ U target=_blank>赏心悦目</a></td>% I4 I/ ~# y3 ?- D1 t/ q
<td height=9 width="25%" class="css3"><a href="../../flashmenu1.htm" onMouseMove="showtip('网页素材<br>大量的网页素材给你的网页制作提供方便！')"
# X; z+ ^- D; i b/ H$ u3 i- ? onMouseOut=hidetip()>网页素材</a></td> i$ I! {; t+ M
<td height=9 width="25%" class="css3"><a href="../../wyjcs.html" onMouseMove="showtip('图像处理<br>图形软件的使用以及图像的特效制作')" onMouseOut=hidetip() 2 j( [7 l$ F- }
target=_blank>图像处理</a></td># X6 W* ]+ D% p
<td height=9 width="25%" class="css3"><a href="../../soft.htm" onMouseMove="showtip('网页特效<br>网页特效的大宝库，有详细的使用说明')" onMouseOut=hidetip()
5 ^ s9 T* B% _+ x# G9 u target=_blank>网页特效</a></td>
' S( |* [3 W* R' e# M! t </tr>7 f4 Q6 V* |4 \) s- P- I
</tbody> 3 z2 Q" x" G! ^4 Q* P
</table> |
|
发表于 2008-1-21 20:52
|