|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之带注释的表格菜单特效
一：将下面的代码放在<HEAD>与</HEAD>之间
1 Q0 k8 S& B% m7 J<SCRIPT language=javascript >( u* [2 u/ x$ I
document.write(& D) f4 N+ b: F
"<div id=\"tooltip\" style=\"position:absolute;visibility:hidden; padding:3px;border:1px solid #528AC6;\
! e4 a/ u4 v; d7 {9 d$ e3 @8 j;background-color:#ffdfd0; height: 19px; left: 77px; top: 96px\"></div>");2 J) z4 i6 X3 I8 w+ {
3 ?6 A, P* E2 s0 j h3 i
function showtip(text) //显示链接的说明
8 j: V: w2 G1 @' `' X6 G6 Q# n/ _{
4 D# F3 A( G3 s% W, D* T% y) ]+ J if (document.all&&document.readyState=="complete") //针对IE- h, m) _& @, f8 D, t. k3 W: e5 b
{+ ]! r$ K& f" g
, \3 Z' w! q, S6 g" N' J, y
document.all.tooltip.innerHTML="<div vAlign=center><font SIZE=2>"+text+"</font></div>";- \4 D5 _( j% u# Y1 n
document.all.tooltip.style.pixelLeft=event.clientX+document.body.scrollLeft+10; B6 k4 u ?' I- a8 x
document.all.tooltip.style.pixelTop=event.clientY+document.body.scrollTop+10;
3 ~5 d- H, @, V) y document.all.tooltip.style.visibility="visible";& M6 l, F6 Y$ T* p! |# R
}
( F! L" F4 o' c1 S}
- U; a$ `. N5 R0 B- Q6 m0 _' J8 x2 O. y f0 W7 ]
function hidetip() 1 F6 d) Q$ ^% W7 i
{
m9 |) P. d( \( Iif (document.all)2 o" i) |8 T! L" Z* h4 H3 o0 t
document.all.tooltip.style.visibility="hidden";
5 e+ o! P- b/ J3 D7 n: V}# J- j2 g, V. e2 C1 W3 F0 u
% L+ M/ t+ `$ r& O8 \# f/ t; G
function setcolor(fntcolor,bgcolor)
% `( O# X3 ]. m# v! V3 G3 O+ M# `{- m& Y* V: V" o, p
document.all.tooltip.style.bgcolor=bgcolor;& [: T$ C' N! ]. I$ x* F# l
document.all.tooltip.innerHTML.Color = fntcolor;
9 r8 X p# ^, C$ j/ B}
8 l' Y- y9 {+ u/ Z6 Y& K" [) i8 S
, L% ]9 [/ ~0 U6 t* N7 Hfunction showhint(text)1 ?- d; c2 Z8 H# n, v
{9 r+ ~) V, W1 k( ?& w
onmousemove=showtip(text); m" @, N6 k) A) g) Z) l
onmouseover=showtip(text);- u/ n+ E& H& V* w8 \+ k
onmouseout=hidetip();9 ^! r2 M, C# }3 e* Y# Q/ D# N4 h2 Y
}2 { p. P; {* R7 y8 O
</SCRIPT>0 V6 H+ e; S! j3 a5 }' ^
0 R5 U7 B$ [1 g& l: I0 D* s. D
* L9 J: P8 {- k4 a+ v1 ^9 S( I5 ?: B# H: r9 ~+ `
* B' d9 W4 C# S9 O- v/ L/ [
( h8 M& p* `* [/ i1 ?
. V: f' \! d2 c; F二：将下面的代码复制到〈BODY〉区7 R9 @! F- G3 N+ j0 l) [+ l$ T
<table align=center border=1 bordercolordark=#ffffff bordercolorlight=#a8cbf1
1 W$ L v0 t E5 p1 ?; [* qcellspacing=0 class=t width="300" bordercolor="#6699CC" cellpadding="0">, ~0 `- c0 q- S! g( i
<tbody> % F8 k6 P% N' O- s- V9 j
<tr align="center" bgcolor="#ffdfd0"> 0 x; C, y% ^- d& l& l
<td height=9 width="25%" class="css3"><a href="../../sbtx.html" onMouseMove="showtip('赏心悦目<br>精美的图像和壁纸能使你得到一些放松！')" onMouseOut=hidetip() , W8 S/ j4 h* e, g+ M
target=_blank>赏心悦目</a></td>3 @3 V- z Y' z4 o- e
<td height=9 width="25%" class="css3"><a href="../../flashmenu1.htm" onMouseMove="showtip('网页素材<br>大量的网页素材给你的网页制作提供方便！')" 8 ?6 |; D1 }) t/ b
onMouseOut=hidetip()>网页素材</a></td>
/ A; C [! K q5 B l7 b <td height=9 width="25%" class="css3"><a href="../../wyjcs.html" onMouseMove="showtip('图像处理<br>图形软件的使用以及图像的特效制作')" onMouseOut=hidetip() o4 X( n1 C, M6 ]! C. {6 \: x# G
target=_blank>图像处理</a></td>( f: S3 s' d2 T0 Z
<td height=9 width="25%" class="css3"><a href="../../soft.htm" onMouseMove="showtip('网页特效<br>网页特效的大宝库，有详细的使用说明')" onMouseOut=hidetip() 2 i t# ]0 W/ ]9 ]) W6 }( p
target=_blank>网页特效</a></td>$ P: W7 r% V7 Q
</tr>: L6 E4 ?/ h$ m" t; X$ C O
</tbody> x2 G( w/ w1 y% @
</table> |
|
发表于 2008-1-21 20:52
|