|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之带注释的表格菜单特效
一：将下面的代码放在<HEAD>与</HEAD>之间
+ u) ^8 @$ U: \" U8 H<SCRIPT language=javascript >
% {9 o6 c4 J! J1 B. J9 G0 zdocument.write() W' T. `& N! e3 a9 m+ a6 u% C
"<div id=\"tooltip\" style=\"position:absolute;visibility:hidden; padding:3px;border:1px solid #528AC6;\* G) h+ V$ P$ i5 ]/ K' p' o5 ^! m
;background-color:#ffdfd0; height: 19px; left: 77px; top: 96px\"></div>");
; g! a+ B# X. q
6 f( @& N0 c$ R0 O4 ?7 c! v# lfunction showtip(text) //显示链接的说明6 T$ v; a% N B; \0 J* u* E9 r0 Y
{! t, X) E: n+ @3 a
if (document.all&&document.readyState=="complete") //针对IE
6 t% ~0 O' s6 Q& p$ ? {: z6 C$ k& f) x
% Y8 U$ ^% ~0 y
document.all.tooltip.innerHTML="<div vAlign=center><font SIZE=2>"+text+"</font></div>";- X+ {8 y0 {" e; P& z
document.all.tooltip.style.pixelLeft=event.clientX+document.body.scrollLeft+10;0 c+ h( ^5 I+ P& ?
document.all.tooltip.style.pixelTop=event.clientY+document.body.scrollTop+10;
) a! N6 J, [% M0 C document.all.tooltip.style.visibility="visible";, w: u! C5 `; o% k
}
+ i5 W: I8 C, |- b}
; q$ n/ }- g5 ^4 w- a5 W+ E
3 V8 m9 x; ]" [$ n0 i- @* b3 Lfunction hidetip()
' j8 q8 S8 n, J9 }4 c! `5 z{
; e' c' F; g4 E* c% I* e4 Z) Dif (document.all)
- A7 Z9 m# F. { r' }) u document.all.tooltip.style.visibility="hidden";8 P* z" V4 O: T1 d, }2 ]9 \% b
}& ~- N! H7 s- Y2 \4 L4 t3 ]
. @& u6 ^3 U# Q0 d/ }- Ufunction setcolor(fntcolor,bgcolor)
7 l7 R7 \: ~! H0 @) y{
7 q! S2 N" {# a document.all.tooltip.style.bgcolor=bgcolor;9 C. i8 Z; l z _7 E
document.all.tooltip.innerHTML.Color = fntcolor;
! a. L8 V( S$ P- b& k% c& O}
' V" h: Y. X* d' c$ O! k$ N
z$ }# b2 d F3 }function showhint(text)
! x9 d& ~9 X- v! r8 Q{
! t' V* U+ A. q, t3 q! M/ l { onmousemove=showtip(text);9 X$ ?5 K, U! P1 a4 R% h; V" E a
onmouseover=showtip(text);9 Y( F- D- Q7 y7 ]' g
onmouseout=hidetip();( D. w/ c9 p) ~& @+ V5 K
}
9 e6 N6 S; p [/ F2 }</SCRIPT>2 [; U1 H# }+ [; a ]2 ^! Q) F2 d9 i
: ` A. p$ F0 H+ @0 o
& u* ?4 W0 m P% p- ?. s' {
3 A3 `, Y# X' S- s1 s. d! J
$ o6 u! i! F* |8 k N
6 ]6 Y" K5 v% ~8 c' p0 b) r$ [/ l0 [) O' e/ j
二：将下面的代码复制到〈BODY〉区5 z, c1 s' Q. W9 W4 L8 |" Q2 q
<table align=center border=1 bordercolordark=#ffffff bordercolorlight=#a8cbf1 1 E2 @% Q7 b: F* K4 k/ f, k- _
cellspacing=0 class=t width="300" bordercolor="#6699CC" cellpadding="0">1 i4 m8 Z- H) C5 H$ H S9 J! J2 p
<tbody> 4 [+ U3 Z: b+ `+ e
<tr align="center" bgcolor="#ffdfd0">
: ]7 f8 T# \9 _; d! L8 ~% P <td height=9 width="25%" class="css3"><a href="../../sbtx.html" onMouseMove="showtip('赏心悦目<br>精美的图像和壁纸能使你得到一些放松！')" onMouseOut=hidetip()
/ }( @& O# p- J5 e& e0 |" y target=_blank>赏心悦目</a></td>
8 a5 u9 X4 h# O* ^; u/ C, l <td height=9 width="25%" class="css3"><a href="../../flashmenu1.htm" onMouseMove="showtip('网页素材<br>大量的网页素材给你的网页制作提供方便！')" 3 t% m1 i) D% e* y. B
onMouseOut=hidetip()>网页素材</a></td>% n3 ~' E3 w5 u, N- |5 |
<td height=9 width="25%" class="css3"><a href="../../wyjcs.html" onMouseMove="showtip('图像处理<br>图形软件的使用以及图像的特效制作')" onMouseOut=hidetip()
H# t! `8 P, A) @( e% M target=_blank>图像处理</a></td>
- U7 \5 O0 [ H; ~ <td height=9 width="25%" class="css3"><a href="../../soft.htm" onMouseMove="showtip('网页特效<br>网页特效的大宝库，有详细的使用说明')" onMouseOut=hidetip()
) Z. x h; r* ]$ |. {: d target=_blank>网页特效</a></td>) o* Z, Z2 M* v
</tr>
4 w' Z# K/ n: L& y q+ A2 O7 @2 w </tbody>
) Z; v/ N; o+ ]* I, U" c- w$ j( T5 i' F </table> |
|
发表于 2008-1-21 20:52
|