|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之带注释的表格菜单特效
一：将下面的代码放在<HEAD>与</HEAD>之间1 R, q: d9 `* H1 l( k8 b. U
<SCRIPT language=javascript >) P; Q" C' n: ~/ m; m7 }/ G
document.write( S& L) k$ ~3 S) d/ `: E Y! T
"<div id=\"tooltip\" style=\"position:absolute;visibility:hidden; padding:3px;border:1px solid #528AC6;\
( }9 y8 b' s/ @( Q( @% l" W;background-color:#ffdfd0; height: 19px; left: 77px; top: 96px\"></div>");4 O- y0 P& o* q
p" o. W' A z
function showtip(text) //显示链接的说明0 D/ o' F' P. c" E# g2 L G
{* R. o5 }9 O7 {9 \- |* j
if (document.all&&document.readyState=="complete") //针对IE3 y& B. k# }" C1 F% U# w$ S0 Z
{) A7 y! [# }# r, Y
: C. F: H7 @ M* v5 w document.all.tooltip.innerHTML="<div vAlign=center><font SIZE=2>"+text+"</font></div>";
7 z) d0 q6 l! A* I* K, C4 ~5 t document.all.tooltip.style.pixelLeft=event.clientX+document.body.scrollLeft+10;
* {, |: }, x4 _! k$ s document.all.tooltip.style.pixelTop=event.clientY+document.body.scrollTop+10;, L S4 R( b% d6 j; O
document.all.tooltip.style.visibility="visible";
6 X; y$ I; R- g8 Z }
! Q0 l( o4 W* m2 L9 N; q: I5 |}: o; ~. s i$ Q4 G
2 {% H; ~4 O6 P+ O _ q
function hidetip()
4 X' W" y; ]6 M1 t; R{$ y' i: \. P/ X, a+ @6 ]
if (document.all). R: U& H% B6 `4 R1 U
document.all.tooltip.style.visibility="hidden";
- V# P* w" d. V1 X, ^9 L/ C, Z}
# Q9 m9 K' q9 B- b# S% k8 q, O8 e" l V+ N" D- d, P1 i) G
function setcolor(fntcolor,bgcolor)
, _/ o1 X) d1 s& i2 l( C/ \& t{* a, G* ~# x7 A0 l8 n/ r" w7 a
document.all.tooltip.style.bgcolor=bgcolor;
( b5 f0 d" \, l% A$ t. e7 X document.all.tooltip.innerHTML.Color = fntcolor;* i1 B) {+ J4 J1 I2 I
}; J- E p% J& _; W2 y
+ A8 b% D6 d; _" E
function showhint(text)9 m8 I$ E7 T/ h
{
5 L' b7 N5 r" M' i onmousemove=showtip(text);
8 x6 o, Y T W- G% l onmouseover=showtip(text);
) \: u, C0 \! | onmouseout=hidetip();* h6 H/ _$ y: a& A3 i. K0 H
}
0 G1 r- I+ ?% c</SCRIPT>! Y2 R) C, I4 O# k; G. J; K5 O/ p
/ O# M0 i( `" R+ x/ ^# }" m h
* v! `0 a, S* T# a$ L' P4 x3 B _# f& F& c
, J$ R9 g6 D. B' o6 B z: r' E; S
9 y7 E/ J: |9 |8 i' U/ G5 z: i+ {: _$ K
+ _2 U! O9 V: t) Q3 ^# g二：将下面的代码复制到〈BODY〉区; W& G& h6 d3 d
<table align=center border=1 bordercolordark=#ffffff bordercolorlight=#a8cbf1 ) j) {+ F+ {1 j8 Y. b7 k* W) c3 {% e
cellspacing=0 class=t width="300" bordercolor="#6699CC" cellpadding="0">
3 p5 M% ?: S3 ]8 { <tbody>
/ M$ y; l% e1 \- c3 e <tr align="center" bgcolor="#ffdfd0"> ! Y* [6 O# U0 e! ^3 A% Q! b& Q
<td height=9 width="25%" class="css3"><a href="../../sbtx.html" onMouseMove="showtip('赏心悦目<br>精美的图像和壁纸能使你得到一些放松！')" onMouseOut=hidetip() 8 x$ [! I9 K6 O8 O& r, w- I
target=_blank>赏心悦目</a></td>. V. R' _6 N- r) [- j9 F. I
<td height=9 width="25%" class="css3"><a href="../../flashmenu1.htm" onMouseMove="showtip('网页素材<br>大量的网页素材给你的网页制作提供方便！')"
! L5 L6 E% |/ L7 m% h4 B* Z onMouseOut=hidetip()>网页素材</a></td>$ M) z) E% T$ g' [! R
<td height=9 width="25%" class="css3"><a href="../../wyjcs.html" onMouseMove="showtip('图像处理<br>图形软件的使用以及图像的特效制作')" onMouseOut=hidetip() ) d) m @4 ]5 Y+ P' Z0 H2 \
target=_blank>图像处理</a></td>2 M& J' v% m0 P/ N* D
<td height=9 width="25%" class="css3"><a href="../../soft.htm" onMouseMove="showtip('网页特效<br>网页特效的大宝库，有详细的使用说明')" onMouseOut=hidetip()
@8 a" C% i8 a- f, k) o! b4 ]: q target=_blank>网页特效</a></td>
- a5 b& F7 y; W3 R) H </tr>5 m, H* Y* D& n2 t7 w. w3 z
</tbody> # `; P3 \1 ~4 g8 H
</table> |
|
发表于 2008-1-21 20:52
|