|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之带注释的表格菜单特效
一：将下面的代码放在<HEAD>与</HEAD>之间
7 P- K8 ^. Q; k6 a( q J; B6 q<SCRIPT language=javascript >
) K: R. @- P* H- mdocument.write(
: ?3 D+ p0 L8 {; ^- W, l"<div id=\"tooltip\" style=\"position:absolute;visibility:hidden; padding:3px;border:1px solid #528AC6;\; X( O; R( {. k1 j3 E7 P) C
;background-color:#ffdfd0; height: 19px; left: 77px; top: 96px\"></div>");1 @3 i- J1 L7 D; b7 x3 M2 t q
9 `# p' p2 I |function showtip(text) //显示链接的说明. O2 D {; {% f! r
{ O2 A5 T' R( m
if (document.all&&document.readyState=="complete") //针对IE+ L/ f* {; J/ u2 A+ ]& C
{' m% a9 N5 [3 t
. \9 I: j/ |- p# ` ]: G2 g
document.all.tooltip.innerHTML="<div vAlign=center><font SIZE=2>"+text+"</font></div>";% |4 n5 u+ j4 z* O. \2 I, \
document.all.tooltip.style.pixelLeft=event.clientX+document.body.scrollLeft+10;
}4 Y7 p$ w0 F4 g: X document.all.tooltip.style.pixelTop=event.clientY+document.body.scrollTop+10;
$ \6 e* @/ h7 L2 y# q document.all.tooltip.style.visibility="visible";
6 L% v* N8 y8 P( T/ j% B }' i$ V& }9 ?3 k- }% ~$ z# B
}
, @8 @7 v$ @8 |
& n& @2 o% \& b8 ~- Zfunction hidetip()
4 n4 |6 q- E) D& J# }{# c/ y% D6 s9 W$ c# p
if (document.all)9 Z5 I( B) y, c: T* o9 i% k3 r
document.all.tooltip.style.visibility="hidden";8 R N B* Y. ]8 c
}
" Z/ y7 v1 Y$ \9 J% Q# V8 Q5 b3 _% z, m
function setcolor(fntcolor,bgcolor)
0 a7 U' g! ~+ z2 Z: u. E8 W{- U1 |) N3 D# G; \4 b
document.all.tooltip.style.bgcolor=bgcolor;' B& W2 b# `! `, B6 Y1 G2 D( j
document.all.tooltip.innerHTML.Color = fntcolor;% A! l: a' R* u" w& U0 z! _
}: y) P4 {5 Z# v1 z/ P( |; p
, c8 A4 L3 |; ]/ f* I# x
function showhint(text)
2 L$ q* p. s# O7 y{
: m/ U* k1 T) K8 u+ @" R; X# _ onmousemove=showtip(text);+ [* H$ t+ U7 a; }
onmouseover=showtip(text);; X& M" }0 k, _
onmouseout=hidetip();4 ?! H6 U5 p7 b/ `
} n, s+ l! {* S
</SCRIPT>3 f7 Q( v+ R, q# Z6 u2 A
, c9 |/ U7 j" E- S; U5 w6 ?- {* M) I
y6 Y3 c% N! x+ \ d3 v3 ~9 h, J, j: S* ~( z# G) [# l
# X* ^$ a ?0 Q' G$ K6 Y7 T7 Q. C0 p
二：将下面的代码复制到〈BODY〉区 p* z; K" Q7 d" e
<table align=center border=1 bordercolordark=#ffffff bordercolorlight=#a8cbf1 7 G9 U% T' A# I& J
cellspacing=0 class=t width="300" bordercolor="#6699CC" cellpadding="0">
9 H, \* h6 K l4 y+ y1 c <tbody>
, X; x. m& f* n% ], A1 I% q <tr align="center" bgcolor="#ffdfd0"> - R& H0 b1 f3 N6 s/ Z6 S T
<td height=9 width="25%" class="css3"><a href="../../sbtx.html" onMouseMove="showtip('赏心悦目<br>精美的图像和壁纸能使你得到一些放松！')" onMouseOut=hidetip() , J3 d' F3 R& J; M; N- M
target=_blank>赏心悦目</a></td>
+ R( @6 ~ k% u5 D2 ]$ | <td height=9 width="25%" class="css3"><a href="../../flashmenu1.htm" onMouseMove="showtip('网页素材<br>大量的网页素材给你的网页制作提供方便！')"
& Y7 S' C4 u8 ` onMouseOut=hidetip()>网页素材</a></td>
0 Q( e K( S3 E) R% t( q <td height=9 width="25%" class="css3"><a href="../../wyjcs.html" onMouseMove="showtip('图像处理<br>图形软件的使用以及图像的特效制作')" onMouseOut=hidetip()
. E# v5 _7 c" D: V6 P9 H target=_blank>图像处理</a></td>/ Z6 g0 f( `6 m4 }
<td height=9 width="25%" class="css3"><a href="../../soft.htm" onMouseMove="showtip('网页特效<br>网页特效的大宝库，有详细的使用说明')" onMouseOut=hidetip()
% q1 L8 } g" S target=_blank>网页特效</a></td>
4 Q4 e: E% C1 j& a x2 W0 y </tr>7 N7 Y4 j& K) ?& K6 }. q
</tbody> ) F s2 u. [) R9 ^
</table> |
|
发表于 2008-1-21 20:52
|