|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之带注释的表格菜单特效
一：将下面的代码放在<HEAD>与</HEAD>之间
+ l) Z) {0 f+ [1 f$ h<SCRIPT language=javascript >% @% R: g6 w6 j6 a; A7 B
document.write(
8 j# l# ^" X! O"<div id=\"tooltip\" style=\"position:absolute;visibility:hidden; padding:3px;border:1px solid #528AC6;\) h1 K' N, Z% Y8 \7 ^, u8 }* {
;background-color:#ffdfd0; height: 19px; left: 77px; top: 96px\"></div>");
/ ^5 z/ t1 N4 ]: F3 G% g
: F3 \3 I* e9 w0 Wfunction showtip(text) //显示链接的说明
+ L1 ?5 F" R, Q{6 G3 C3 T0 s: p0 t
if (document.all&&document.readyState=="complete") //针对IE* D( ~, q, E0 M/ a
{- ]) \3 p9 T. ^# r
# j; G5 u$ I/ }0 X; C+ n document.all.tooltip.innerHTML="<div vAlign=center><font SIZE=2>"+text+"</font></div>";
% Y9 j! p/ r4 V# n e1 {3 {$ w document.all.tooltip.style.pixelLeft=event.clientX+document.body.scrollLeft+10;
7 r/ u. j% s9 P1 H5 M+ \ document.all.tooltip.style.pixelTop=event.clientY+document.body.scrollTop+10;
* s5 ~4 I, R2 h8 I# U* _# ?% W document.all.tooltip.style.visibility="visible";& n6 T2 C$ E, t, r
}
5 }2 f8 t% G, e9 k9 j) H}
7 T0 w) e8 N, H; }( p ]& G t
3 a( A2 w+ n. [* Efunction hidetip()
$ T. ]# R3 }0 H7 O9 m5 R{
7 J' Y4 J+ @5 iif (document.all)1 W, d, D6 c# x# s
document.all.tooltip.style.visibility="hidden";
; a$ O- s1 m) r0 p6 g}" O, F) B8 l& Q5 v% j2 }8 h: K
) A. e5 a+ f% Y( R8 f% Qfunction setcolor(fntcolor,bgcolor)- I- h. B& T: r9 F5 v" I5 ]+ e
{
8 e! P& X* F; n- K* Q7 w9 A document.all.tooltip.style.bgcolor=bgcolor;, f0 D/ ]8 q9 p( ~5 y
document.all.tooltip.innerHTML.Color = fntcolor;
! }3 m# `- C+ o' L" ?# G7 u& x}9 x) @1 j4 c( p+ M
7 J! }9 h) m) R( z- G5 ^function showhint(text)( ^. k' m- }( W9 e! }2 y. R
{
( c+ c! W0 K& W onmousemove=showtip(text);' i; _$ v; A' D1 `9 y
onmouseover=showtip(text);
3 ^( G: Z4 l: w) B# J3 h onmouseout=hidetip();
: h& z8 Z6 `( ]4 \; h}
! J0 `: N9 O7 _' K7 N7 K. \* V</SCRIPT>) t2 m4 T# Z" X9 K! n; [
" l0 n; `& {& w* l3 p
, }2 w: }/ m1 G2 _2 [4 H$ m: C! T3 ^4 n/ N8 _8 ?
7 i8 D9 R) A* ]* W5 A0 Q y$ X
) t [+ x- N$ z" F+ t" ]
d: |$ T* s+ c7 \
二：将下面的代码复制到〈BODY〉区
8 ]' \$ r9 H& }9 n/ I1 ]<table align=center border=1 bordercolordark=#ffffff bordercolorlight=#a8cbf1
5 W) d( }2 ]2 D' |cellspacing=0 class=t width="300" bordercolor="#6699CC" cellpadding="0">9 M5 Q' D: m/ m4 M
<tbody> . U0 G- ?4 b2 ]! C6 y. J
<tr align="center" bgcolor="#ffdfd0"> : {3 P: X' l: g. y$ V
<td height=9 width="25%" class="css3"><a href="../../sbtx.html" onMouseMove="showtip('赏心悦目<br>精美的图像和壁纸能使你得到一些放松！')" onMouseOut=hidetip() / }: t2 I8 J7 \& W
target=_blank>赏心悦目</a></td>
; ~% j }) P/ f) o1 l: L. O <td height=9 width="25%" class="css3"><a href="../../flashmenu1.htm" onMouseMove="showtip('网页素材<br>大量的网页素材给你的网页制作提供方便！')"
6 X% t* |, g; q" B) Y onMouseOut=hidetip()>网页素材</a></td>( i3 N, A7 [) k5 ]! A2 g
<td height=9 width="25%" class="css3"><a href="../../wyjcs.html" onMouseMove="showtip('图像处理<br>图形软件的使用以及图像的特效制作')" onMouseOut=hidetip() : ~$ i6 T! G9 d' B M. S* J0 o
target=_blank>图像处理</a></td>
# Y2 k( y# h; g0 z' D, M <td height=9 width="25%" class="css3"><a href="../../soft.htm" onMouseMove="showtip('网页特效<br>网页特效的大宝库，有详细的使用说明')" onMouseOut=hidetip() 8 F4 z4 B7 T) c! a# w5 ], N$ x+ \
target=_blank>网页特效</a></td>
9 n: j% w2 _( n </tr> e! l) Z+ W1 @1 y8 {- T7 x% D
</tbody>
, x7 x. r5 o, R </table> |
|
发表于 2008-1-21 20:52
|