|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之带注释的表格菜单特效
一：将下面的代码放在<HEAD>与</HEAD>之间9 J: N7 q4 k) ^; D2 H% `
<SCRIPT language=javascript >
\9 r# ?7 b# ^( `1 mdocument.write(" o6 L+ w, T& n' E: ~& V( F
"<div id=\"tooltip\" style=\"position:absolute;visibility:hidden; padding:3px;border:1px solid #528AC6;\9 B1 R: u" g- }% B% e" f
;background-color:#ffdfd0; height: 19px; left: 77px; top: 96px\"></div>");
9 y0 E; F8 Y. v* \ b- ~: l. o( X& g- C# q& E
function showtip(text) //显示链接的说明
1 c( L- d3 V, i* X{
- g* T/ z2 e% a5 \+ H7 X if (document.all&&document.readyState=="complete") //针对IE
9 W" j5 e3 o- e {" P6 \& c. M1 c/ _' T& d
/ w# [4 ?2 e- [! W( b# p' X document.all.tooltip.innerHTML="<div vAlign=center><font SIZE=2>"+text+"</font></div>";% Z- {9 J8 m$ \# N
document.all.tooltip.style.pixelLeft=event.clientX+document.body.scrollLeft+10;
: g9 ~4 M- w: f document.all.tooltip.style.pixelTop=event.clientY+document.body.scrollTop+10;& P+ r) b7 O) Z: S
document.all.tooltip.style.visibility="visible";( I2 a! Z, f Y
}2 `+ o& L1 ]' U( O1 r2 [
}3 Z" X/ ^, n% F- B' c
: B d9 U; P/ J
function hidetip() ) _) p# U, d* |+ a/ _
{
; F6 A) V4 w% W# V! c3 xif (document.all)
; E2 Y R T' s9 | v document.all.tooltip.style.visibility="hidden";
0 s& N+ K. @; P6 V$ N} ~) [3 @& u/ G) V( @9 G' |+ H
# s8 D0 W3 N! O6 F$ r5 z7 qfunction setcolor(fntcolor,bgcolor)
- j, \8 }3 J* f1 L& T# ^4 }4 _5 J{
- j8 k! g* K8 Z$ y: S3 y document.all.tooltip.style.bgcolor=bgcolor;3 b# G# l5 m( ~- R1 Y
document.all.tooltip.innerHTML.Color = fntcolor;5 l& c- v' H/ s, _& M- ]8 T, Z
}0 ?9 j& w2 O9 x- F5 A) L1 h
# v7 U: X$ h+ X1 D: o
function showhint(text): A: q# I( u- I5 V! _1 I, v; y
{
" e1 ]% O: q# w onmousemove=showtip(text);
3 E: @5 y- c: e/ O( F. m onmouseover=showtip(text);- e+ X4 _2 {: ?! i6 ], l+ P
onmouseout=hidetip();
, y: y- l% y% T; f- R, u. Q' ]$ M}
$ g9 |: t+ r0 h2 U4 h" Q</SCRIPT>
* Q* j0 P' R0 E7 j8 D+ Q w" g8 w. d: n
( z% n' a$ }: k# C6 X
6 B d* |7 o5 _4 G- ? G0 a1 h t. [3 T% r/ n6 W5 O
+ e. Y3 z5 r4 R; A8 p( H; Q
1 i6 {1 \, I) a5 n3 ~7 L1 z3 p1 @二：将下面的代码复制到〈BODY〉区; H. h7 L( d) J- T! x" n
<table align=center border=1 bordercolordark=#ffffff bordercolorlight=#a8cbf1
8 R# t; n, u B! B& U' K$ {- B% Jcellspacing=0 class=t width="300" bordercolor="#6699CC" cellpadding="0">7 p0 ?; x+ p/ F% u: |
<tbody>
( I) G" b' |* P$ n) g9 _% k <tr align="center" bgcolor="#ffdfd0"> 1 n7 C, `- y; F3 x
<td height=9 width="25%" class="css3"><a href="../../sbtx.html" onMouseMove="showtip('赏心悦目<br>精美的图像和壁纸能使你得到一些放松！')" onMouseOut=hidetip() # V0 N7 o7 V+ @9 x9 g" \
target=_blank>赏心悦目</a></td>4 h) Q1 M; |/ c8 O8 P3 d" J
<td height=9 width="25%" class="css3"><a href="../../flashmenu1.htm" onMouseMove="showtip('网页素材<br>大量的网页素材给你的网页制作提供方便！')"
' a2 a/ w& O# t2 H7 Y onMouseOut=hidetip()>网页素材</a></td>
5 ]9 }7 T/ J! t( h) d <td height=9 width="25%" class="css3"><a href="../../wyjcs.html" onMouseMove="showtip('图像处理<br>图形软件的使用以及图像的特效制作')" onMouseOut=hidetip()
4 g+ F _2 N* g- q1 G& A target=_blank>图像处理</a></td>
* s" D e/ q2 ]) E <td height=9 width="25%" class="css3"><a href="../../soft.htm" onMouseMove="showtip('网页特效<br>网页特效的大宝库，有详细的使用说明')" onMouseOut=hidetip() - J( c3 k D9 a4 X; C4 Q
target=_blank>网页特效</a></td>
3 V2 T8 X% P9 I% o </tr>
2 P! \. f# y. G& ~ </tbody>
" r4 j. t5 l: Y7 ~- m9 M </table> |
|
发表于 2008-1-21 20:52
|