|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之带注释的表格菜单特效
一：将下面的代码放在<HEAD>与</HEAD>之间! }$ I/ J) T* `% M% P3 Y6 C
<SCRIPT language=javascript >
+ V) ]. ?7 |. [* d' f; J5 Bdocument.write(
# v" K9 d7 _ [7 U, S/ h& M$ j"<div id=\"tooltip\" style=\"position:absolute;visibility:hidden; padding:3px;border:1px solid #528AC6;\
3 n; u+ C' f$ {! m( C;background-color:#ffdfd0; height: 19px; left: 77px; top: 96px\"></div>");
! j$ h5 g: N; ^; G* A2 n, J- }
- }" @+ B. I- S3 ?3 a" }3 A# Bfunction showtip(text) //显示链接的说明/ @' J" L6 k/ N! B, L0 _/ ?. w
{* _( ~! X( r. f L% j9 k
if (document.all&&document.readyState=="complete") //针对IE
. _# j6 N! ?* m" X9 P {: L- E# Y! f1 H* _
3 F$ ?) L8 m* i. \+ ] document.all.tooltip.innerHTML="<div vAlign=center><font SIZE=2>"+text+"</font></div>"; c6 {, ]+ ?" ]3 a* S: Y+ z
document.all.tooltip.style.pixelLeft=event.clientX+document.body.scrollLeft+10;
. o2 ~& k9 U( {, M! _8 j document.all.tooltip.style.pixelTop=event.clientY+document.body.scrollTop+10;
. o. t0 [" h. {& j document.all.tooltip.style.visibility="visible";
, Y( e# i; b4 R, \ }
1 l1 g; _4 h1 c/ D" L}: k$ D* ^: ^& I6 E9 P
9 u* Q! E) ^8 ^4 m; b' Vfunction hidetip() 0 J4 o1 V# N) P5 [/ e% Y; V
{: z; Q! n+ S( T; D6 p* _' {
if (document.all)$ |0 N1 i- m0 O) S$ C! [! M0 N% o% W
document.all.tooltip.style.visibility="hidden";
$ V+ [" S& {' z9 D}
5 _% O( C5 p/ H- o8 j" }; r3 Z7 L$ J6 X1 d8 {& L
function setcolor(fntcolor,bgcolor)
/ s4 D' G, T4 ~( P9 v" l- n{
. M6 v) \* ]" J/ x document.all.tooltip.style.bgcolor=bgcolor;$ }4 h" K3 l( \% B3 S
document.all.tooltip.innerHTML.Color = fntcolor;
5 Y: z& F* h; X i+ p}) a* p% l; h1 {) P8 F ^" q* R
/ X6 W& y6 ~4 `8 |" r* q7 G
function showhint(text)$ n; [# n5 K. @% E% v
{
" D. L) `2 W: o% T/ I3 K onmousemove=showtip(text);
8 }; q% ?0 ^9 b! t0 c- R6 q onmouseover=showtip(text);
/ a- d$ P( A( y+ n5 { onmouseout=hidetip();
9 c. A* ~1 `, C- j$ o& u. l}8 }" L9 u9 `' z1 {& \+ A8 A
</SCRIPT>
3 n' k( Y5 a- A7 U' |3 o* x
( A, K+ [0 l7 \6 Y
$ p3 v. q) ?2 y4 O. D7 I
( c5 k' J8 g4 d) o1 p: `
6 B3 p0 R+ ~: R1 D n8 g" [3 ]5 x4 ?8 T0 V
3 v- {3 m5 v* h) e3 d, }) n
二：将下面的代码复制到〈BODY〉区
! t4 S- I3 s3 Q% S<table align=center border=1 bordercolordark=#ffffff bordercolorlight=#a8cbf1 " V: b8 k0 Z% V' v
cellspacing=0 class=t width="300" bordercolor="#6699CC" cellpadding="0">7 ~0 g! P% X# v7 S
<tbody> - t& [" _; P( c3 r- y7 `
<tr align="center" bgcolor="#ffdfd0">
: A( S H7 V# u, w3 K <td height=9 width="25%" class="css3"><a href="../../sbtx.html" onMouseMove="showtip('赏心悦目<br>精美的图像和壁纸能使你得到一些放松！')" onMouseOut=hidetip() 6 `# P9 V' @: O" U
target=_blank>赏心悦目</a></td>+ Z- y1 x; ^# K3 O9 K- l
<td height=9 width="25%" class="css3"><a href="../../flashmenu1.htm" onMouseMove="showtip('网页素材<br>大量的网页素材给你的网页制作提供方便！')" 0 _( ^5 G, ^0 r/ l' M! y1 C& g
onMouseOut=hidetip()>网页素材</a></td>* L4 c" ?: Y4 ?" I; V* F
<td height=9 width="25%" class="css3"><a href="../../wyjcs.html" onMouseMove="showtip('图像处理<br>图形软件的使用以及图像的特效制作')" onMouseOut=hidetip() 4 i& ]+ z- r1 ~! q# J2 s) S) k
target=_blank>图像处理</a></td>
6 t6 a* A7 j2 M2 o/ w <td height=9 width="25%" class="css3"><a href="../../soft.htm" onMouseMove="showtip('网页特效<br>网页特效的大宝库，有详细的使用说明')" onMouseOut=hidetip() $ e% \. ?4 y) J8 N2 s
target=_blank>网页特效</a></td>/ T$ c$ Q* c' ], l
</tr>
3 f' U4 g; x8 J9 s1 U </tbody>
+ [6 w* H8 N( T' H) r </table> |
|
发表于 2008-1-21 20:52
|