|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之带注释的表格菜单特效
一：将下面的代码放在<HEAD>与</HEAD>之间9 [. ~6 n& N( K# B2 K e5 |
<SCRIPT language=javascript >: F8 I2 L: m$ R R: ?# T/ E
document.write(- _9 ?/ i6 \' p
"<div id=\"tooltip\" style=\"position:absolute;visibility:hidden; padding:3px;border:1px solid #528AC6;\
- H% }5 J# k2 n' |& a5 x4 h$ k;background-color:#ffdfd0; height: 19px; left: 77px; top: 96px\"></div>");
; p2 U8 |' i/ Q
q' M$ h& T/ n. J; p" Wfunction showtip(text) //显示链接的说明
7 l4 F1 A* V/ k. h* E/ K{
$ Y/ K8 z$ z* G( z! e2 a3 s1 K: n# f if (document.all&&document.readyState=="complete") //针对IE
2 O" m! f8 o: K" b) I# }6 o {
: |% a+ J" h F9 g$ V
( d3 Y9 Q0 X1 f: W. H- I+ X document.all.tooltip.innerHTML="<div vAlign=center><font SIZE=2>"+text+"</font></div>";# O' @: d8 R! m
document.all.tooltip.style.pixelLeft=event.clientX+document.body.scrollLeft+10;
4 G) I9 H+ L+ }" F# k* U5 y document.all.tooltip.style.pixelTop=event.clientY+document.body.scrollTop+10;
& q' c/ n! c4 j3 o% v document.all.tooltip.style.visibility="visible";9 H e7 p5 N3 O
}5 j4 \1 Q/ C" C% s
}+ ?8 D: G# a# k z( N1 i+ j
3 j% @& K* I! y2 Y2 efunction hidetip() 8 I' b& ]9 n: F" v2 ^
{/ D% e7 Y$ Y5 N
if (document.all). ]* L0 v7 P. S9 C
document.all.tooltip.style.visibility="hidden";
% H$ _, z \5 g! {* W' B+ J, U% a}
$ T+ @# }% O% Y! L
$ n4 F: g8 o4 S4 afunction setcolor(fntcolor,bgcolor)# T- t, h3 \3 X8 c7 @1 ^# F' z3 c+ s
{
3 A9 c( C2 J6 h document.all.tooltip.style.bgcolor=bgcolor;
. Y1 \' _6 n. H% T! b document.all.tooltip.innerHTML.Color = fntcolor;+ }; a9 @; i1 ^
} O9 E6 @$ ^! F. s0 k4 @
7 v$ p6 H1 k) ?function showhint(text)
, H. Y) ~" ], C{
+ Z! ]" P0 {! z" Q2 g* o. \ onmousemove=showtip(text);
" W5 d P5 u6 L! G- p onmouseover=showtip(text);
) X5 c! I1 K- z& d4 d& i" m onmouseout=hidetip();
6 a4 p: v0 O9 [+ i& U, e. d. N3 g9 }}
% S% [( V; ?8 j- @+ a</SCRIPT>& }8 T! H; R! w' U+ _. U& w2 W' b
% F( W) B1 e! }! V3 S$ o
- W/ j) P2 d" Y6 w% }+ D
! d( O" @- z8 X- a- J( p% B* |: w3 K+ s# Q# G4 R7 ]0 X2 t3 N
! U( } ^- v' q# m0 Y1 B) F% s# g$ j& W+ s' k/ `% L
二：将下面的代码复制到〈BODY〉区
& g4 V2 Z! I$ f$ F" y<table align=center border=1 bordercolordark=#ffffff bordercolorlight=#a8cbf1
4 G# A7 O( P0 z6 c& \- `; acellspacing=0 class=t width="300" bordercolor="#6699CC" cellpadding="0">
% c. _+ H) O% y0 V- n( w <tbody> . c% \0 ~' Z$ l; U: Y' U3 W3 G4 ^+ }
<tr align="center" bgcolor="#ffdfd0">
" x' M3 `( z% L% ~* V6 b% v <td height=9 width="25%" class="css3"><a href="../../sbtx.html" onMouseMove="showtip('赏心悦目<br>精美的图像和壁纸能使你得到一些放松！')" onMouseOut=hidetip() 3 J; Y8 g/ d' g1 J7 u3 P; F1 S5 k: i
target=_blank>赏心悦目</a></td>4 x& D% t5 c: g8 O
<td height=9 width="25%" class="css3"><a href="../../flashmenu1.htm" onMouseMove="showtip('网页素材<br>大量的网页素材给你的网页制作提供方便！')" ; o$ ^. h$ f, m4 i6 F7 C
onMouseOut=hidetip()>网页素材</a></td>
% S& [6 }* G# o7 C* `; c# d- e1 d <td height=9 width="25%" class="css3"><a href="../../wyjcs.html" onMouseMove="showtip('图像处理<br>图形软件的使用以及图像的特效制作')" onMouseOut=hidetip()
; q. y' v- u: g# v target=_blank>图像处理</a></td>9 w4 ]( C2 b: H1 Q- d& R
<td height=9 width="25%" class="css3"><a href="../../soft.htm" onMouseMove="showtip('网页特效<br>网页特效的大宝库，有详细的使用说明')" onMouseOut=hidetip()
8 v$ B6 T( R( O# [6 m( U target=_blank>网页特效</a></td>
2 ?& r7 b9 g6 B. Q' A$ W </tr>4 y8 o4 |% `6 ^; j
</tbody>
5 j0 ^+ D& J: C$ x7 v </table> |
|
发表于 2008-1-21 20:52
|