|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之带注释的表格菜单特效
一：将下面的代码放在<HEAD>与</HEAD>之间
( p/ T- s) o7 V7 w<SCRIPT language=javascript >
0 k% g# X3 v; |2 udocument.write(0 L2 w6 w5 k# w p; D- E6 d4 o2 {! S8 l
"<div id=\"tooltip\" style=\"position:absolute;visibility:hidden; padding:3px;border:1px solid #528AC6;\
& J2 c- r `) i+ ~" j# N;background-color:#ffdfd0; height: 19px; left: 77px; top: 96px\"></div>");/ N& |* C+ a3 `" ]
$ l4 Y5 `/ S: P
function showtip(text) //显示链接的说明9 E' |6 _2 O* M3 c/ s
{
0 y6 g# E3 P) N8 u if (document.all&&document.readyState=="complete") //针对IE
) j& y* O9 ^& t {
/ K$ S- E% r3 ?) z- W4 U! M
0 l7 B* h1 l, D) P/ R, m document.all.tooltip.innerHTML="<div vAlign=center><font SIZE=2>"+text+"</font></div>";
; f* P0 R6 D3 D* L, c9 a& Z document.all.tooltip.style.pixelLeft=event.clientX+document.body.scrollLeft+10;; u% M u/ @/ R- r
document.all.tooltip.style.pixelTop=event.clientY+document.body.scrollTop+10;+ L( z8 P: O( I1 r+ w& {
document.all.tooltip.style.visibility="visible";1 u& M1 H4 m$ J' M1 x- s5 c! k
}
) Y* J$ v- D8 M}$ Y! l& b9 g, {0 `: {; u* H4 q
; d) V/ J( J! i9 t7 l' nfunction hidetip()
" U9 r: J4 f1 @+ s{6 c: x. |9 f/ h* i6 C) n* M$ D" ^7 S) W3 i
if (document.all)
8 q) L' O" X' E document.all.tooltip.style.visibility="hidden";0 S W: |( q2 B0 z ~5 _
}
5 x) B0 e% h. j2 j" N S/ w& C. c( W0 Z2 [% x
function setcolor(fntcolor,bgcolor)
1 x: j9 U: A6 p# M* L5 D0 X{
& a; o% m$ O( R" y- ` document.all.tooltip.style.bgcolor=bgcolor;6 l& a9 L5 A2 j# U- q6 l' ]
document.all.tooltip.innerHTML.Color = fntcolor;; }$ V/ u' v% R! K. ]" U
}
9 ^) Z2 R& L! m8 `$ n" E: c
" [# o: o4 @# Z7 Efunction showhint(text)
' b( ?; G0 X( ^8 H7 I{
+ U ?. [, ^* u' p$ P onmousemove=showtip(text);
+ f. f, g: |3 M/ z) F onmouseover=showtip(text);
% n! J' {: G5 o3 a& B4 b+ n onmouseout=hidetip();
" A# `, p& \: m6 |* F}/ k% A( ?. V% {! S5 J
</SCRIPT>+ {: L) u7 R9 j% t8 ?4 W7 B# P
/ y' ~, H& W$ b: S5 n7 Z' S6 l- ]
0 G( Q0 q8 U W" |( u7 z5 ?. K p+ U4 Z. L1 R8 w6 D! S, ?
- q" l0 ?; J$ k3 b0 Q5 V
; D) L5 B5 Y7 [% ?7 y4 s4 o1 |: y* ~8 W# Q# o+ \, B
二：将下面的代码复制到〈BODY〉区
" J' H0 `: \7 U8 Q<table align=center border=1 bordercolordark=#ffffff bordercolorlight=#a8cbf1 0 z7 I3 C5 U4 B& l b- l# I/ D1 Y
cellspacing=0 class=t width="300" bordercolor="#6699CC" cellpadding="0">
& P( ^/ Y+ I$ T) w1 j <tbody> ( y1 I3 F$ c" W9 s
<tr align="center" bgcolor="#ffdfd0"> 5 J9 E) X) L& Z% l0 [$ g f7 e
<td height=9 width="25%" class="css3"><a href="../../sbtx.html" onMouseMove="showtip('赏心悦目<br>精美的图像和壁纸能使你得到一些放松！')" onMouseOut=hidetip()
2 R9 ?6 h* c; a/ z9 E# M# M# B+ w' [ target=_blank>赏心悦目</a></td>
0 }7 c* H* n. A9 K7 f+ I! j4 `; M <td height=9 width="25%" class="css3"><a href="../../flashmenu1.htm" onMouseMove="showtip('网页素材<br>大量的网页素材给你的网页制作提供方便！')" & _" H" } K# }) m
onMouseOut=hidetip()>网页素材</a></td> e! w& o4 o! A5 K
<td height=9 width="25%" class="css3"><a href="../../wyjcs.html" onMouseMove="showtip('图像处理<br>图形软件的使用以及图像的特效制作')" onMouseOut=hidetip()
4 A8 X, G V/ h# c& ] target=_blank>图像处理</a></td>
! j2 d9 ^' @7 b% U1 G1 D) M( } <td height=9 width="25%" class="css3"><a href="../../soft.htm" onMouseMove="showtip('网页特效<br>网页特效的大宝库，有详细的使用说明')" onMouseOut=hidetip() 0 X1 o+ @; ]" x' j
target=_blank>网页特效</a></td>( z! L! K _$ Q7 v2 @6 g% X
</tr>7 u9 D( w5 Q- C. d& z. v
</tbody> 0 b9 q4 ^- k: P1 i: |: J
</table> |
|
发表于 2008-1-21 20:52
|