|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之带注释的表格菜单特效
一：将下面的代码放在<HEAD>与</HEAD>之间, t2 N E5 ?7 y [8 `/ I- H( ~! j
<SCRIPT language=javascript > Y& l6 e8 e; f" q
document.write(
: A' c# P* {# E- X5 l"<div id=\"tooltip\" style=\"position:absolute;visibility:hidden; padding:3px;border:1px solid #528AC6;\
) R, g0 h! G9 t4 o. q7 T+ ?;background-color:#ffdfd0; height: 19px; left: 77px; top: 96px\"></div>"); p' S% M+ x: j4 }9 w
. |. s; r9 O. u7 Jfunction showtip(text) //显示链接的说明
* Z! T: T/ }; P) I1 c. z5 h; a{* Z% D/ }5 {+ z3 p8 j
if (document.all&&document.readyState=="complete") //针对IE' z' ]+ z3 ?# L: \
{: U; t) [! P$ q3 M" u
: v+ K' D2 t& N# Z6 I, g; A
document.all.tooltip.innerHTML="<div vAlign=center><font SIZE=2>"+text+"</font></div>";
0 v' Q% `7 _8 a6 Z document.all.tooltip.style.pixelLeft=event.clientX+document.body.scrollLeft+10;
) ?& R! e6 {# \/ d document.all.tooltip.style.pixelTop=event.clientY+document.body.scrollTop+10;# R) Y; o7 }5 o+ h5 B* n
document.all.tooltip.style.visibility="visible";
8 V5 V/ N- [* K6 a+ d }
% R) d$ ]3 H( Q( N: ]3 y! g}6 g3 S0 y# g6 Q- d: N1 ]
$ E; a$ k4 o, t/ Q
function hidetip() # I5 C) m |" |
{# @" |5 h w7 n2 `( u9 ?
if (document.all)
" o5 @. Q4 g0 m% D7 R) _ document.all.tooltip.style.visibility="hidden";
$ w; [# L! I0 S3 ~- n; h( E5 n}
( O5 _% r# o6 E8 \. }1 j' \$ m/ X- @
9 X6 }2 B0 {$ n6 R7 Afunction setcolor(fntcolor,bgcolor)4 J$ v7 B5 E2 S- F6 x
{
' l# ], `( b$ [+ r document.all.tooltip.style.bgcolor=bgcolor;; U( E9 Z7 q8 G, d
document.all.tooltip.innerHTML.Color = fntcolor;' i" S+ Z& I1 n6 d3 V& x6 W& B8 _. b. p4 w! i
}
. c0 A5 S0 B+ a, \. ?
3 j0 K. y5 R& a5 E. Vfunction showhint(text)) A7 [- k0 W6 f8 S
{
! ~0 S7 f1 ^& {/ o$ D3 j4 H onmousemove=showtip(text);: T# _3 T; I2 C0 c0 v
onmouseover=showtip(text);
) T( w: T5 V7 f) W1 N2 H onmouseout=hidetip();
0 b7 [2 a0 t' @) S1 @( f}
; V' [8 |% ^5 q</SCRIPT># s3 R' |. F2 H- ^2 S2 ^3 ?
: D# b% \0 H1 z- D' O
- ~# Q2 Z0 B/ T* S5 Z2 C' z
9 R( a+ [6 Y7 e6 Z& |3 p( H$ g5 r3 }5 S
+ x% ~7 `- D# g) r V2 B2 V, G- L) ]/ d, @6 T0 P
二：将下面的代码复制到〈BODY〉区% ~) ^+ q; O. i/ _$ W
<table align=center border=1 bordercolordark=#ffffff bordercolorlight=#a8cbf1
& @; x P5 k1 t# D( Ycellspacing=0 class=t width="300" bordercolor="#6699CC" cellpadding="0">% n$ m6 G% s8 i0 w) Q" O
<tbody> : r# F( j" ~. P# P9 ^- X
<tr align="center" bgcolor="#ffdfd0"> + H, q% T6 L; D( y
<td height=9 width="25%" class="css3"><a href="../../sbtx.html" onMouseMove="showtip('赏心悦目<br>精美的图像和壁纸能使你得到一些放松！')" onMouseOut=hidetip() % S$ q: h0 D$ c D+ f% r( v
target=_blank>赏心悦目</a></td>
4 D; J$ e# w w7 n8 g, _/ O <td height=9 width="25%" class="css3"><a href="../../flashmenu1.htm" onMouseMove="showtip('网页素材<br>大量的网页素材给你的网页制作提供方便！')" . I+ h' a1 \: U, D8 G
onMouseOut=hidetip()>网页素材</a></td>
; d1 ~2 e" |- M ]2 R <td height=9 width="25%" class="css3"><a href="../../wyjcs.html" onMouseMove="showtip('图像处理<br>图形软件的使用以及图像的特效制作')" onMouseOut=hidetip() 2 H$ W5 a E/ Z
target=_blank>图像处理</a></td>
; S2 ]- D0 _! h, h8 J+ {5 E <td height=9 width="25%" class="css3"><a href="../../soft.htm" onMouseMove="showtip('网页特效<br>网页特效的大宝库，有详细的使用说明')" onMouseOut=hidetip() 0 ~% `7 b# n7 s1 n& g q3 Z
target=_blank>网页特效</a></td>
7 V$ X# l% E$ N- J* h3 D, e/ E </tr>
) D' K0 ?+ v4 T3 v& m </tbody>
- C4 d' R! G& D( }" w; w P% U </table> |
|
发表于 2008-1-21 20:52
|