|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之带注释的表格菜单特效
一：将下面的代码放在<HEAD>与</HEAD>之间
* T0 Z+ z6 S4 `9 t1 h& r<SCRIPT language=javascript >2 G5 S5 S. }* T5 m- i# m, f
document.write(7 f# Y& i9 G) K4 u- m5 T F7 x5 l
"<div id=\"tooltip\" style=\"position:absolute;visibility:hidden; padding:3px;border:1px solid #528AC6;\, H& c! X* b! z) \
;background-color:#ffdfd0; height: 19px; left: 77px; top: 96px\"></div>");4 M9 L' p$ I/ [9 y, K! @# n1 \' |
* Z; V% I8 U Z0 {7 J) \! sfunction showtip(text) //显示链接的说明
: v0 r+ m/ ]4 }, F3 R{
+ S5 |$ O: E( Z: @ if (document.all&&document.readyState=="complete") //针对IE% Y8 ^/ K9 p% w
{( g! f+ G" \/ u. e4 t2 X+ a6 j
5 |4 [5 g* D1 Y document.all.tooltip.innerHTML="<div vAlign=center><font SIZE=2>"+text+"</font></div>";8 U9 V: _3 |8 J, \& Y
document.all.tooltip.style.pixelLeft=event.clientX+document.body.scrollLeft+10;: Y# b" A' h {9 W4 i( v
document.all.tooltip.style.pixelTop=event.clientY+document.body.scrollTop+10;# C* _5 `3 F9 a$ F
document.all.tooltip.style.visibility="visible";3 A, m+ K0 j+ d" _
}* \; v8 j$ D* {3 E4 |, C- Q
}5 ?' i+ t; z! W2 p
4 S/ N, U6 K) ] R$ k
function hidetip()
. @# t2 p; r/ K) @{
- X5 l% K# t' `& oif (document.all)
A( R" o1 N0 G document.all.tooltip.style.visibility="hidden";
# |& c( D- p T- d}
( z0 p& K0 `0 a, B: E* C/ P% D9 b1 d; N) L+ }3 R* ]& ^
function setcolor(fntcolor,bgcolor)
" ?2 p2 O8 M0 i* K j{5 h1 Z( R5 V% c) c1 l( n
document.all.tooltip.style.bgcolor=bgcolor;7 G' }/ K" V+ n! g8 ], A
document.all.tooltip.innerHTML.Color = fntcolor;$ g! H, }6 x% `6 J6 X, T
}
F8 o. F) l/ `6 H9 Z* x2 G2 X: k" [4 C+ g$ ^2 `
function showhint(text)2 P9 T! m3 U' {5 E0 g* K$ h4 z
{
z) z; A' L4 ^ }% l onmousemove=showtip(text);: g" J( v' }& ]0 Z, b, W" ~% L. {
onmouseover=showtip(text);3 I5 }8 W; J \2 ?" b5 r
onmouseout=hidetip();
& t" K K. ?# Y& S8 ` Z}# V0 o& M# i7 d( |* H* D# G- h) y
</SCRIPT>
/ N9 I8 G# p/ ~4 Q( N
% q: j/ ~. l8 m( y/ e1 G3 t( l, B' k& o
3 X3 X O" |# {7 f
1 z, X6 [0 G' W; l: u6 O, B
6 ~0 X7 q- ?# k) E5 {& w; C
2 e3 G/ B, S9 s3 ]二：将下面的代码复制到〈BODY〉区
: o5 y3 y% H$ L% _# j/ G) M<table align=center border=1 bordercolordark=#ffffff bordercolorlight=#a8cbf1 # f# @8 L6 i2 G8 O4 V4 A" X
cellspacing=0 class=t width="300" bordercolor="#6699CC" cellpadding="0">. f; a8 |5 F2 B0 t1 T
<tbody>
3 S; `* A* x; H3 F: i1 I- Q3 B- U$ b; n <tr align="center" bgcolor="#ffdfd0">
) K8 d/ a9 W% U K) R$ B$ M4 y <td height=9 width="25%" class="css3"><a href="../../sbtx.html" onMouseMove="showtip('赏心悦目<br>精美的图像和壁纸能使你得到一些放松！')" onMouseOut=hidetip()
8 h1 x+ ?. I' F2 F target=_blank>赏心悦目</a></td>
+ G1 z6 _ M) D9 S J <td height=9 width="25%" class="css3"><a href="../../flashmenu1.htm" onMouseMove="showtip('网页素材<br>大量的网页素材给你的网页制作提供方便！')"
1 w9 i5 B# O9 {0 B$ d5 M- e onMouseOut=hidetip()>网页素材</a></td>
! P9 m( L6 j3 } <td height=9 width="25%" class="css3"><a href="../../wyjcs.html" onMouseMove="showtip('图像处理<br>图形软件的使用以及图像的特效制作')" onMouseOut=hidetip()
( o! d5 w' W8 R0 w, a4 q target=_blank>图像处理</a></td>: n C) X- S. Q# K3 Q& j9 j; A
<td height=9 width="25%" class="css3"><a href="../../soft.htm" onMouseMove="showtip('网页特效<br>网页特效的大宝库，有详细的使用说明')" onMouseOut=hidetip()
! D: q7 G8 p4 ~: F( n. I0 Y target=_blank>网页特效</a></td>4 L# D; |: E |& E5 E" N- \6 }$ F
</tr>
4 {: m4 _( S* c" i6 _ </tbody>
8 ]6 e6 h& j# m g* s4 K </table> |
|
发表于 2008-1-21 20:52
|