|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之带注释的表格菜单特效
一：将下面的代码放在<HEAD>与</HEAD>之间8 O; W7 `, _/ a
<SCRIPT language=javascript >
5 w3 [6 x6 J$ k" ^% Hdocument.write(
0 Y% _0 v, H5 B% p- @7 _"<div id=\"tooltip\" style=\"position:absolute;visibility:hidden; padding:3px;border:1px solid #528AC6;\& q* [4 O) O9 o5 E, p# B; R
;background-color:#ffdfd0; height: 19px; left: 77px; top: 96px\"></div>");% n5 t( m$ R3 h
) o( g* p% q5 D( l8 y) Nfunction showtip(text) //显示链接的说明
+ }) W' l6 J- d f1 ~{; }' t4 S- Z" J9 E0 H' X
if (document.all&&document.readyState=="complete") //针对IE1 y2 G7 ?1 F t) @4 S+ h6 L
{6 S, R$ @* s+ V7 g
- d L1 W' ]* n; `/ M7 }9 r8 H document.all.tooltip.innerHTML="<div vAlign=center><font SIZE=2>"+text+"</font></div>";
, s, z0 z [6 e6 | v document.all.tooltip.style.pixelLeft=event.clientX+document.body.scrollLeft+10;
. g" R& e4 F6 Y9 ^' e! d document.all.tooltip.style.pixelTop=event.clientY+document.body.scrollTop+10;5 h3 ?. A: n0 V* | U) B
document.all.tooltip.style.visibility="visible"; z& f- ?1 x5 n4 e; t! {
}. w; G O( _, j, t5 B
}
' b0 ?( O; \5 I6 b2 a6 ^
+ w) U/ [$ F/ b+ y) {3 {function hidetip() ; C+ N: b. Q/ O
{
; _* W4 g1 H9 j9 cif (document.all)
: B% v! z8 K& i* X) w; Q3 F4 e document.all.tooltip.style.visibility="hidden";1 R# q' {7 r" a& V
}4 `8 j, m6 N; H
" p; B/ c. I! h. s _function setcolor(fntcolor,bgcolor)4 b6 U! j+ Q% S2 v/ M
{
$ x; @) `9 Y5 E& E/ p, f6 v% C document.all.tooltip.style.bgcolor=bgcolor;
4 u4 L- Y3 U# W! a7 F/ u document.all.tooltip.innerHTML.Color = fntcolor;
$ D+ z2 ^ [, ^/ T9 t! Z}6 Z, c5 d7 z1 z, K
8 P# L4 e4 Q/ I2 }8 l" ^function showhint(text)3 [1 F/ q. v) V2 o# M
{
: Q6 c- E4 I4 L+ o- z+ T0 o+ ? onmousemove=showtip(text);
$ H$ j# t2 G4 J; n. _& d onmouseover=showtip(text);
* `2 s& H- Z$ H# S, l7 g onmouseout=hidetip(); Y6 M% N5 N" g
}
1 K$ j$ A% p, k</SCRIPT>/ [( F- i1 I; c# e
Q+ K# E4 i- |% a. A" z: C) H4 w0 v
8 f$ v" ^ ?1 X
9 B! ` ^# @: `1 k. D
. [ O. N" q \0 A& U: p4 ~1 x) t+ ~
3 b; b$ l) [- W2 f2 \9 D7 W" e& ^
二：将下面的代码复制到〈BODY〉区
$ K( M6 q8 w7 o0 Y9 \- {/ K7 }<table align=center border=1 bordercolordark=#ffffff bordercolorlight=#a8cbf1 1 [( ]& R% |* s4 q$ h' j7 F
cellspacing=0 class=t width="300" bordercolor="#6699CC" cellpadding="0">
: o4 h: C8 p8 z) j, ]' W( z0 K <tbody>
5 Z- Q5 j# N# Y2 t% B <tr align="center" bgcolor="#ffdfd0"> , \* J Y Q \ Z
<td height=9 width="25%" class="css3"><a href="../../sbtx.html" onMouseMove="showtip('赏心悦目<br>精美的图像和壁纸能使你得到一些放松！')" onMouseOut=hidetip() 9 W$ c7 f7 I! `2 L4 k/ Q& i
target=_blank>赏心悦目</a></td>9 F! v8 h! J' Q) W' I- e; u
<td height=9 width="25%" class="css3"><a href="../../flashmenu1.htm" onMouseMove="showtip('网页素材<br>大量的网页素材给你的网页制作提供方便！')"
. h b6 N9 B. G onMouseOut=hidetip()>网页素材</a></td>
$ D5 x4 z0 m. A: _' X; s <td height=9 width="25%" class="css3"><a href="../../wyjcs.html" onMouseMove="showtip('图像处理<br>图形软件的使用以及图像的特效制作')" onMouseOut=hidetip() ' {1 M e- A: {) K- a! m# F# ^
target=_blank>图像处理</a></td>6 |3 S0 q' W/ D1 L7 L* [9 _0 H
<td height=9 width="25%" class="css3"><a href="../../soft.htm" onMouseMove="showtip('网页特效<br>网页特效的大宝库，有详细的使用说明')" onMouseOut=hidetip() # P% T( ], U& Q3 J7 q9 @0 s) X
target=_blank>网页特效</a></td>
2 r: p/ O. g' k/ P- e5 s </tr>0 s X r5 M) z+ ^( _
</tbody> 6 o3 Z) Q/ M- A# b
</table> |
|
发表于 2008-1-21 20:52
|