|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之带注释的表格菜单特效
一：将下面的代码放在<HEAD>与</HEAD>之间- p: g3 T K( y( N% U
<SCRIPT language=javascript >
/ }' G( R2 R1 L2 Kdocument.write(% v3 L8 D/ F% ^
"<div id=\"tooltip\" style=\"position:absolute;visibility:hidden; padding:3px;border:1px solid #528AC6;\
) ~& s" d( W& x' O6 l/ ^;background-color:#ffdfd0; height: 19px; left: 77px; top: 96px\"></div>");
9 B' R J' ^& C% Y# V
( H, H1 }+ q8 S$ h3 N# _$ |" Ufunction showtip(text) //显示链接的说明
* ?2 B' a! w& H# C5 S; ^{
1 x$ a- @" I( X- p5 S if (document.all&&document.readyState=="complete") //针对IE
7 Y( f" C2 |. J% V) ] {5 \- o; |& W5 q" Q
! Q( o1 Y u3 c/ x. I* O document.all.tooltip.innerHTML="<div vAlign=center><font SIZE=2>"+text+"</font></div>";* l5 Q \- @! @: ^; Z: ?5 i; J' [
document.all.tooltip.style.pixelLeft=event.clientX+document.body.scrollLeft+10;
8 I, P. }6 s( f: E8 y document.all.tooltip.style.pixelTop=event.clientY+document.body.scrollTop+10;8 [% W: }5 h1 }3 W1 S. M
document.all.tooltip.style.visibility="visible";- p4 Y! s* `& r
}# w, D9 Y1 D7 h9 J- W: A
}
& F( T: i* U7 ?9 ~
7 Y# I5 P' n) Ufunction hidetip()
4 E$ J$ J+ B$ o: u: m9 Q/ L{
_7 d, o% U7 t6 K# |7 c4 ^# kif (document.all)! p' [5 L/ k+ g/ F$ V
document.all.tooltip.style.visibility="hidden";
& S3 G" }* o+ e ]; ]9 l) e. E}
0 d! d0 i; i! J* }, W0 B4 _( m `) d8 ^/ F/ R
function setcolor(fntcolor,bgcolor)2 b7 H% t" Z5 b/ ^- y' \
{! R7 b. U' a; w9 L o) r
document.all.tooltip.style.bgcolor=bgcolor;
7 l% K5 `/ R" i8 h# e+ S document.all.tooltip.innerHTML.Color = fntcolor;* K0 G: A6 Q# E$ E2 t
}6 w) \' C* A: u! O" S' M9 y. c
8 v" S4 e, ?# r# Z9 e6 O2 Efunction showhint(text)
; H6 X+ v% p* |/ \* }0 S{
, M; R# D; _. Q' Y7 R onmousemove=showtip(text);
; X F" O. l4 w- j9 g K onmouseover=showtip(text);
& v3 i9 \: D6 A+ p9 t6 R) ~0 t1 |; l onmouseout=hidetip();/ F) x) X N, E Z+ L3 C/ }
}
2 q5 `7 `( O* k5 s; j( l: z</SCRIPT>, q' p% {/ F. s5 ^+ L3 n& H
% L4 o3 Q) H: I+ ]
0 W* s0 n" C2 @5 {+ x# k; K" ~
" N9 ^- C; t' f3 H
2 H' a4 K$ E% q' |0 F7 _6 B3 H" r. `9 x! q% C; K, r+ r& p
' d7 s7 R4 z' v" ] a
二：将下面的代码复制到〈BODY〉区6 N y3 |, U6 Y% d2 c5 n ~
<table align=center border=1 bordercolordark=#ffffff bordercolorlight=#a8cbf1
4 c! A9 T4 H+ {cellspacing=0 class=t width="300" bordercolor="#6699CC" cellpadding="0">) \' t/ Y9 u( r# W
<tbody>
9 p k5 d1 T0 g3 W5 J <tr align="center" bgcolor="#ffdfd0">
- Q9 o, K f w; z/ _: } <td height=9 width="25%" class="css3"><a href="../../sbtx.html" onMouseMove="showtip('赏心悦目<br>精美的图像和壁纸能使你得到一些放松！')" onMouseOut=hidetip()
+ @+ Y1 ]$ k5 c! C target=_blank>赏心悦目</a></td>
" ]9 {3 B3 ?) D: E n" s. A <td height=9 width="25%" class="css3"><a href="../../flashmenu1.htm" onMouseMove="showtip('网页素材<br>大量的网页素材给你的网页制作提供方便！')" $ w% t8 S$ R9 @) C! u& [0 t
onMouseOut=hidetip()>网页素材</a></td>7 F/ [9 a$ H# D3 F6 A& s4 a9 E
<td height=9 width="25%" class="css3"><a href="../../wyjcs.html" onMouseMove="showtip('图像处理<br>图形软件的使用以及图像的特效制作')" onMouseOut=hidetip() 8 u5 D, K$ } J: N
target=_blank>图像处理</a></td>
/ C* z6 s: H: k7 U! }, w <td height=9 width="25%" class="css3"><a href="../../soft.htm" onMouseMove="showtip('网页特效<br>网页特效的大宝库，有详细的使用说明')" onMouseOut=hidetip() 0 c8 Y8 e9 B/ B
target=_blank>网页特效</a></td>
: Z6 N, u* _ d7 S </tr>
3 L' P4 \9 q7 g" h- J' t </tbody>
. v9 N, ?( N5 D1 Y+ R </table> |
|
发表于 2008-1-21 20:52
|