|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之带注释的表格菜单特效
一：将下面的代码放在<HEAD>与</HEAD>之间
% [1 ]. | v4 y9 [! k7 v<SCRIPT language=javascript >$ c8 z2 d% e0 B4 h
document.write(
" k( s/ [# _1 n( w' O0 Y1 e0 h"<div id=\"tooltip\" style=\"position:absolute;visibility:hidden; padding:3px;border:1px solid #528AC6;\
; M& z8 i- Q9 y5 x5 };background-color:#ffdfd0; height: 19px; left: 77px; top: 96px\"></div>");
/ M8 `, x: U0 Y
% ]5 N @$ a7 k) z% l, K# q/ efunction showtip(text) //显示链接的说明* j j+ c$ @/ B. J0 u0 h
{
4 P. X. d. R4 V, ~8 K6 m5 Y if (document.all&&document.readyState=="complete") //针对IE" |% ?; f9 v% P/ M9 q& c
{1 U( ?# G' Y7 v. C) Q
3 ], w5 q/ u2 i9 r+ w" V. @7 Y$ ` n
document.all.tooltip.innerHTML="<div vAlign=center><font SIZE=2>"+text+"</font></div>";
v4 I6 n3 G5 h) n document.all.tooltip.style.pixelLeft=event.clientX+document.body.scrollLeft+10;
7 @5 e4 r9 Y) D( e8 J' Q0 Q document.all.tooltip.style.pixelTop=event.clientY+document.body.scrollTop+10;1 k8 T" z6 v) }- U+ x" C7 P
document.all.tooltip.style.visibility="visible";* G5 H3 D+ ]4 Y2 a; O* y$ S
}
# Q3 Z3 C% C& I+ `}4 h+ R+ D% N0 z
7 _ ]$ ]/ y3 N3 t& |function hidetip()
* b6 o0 @+ L( Y{3 y6 o. V( p" d/ w" W
if (document.all)
6 y; ^7 T: a7 n: C7 M* k& |9 V document.all.tooltip.style.visibility="hidden";
0 V/ ?1 K2 s) [" w: a0 B1 m) }}" h1 l! S7 F' W
6 U; O5 @$ e* c5 g4 xfunction setcolor(fntcolor,bgcolor)( _8 x: e( w. u6 z
{+ g# [( b( R% o7 J5 I: O% v
document.all.tooltip.style.bgcolor=bgcolor;$ k/ _5 U* U/ f
document.all.tooltip.innerHTML.Color = fntcolor;2 f3 c) Y% L9 o# |# O' i
}
6 n3 \; O% h1 r# H2 E" L
& P0 U; W! s& s- C1 L: z. Y) Pfunction showhint(text)
* M' C" x& }4 h! t4 g& N{% X3 \9 D6 G: A; l5 |% |
onmousemove=showtip(text);# U4 o& [: A; A ]
onmouseover=showtip(text);/ B& Z8 s3 K2 }4 {" K8 e; p: |
onmouseout=hidetip();
& K7 {5 V' n6 n& j; ~! M}0 J7 t5 Q+ B: z# A3 J
</SCRIPT>
1 `7 S( ?/ t5 N; S
; | _3 j! q* G& _' m( x% e" P" \. z* m
: ~' h- u1 D( [1 N s
; I/ F2 ^1 M8 |- _
6 O* A4 D) l5 Z/ }
' K- W( K. X5 C3 x3 B7 M/ D) }3 @二：将下面的代码复制到〈BODY〉区, Y4 `7 ^- q: [( U/ h0 |: d' j
<table align=center border=1 bordercolordark=#ffffff bordercolorlight=#a8cbf1
! Q& `& P* l9 l0 k0 bcellspacing=0 class=t width="300" bordercolor="#6699CC" cellpadding="0">4 f) E) ?& ^' g' {: z% e; w2 o Z
<tbody> 2 H r+ t! |7 w# G8 h/ O
<tr align="center" bgcolor="#ffdfd0"> & B. j3 K; [8 m4 u1 U
<td height=9 width="25%" class="css3"><a href="../../sbtx.html" onMouseMove="showtip('赏心悦目<br>精美的图像和壁纸能使你得到一些放松！')" onMouseOut=hidetip() + |3 w; Y/ [9 N3 m y2 o. Q
target=_blank>赏心悦目</a></td>3 _8 i9 e A! _4 l. K
<td height=9 width="25%" class="css3"><a href="../../flashmenu1.htm" onMouseMove="showtip('网页素材<br>大量的网页素材给你的网页制作提供方便！')"
8 h4 ]3 h' R: @* s, M& l onMouseOut=hidetip()>网页素材</a></td>
6 i2 T4 Y2 o8 x$ a& e <td height=9 width="25%" class="css3"><a href="../../wyjcs.html" onMouseMove="showtip('图像处理<br>图形软件的使用以及图像的特效制作')" onMouseOut=hidetip() 8 S/ \8 ?$ r& j$ s5 r$ M z
target=_blank>图像处理</a></td>* C3 f6 `1 R- W ]9 L1 P
<td height=9 width="25%" class="css3"><a href="../../soft.htm" onMouseMove="showtip('网页特效<br>网页特效的大宝库，有详细的使用说明')" onMouseOut=hidetip() 8 {2 y" i- r: V. _! x4 f- I6 Q) D
target=_blank>网页特效</a></td>1 \5 B& T/ H- {5 N2 x
</tr>6 c* Q: H7 M6 u% @
</tbody>
% `9 m: z3 ~5 ~- ~% X </table> |
|
发表于 2008-1-21 20:52
|