|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之带注释的表格菜单特效
一：将下面的代码放在<HEAD>与</HEAD>之间
% s3 Q' s; J J; w6 w2 J<SCRIPT language=javascript >
. o: e' N% Z' {! h% jdocument.write(
5 s1 f0 C t6 p7 L* H' O8 I"<div id=\"tooltip\" style=\"position:absolute;visibility:hidden; padding:3px;border:1px solid #528AC6;\2 B% D4 @0 F1 O p5 O7 _. L6 B
;background-color:#ffdfd0; height: 19px; left: 77px; top: 96px\"></div>");
% f" |7 X8 r X) }) s7 M) C3 V7 T! }) c6 k- r6 {# k9 ~
function showtip(text) //显示链接的说明' m& N, R- O. R4 [+ s% M9 J4 y& a
{' `! B9 C/ w; z7 S; ^: i
if (document.all&&document.readyState=="complete") //针对IE
& ^( v9 c8 l# \ |* y {8 E( A# w9 {* r/ A8 u$ A4 _
. L3 [, O( @ A document.all.tooltip.innerHTML="<div vAlign=center><font SIZE=2>"+text+"</font></div>";
" F/ q' Q2 N" ?* s$ F5 d& { document.all.tooltip.style.pixelLeft=event.clientX+document.body.scrollLeft+10;) ~( b: I+ }6 k) g* p. h
document.all.tooltip.style.pixelTop=event.clientY+document.body.scrollTop+10;& ?* l" g- s% W* M7 |. i
document.all.tooltip.style.visibility="visible";
2 |0 [. d6 `! Y7 ?$ l2 l% C. w }& [" B9 ^" `0 V
}
+ X5 j( k1 n7 ~. X5 C, ]
4 W5 V3 I/ I) d3 X$ S. w4 l# l; Pfunction hidetip() ) `, K) j: X- y7 s& E- t
{
1 K1 H( h0 O+ z* y( v, F: [if (document.all)- a5 k7 H) f) V6 b: U9 I
document.all.tooltip.style.visibility="hidden";
2 S8 G5 \6 @2 q) i}
( g# @) T$ w# p2 @7 Q2 P" h. r( k" T
function setcolor(fntcolor,bgcolor)
|, {4 J( r: [; P" ]{ N8 h3 ]1 i; K0 B: d
document.all.tooltip.style.bgcolor=bgcolor;% z3 r! x5 X8 j8 X
document.all.tooltip.innerHTML.Color = fntcolor;3 C: c+ y) h! o
}( o6 d& h( ]: K8 D8 m8 l% c
2 Z6 A8 {1 t: i% ?6 Ofunction showhint(text)
) B% ?, F9 z @2 ^1 X{
! V {: j+ Q* J1 [2 g4 e$ q/ } onmousemove=showtip(text);5 P! X. f5 `! M0 n
onmouseover=showtip(text);
4 [$ q0 r' e) t onmouseout=hidetip();
& U3 T5 ?, k# H' j}5 Q, ]0 o3 N$ i! L4 @
</SCRIPT>) f X1 ?2 |6 Y+ d
* G2 }8 v9 Q4 O& e V
" Z4 r! r0 x7 e( ]4 G: ?' t& u; g3 I1 O3 @* \, K. S9 s( B5 @
- U5 ?1 i5 r5 p Z
/ m1 L! b f4 U% i3 U' j
+ \' ^, x7 [ b" D+ f% O0 H- z二：将下面的代码复制到〈BODY〉区# a: q# f4 J" o; ~/ b! P9 X
<table align=center border=1 bordercolordark=#ffffff bordercolorlight=#a8cbf1 8 {" j8 `1 t: E. i2 ~6 ~0 b5 U* s0 `
cellspacing=0 class=t width="300" bordercolor="#6699CC" cellpadding="0">$ x& m( t6 T. P; ]7 m1 J0 i7 B
<tbody> 3 C( H) V1 M3 e& y; R: i/ I( W
<tr align="center" bgcolor="#ffdfd0"> / E, `; j* Z5 Q+ z6 K9 L
<td height=9 width="25%" class="css3"><a href="../../sbtx.html" onMouseMove="showtip('赏心悦目<br>精美的图像和壁纸能使你得到一些放松！')" onMouseOut=hidetip()
+ Y9 S8 F* a2 U1 h: J5 E- a' N target=_blank>赏心悦目</a></td>
- y- ^" _; K; r% X# Q <td height=9 width="25%" class="css3"><a href="../../flashmenu1.htm" onMouseMove="showtip('网页素材<br>大量的网页素材给你的网页制作提供方便！')" 7 g$ S8 C h* Y2 u1 B
onMouseOut=hidetip()>网页素材</a></td>
4 _7 T2 I2 c6 k6 { <td height=9 width="25%" class="css3"><a href="../../wyjcs.html" onMouseMove="showtip('图像处理<br>图形软件的使用以及图像的特效制作')" onMouseOut=hidetip()
$ L6 S8 l5 ^, S- G1 K! T- f target=_blank>图像处理</a></td>
* O1 ` ]& F# z D/ B3 ^( M <td height=9 width="25%" class="css3"><a href="../../soft.htm" onMouseMove="showtip('网页特效<br>网页特效的大宝库，有详细的使用说明')" onMouseOut=hidetip() ; A p' H. T1 f2 F* u" ?: G# z6 [
target=_blank>网页特效</a></td>
- U2 T2 q6 g1 o% G4 f </tr>1 q% P( i% Q F1 W, u$ g% P; i
</tbody> 8 v/ U0 Q; L( l5 i! }
</table> |
|
发表于 2008-1-21 20:52
|