|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之带注释的表格菜单特效
一：将下面的代码放在<HEAD>与</HEAD>之间
9 e) k# ~ J; I+ o {<SCRIPT language=javascript >
" q" a1 o! P/ R2 A7 [- _document.write(6 [1 e5 Q' @% R- `" G% Q7 I
"<div id=\"tooltip\" style=\"position:absolute;visibility:hidden; padding:3px;border:1px solid #528AC6;\/ p2 F, v, v* K4 k7 B0 X# W
;background-color:#ffdfd0; height: 19px; left: 77px; top: 96px\"></div>");* ]: d) f5 [. c m2 a% [
% w5 M4 u" Z# M y s" @8 {
function showtip(text) //显示链接的说明
& N% r4 C$ T- Z1 v{% v" b9 s# C* o- N: f3 @8 l
if (document.all&&document.readyState=="complete") //针对IE8 H8 m! b4 ? U7 X# J
{+ c: d k1 f* y2 h* e# Q6 k4 J, q/ |
7 t& ~, u! v6 y2 a1 ~) j8 |5 J document.all.tooltip.innerHTML="<div vAlign=center><font SIZE=2>"+text+"</font></div>";
" v/ s7 _" W1 z( E) C+ f document.all.tooltip.style.pixelLeft=event.clientX+document.body.scrollLeft+10;
, Z+ w6 ?3 b. U; ^: s: n document.all.tooltip.style.pixelTop=event.clientY+document.body.scrollTop+10;9 {& P- h* R( H. K4 A: U; g
document.all.tooltip.style.visibility="visible";
! d' I2 R) h. ^' h6 p }' A1 ?* O3 i+ ~0 w* V
} \0 E/ k/ f) j3 ], f
4 `6 T" z. e* u# ] J( Ofunction hidetip() 7 [- u$ n! K9 Z1 z
{
0 |$ L$ F* f* N& Q1 y& o- iif (document.all)% ] ^5 ~+ g! e9 S v' a8 L! v0 S
document.all.tooltip.style.visibility="hidden";3 a+ J$ ~0 q. c6 E, t
}; i4 {& Z) p7 Z4 l) M' b
! {1 }0 W2 I" t& L. j* Q' Q; i
function setcolor(fntcolor,bgcolor)
9 ~1 [6 g; F2 h* w2 W. _/ K! }{& V# g! I; x, r' S# B
document.all.tooltip.style.bgcolor=bgcolor;" P. ? f8 U7 z6 y* t& ?0 p) C! C
document.all.tooltip.innerHTML.Color = fntcolor;
8 K. O9 k& E" h% G- k9 C' {}/ c& y" J9 C) g" D+ O: G
- W( P7 Q5 |: p4 H) ^2 ?
function showhint(text); B0 z3 L0 _: o; M$ m8 n7 V
{
% p. @4 c* c, i3 ^ onmousemove=showtip(text);
* |% M2 z5 x) H0 `5 B4 }) s onmouseover=showtip(text);& u2 p/ a+ q* O1 o- u
onmouseout=hidetip();
& r M/ P5 J$ q9 p}
# K1 @% {- t8 M( D- X( E. z</SCRIPT>
% \6 L: t4 @+ I6 O; M6 J% V) A& m' \9 v) y0 @/ [# ?: X+ i' g
2 Q! f2 E/ K: |0 l, Z$ S* M9 c0 J3 s
- o) \$ ~4 x8 E! _9 A
2 _$ J" ?9 m2 o: e$ r+ p
! W' b) N9 u+ B5 E" H* v二：将下面的代码复制到〈BODY〉区/ y* M6 p. n) w" c/ O4 c' r
<table align=center border=1 bordercolordark=#ffffff bordercolorlight=#a8cbf1 9 J8 y" B3 Y) t
cellspacing=0 class=t width="300" bordercolor="#6699CC" cellpadding="0">, f$ c/ ~7 n0 B) ]
<tbody>
/ R" L B- \% E& l8 }( u <tr align="center" bgcolor="#ffdfd0">
* S; ^3 T( i/ @% t% l; O. h+ V <td height=9 width="25%" class="css3"><a href="../../sbtx.html" onMouseMove="showtip('赏心悦目<br>精美的图像和壁纸能使你得到一些放松！')" onMouseOut=hidetip()
: W4 C; d' ^/ w! r7 s X7 p target=_blank>赏心悦目</a></td>- a' t/ p- K2 ^
<td height=9 width="25%" class="css3"><a href="../../flashmenu1.htm" onMouseMove="showtip('网页素材<br>大量的网页素材给你的网页制作提供方便！')" ' |7 }- `1 j8 r! _$ ^- F- F5 E
onMouseOut=hidetip()>网页素材</a></td>
+ G. x; h" v P <td height=9 width="25%" class="css3"><a href="../../wyjcs.html" onMouseMove="showtip('图像处理<br>图形软件的使用以及图像的特效制作')" onMouseOut=hidetip()
4 U& \7 v1 k' {: U target=_blank>图像处理</a></td>
0 i& s/ e+ T6 w5 h |3 ~ <td height=9 width="25%" class="css3"><a href="../../soft.htm" onMouseMove="showtip('网页特效<br>网页特效的大宝库，有详细的使用说明')" onMouseOut=hidetip()
) Z% b+ s" y1 n1 E target=_blank>网页特效</a></td>1 U4 V5 \. \) A3 R5 }
</tr>
; t+ _9 J* w/ o) U0 C7 B </tbody> 1 s6 t: J( x9 O" S$ f* f2 o
</table> |
|
发表于 2008-1-21 20:52
|