|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之带注释的表格菜单特效
一：将下面的代码放在<HEAD>与</HEAD>之间& i9 q* {. ^7 b @ _3 T
<SCRIPT language=javascript >
# m/ f* x: [0 i/ ~7 U) J! B8 Fdocument.write(8 [+ h: A3 Y, Y2 ]; [
"<div id=\"tooltip\" style=\"position:absolute;visibility:hidden; padding:3px;border:1px solid #528AC6;\
1 z/ X+ F6 b$ C- {& G;background-color:#ffdfd0; height: 19px; left: 77px; top: 96px\"></div>");5 f4 k, |# q" E8 c
0 F8 `, U. T7 q7 I4 T/ bfunction showtip(text) //显示链接的说明- X6 A0 B4 g) Y
{9 Q2 O+ A: A+ R4 Y7 K# V( f
if (document.all&&document.readyState=="complete") //针对IE
- S& U2 {- d6 X3 s- B; } {! G- f5 D: H" ^' \8 z
# L. E& Y2 M3 M8 r$ t( g document.all.tooltip.innerHTML="<div vAlign=center><font SIZE=2>"+text+"</font></div>";
5 Q6 i: U, t# [# T' V& | document.all.tooltip.style.pixelLeft=event.clientX+document.body.scrollLeft+10;$ a& O3 S% k- o7 x G* d
document.all.tooltip.style.pixelTop=event.clientY+document.body.scrollTop+10;
$ R- v( j) Z3 d! o6 ~ document.all.tooltip.style.visibility="visible";3 J! g; g- v- z! U! k: V0 e
}4 p/ I2 w- T; z/ G" d
}1 h! _3 c- a4 b" |9 v) @
1 ]: L# g$ w/ P' ^+ d8 A$ y. Ifunction hidetip() 7 n5 J4 P/ e5 C) I
{9 k$ K4 j) k0 X) ]$ O5 B' g
if (document.all)5 ?5 g' Z- f3 V+ [! Z9 X
document.all.tooltip.style.visibility="hidden";8 M3 D4 P6 ]+ i7 K% q7 e4 _
}( p' q# }+ [0 g0 } d& D
1 e" V4 V& l: z+ D( j. Ofunction setcolor(fntcolor,bgcolor)- v e) D5 @0 U9 s
{
% w9 w( \6 l! ~2 \ O document.all.tooltip.style.bgcolor=bgcolor;% F$ h) u1 l V" z- }" j
document.all.tooltip.innerHTML.Color = fntcolor;
8 W9 ] ]* F6 v. m} \4 X* S$ z. X% s
/ i: U3 U" ^& F- v7 Pfunction showhint(text)
' B! z& Q s+ l+ }0 u: F{0 ]. n9 R$ ~4 @# Y5 U) Z
onmousemove=showtip(text);1 t0 u. h; @) J; P
onmouseover=showtip(text);4 j0 Y+ a8 P, m! M3 n
onmouseout=hidetip();
x5 h9 M4 N. H* s0 w+ p/ G}: X& ]- V( u- B$ T+ f1 ]
</SCRIPT>4 u, d2 a4 m% {# n! R. e- Z
8 |8 P0 Q- }5 S, Q7 J
( e- E7 j+ W4 [3 [
' b! J! m+ }. v6 E- |. Y( j# N# q7 \' b# M" v" t
# J6 d- w: V! ?$ [5 K7 \
/ ]! `+ E& [2 a y5 Y" e K$ T二：将下面的代码复制到〈BODY〉区
. Q6 i# Q& C) D1 c! m$ w+ w( p<table align=center border=1 bordercolordark=#ffffff bordercolorlight=#a8cbf1 3 V- Z; S/ F/ U0 @+ l- E
cellspacing=0 class=t width="300" bordercolor="#6699CC" cellpadding="0">
# z/ H, y4 u: r3 k9 V( v <tbody>
. i8 W, E8 Q$ ]) w+ T, k <tr align="center" bgcolor="#ffdfd0">
; u& F9 R; Z' R5 z0 j! Y6 ]7 A <td height=9 width="25%" class="css3"><a href="../../sbtx.html" onMouseMove="showtip('赏心悦目<br>精美的图像和壁纸能使你得到一些放松！')" onMouseOut=hidetip()
4 Y. p" e q) z2 S/ {6 z target=_blank>赏心悦目</a></td>
% |7 L: @0 ~& W) j7 i! N/ q <td height=9 width="25%" class="css3"><a href="../../flashmenu1.htm" onMouseMove="showtip('网页素材<br>大量的网页素材给你的网页制作提供方便！')" + w$ A$ e0 h1 n! I& s+ p
onMouseOut=hidetip()>网页素材</a></td>
: Q* ]0 E q$ {+ ]6 W <td height=9 width="25%" class="css3"><a href="../../wyjcs.html" onMouseMove="showtip('图像处理<br>图形软件的使用以及图像的特效制作')" onMouseOut=hidetip() - A* `4 z- h! K2 f
target=_blank>图像处理</a></td>9 f! [- Y+ d5 G$ O) E6 A: [, A
<td height=9 width="25%" class="css3"><a href="../../soft.htm" onMouseMove="showtip('网页特效<br>网页特效的大宝库，有详细的使用说明')" onMouseOut=hidetip() : ^! @3 |. x! |1 ]; h
target=_blank>网页特效</a></td>
: I$ w/ ?( V g% [ o: ? </tr>
* d4 u N0 B( o0 N& f. R </tbody>
% c# V4 K S; d& n& k8 L! @9 q </table> |
|
发表于 2008-1-21 20:52
|