|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之带注释的表格菜单特效
一：将下面的代码放在<HEAD>与</HEAD>之间) F+ q1 F0 l# R5 `5 \, b4 A+ _
<SCRIPT language=javascript >% J B8 o& p0 }6 J" ^, ?$ a4 f
document.write(1 ]* [8 p, O( k& k5 h
"<div id=\"tooltip\" style=\"position:absolute;visibility:hidden; padding:3px;border:1px solid #528AC6;\+ ?3 g1 B% ]0 T) K/ z& i
;background-color:#ffdfd0; height: 19px; left: 77px; top: 96px\"></div>");
# K6 L* w+ V6 s5 n/ E$ r' j6 V: B3 b7 Z
function showtip(text) //显示链接的说明4 X& B8 @5 M2 b% C1 q$ o
{. N1 ]! X; Z9 Q$ E% b/ N
if (document.all&&document.readyState=="complete") //针对IE H/ A7 S7 K3 i ?2 ]4 O
{! `1 J9 [4 k% D/ v- `6 B$ z9 {
5 y' Y1 H4 @3 ?% }1 @0 m
document.all.tooltip.innerHTML="<div vAlign=center><font SIZE=2>"+text+"</font></div>";* Y4 M9 j x7 A% [* a& g
document.all.tooltip.style.pixelLeft=event.clientX+document.body.scrollLeft+10;
4 d9 b- V6 `2 ~, _1 F0 ? document.all.tooltip.style.pixelTop=event.clientY+document.body.scrollTop+10;5 Q9 J! V9 d0 P
document.all.tooltip.style.visibility="visible";' j# V4 v$ A9 C" W/ }
}" x: ]4 M+ G; u; D; R$ d8 g
}8 U, J) x1 ?$ Q5 M# h+ q
0 i1 Y! n# l) u9 G
function hidetip()
% v$ j( f# K R{
9 ^2 B. q6 Z! M" M, _/ ~1 \if (document.all): l- U: E0 w, Z% W
document.all.tooltip.style.visibility="hidden";
! Y5 S1 A& ~& \: f2 F}
1 s$ C7 a5 B8 t, Q x
5 ]% k" G. g: L2 O& W1 ffunction setcolor(fntcolor,bgcolor)
+ l/ H; e4 s+ M: [4 `{
" w0 R0 k, ~9 \5 k% M0 U" p% q document.all.tooltip.style.bgcolor=bgcolor;
* S, [, J0 a/ T+ L document.all.tooltip.innerHTML.Color = fntcolor;5 X, A8 y) u3 ^0 a' R* L1 B; |
}: M. w o8 k g; _* ~
* H: }$ h' [* O3 Z3 p9 ~0 F. ^function showhint(text)
/ |. b' o: @' T3 g- u{
0 v o5 ~5 j( ~4 o: M onmousemove=showtip(text);
) v4 s- x5 c8 j1 Q* u/ m5 k* N7 R onmouseover=showtip(text);0 [/ D4 f) |( \" Y$ @; U: a5 U) d
onmouseout=hidetip();5 b- I4 W0 n$ d; N/ f
}
9 ?9 O2 _' }$ J5 e O, d) o0 a& i/ Y' F</SCRIPT>
) q4 }& l: b" P; w: j# d8 Z2 \4 y+ Z1 w/ o! ]" t% U4 v1 z K* h1 F; n
: b/ i, {9 D4 C3 |. r+ |; U
_$ y/ `0 W0 X- M+ L
|+ u% c k. }& s
; Y \- Y/ ?; v$ Y8 l
5 Q" i+ Z) l) s( d2 i. X6 G/ `* x二：将下面的代码复制到〈BODY〉区$ h: B5 x: i% c) b! Y7 n( H! M# h
<table align=center border=1 bordercolordark=#ffffff bordercolorlight=#a8cbf1
8 g, D0 \& g# ^# j6 Bcellspacing=0 class=t width="300" bordercolor="#6699CC" cellpadding="0">" b4 Q* X( u7 D& @; H2 F5 c7 E7 d+ m
<tbody> & O4 _, f/ Q2 @7 [
<tr align="center" bgcolor="#ffdfd0">
5 s0 P+ N/ Z( c4 y5 n7 ~3 K9 y @# @1 V <td height=9 width="25%" class="css3"><a href="../../sbtx.html" onMouseMove="showtip('赏心悦目<br>精美的图像和壁纸能使你得到一些放松！')" onMouseOut=hidetip()
3 W0 X9 y& G v" F0 h$ V/ U target=_blank>赏心悦目</a></td>
8 \( o; x8 |( ?6 y+ I2 H5 H( |# a( S <td height=9 width="25%" class="css3"><a href="../../flashmenu1.htm" onMouseMove="showtip('网页素材<br>大量的网页素材给你的网页制作提供方便！')" 1 o0 t3 U+ o& j2 k& Z1 J3 }
onMouseOut=hidetip()>网页素材</a></td>; t2 y ?* D+ n4 b5 n
<td height=9 width="25%" class="css3"><a href="../../wyjcs.html" onMouseMove="showtip('图像处理<br>图形软件的使用以及图像的特效制作')" onMouseOut=hidetip() 4 Q' V3 r+ t! i- q: O6 k
target=_blank>图像处理</a></td>
5 q& t, O3 K- K8 Y <td height=9 width="25%" class="css3"><a href="../../soft.htm" onMouseMove="showtip('网页特效<br>网页特效的大宝库，有详细的使用说明')" onMouseOut=hidetip() * G+ \8 Q8 M* y8 I4 L8 A$ u' |3 e
target=_blank>网页特效</a></td>
3 w. a) T, I7 M- [& v1 F </tr>, _7 _: z( u/ H! e* E' h0 F
</tbody>
: x) ^$ {8 B4 y </table> |
|
发表于 2008-1-21 20:52
|