|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之带注释的表格菜单特效
一：将下面的代码放在<HEAD>与</HEAD>之间
' K6 X/ p! X2 {1 L) w1 S2 ?<SCRIPT language=javascript >' W1 U. ^4 i: Z/ k/ i
document.write(* w( y( r7 c* R2 X' X; t
"<div id=\"tooltip\" style=\"position:absolute;visibility:hidden; padding:3px;border:1px solid #528AC6;\
# ]+ u6 T* h: W' p+ z* ^( I- c3 k;background-color:#ffdfd0; height: 19px; left: 77px; top: 96px\"></div>");9 m( [: q$ m/ b* f
: h: ^* T3 ^+ x( i0 b A1 ?: ^function showtip(text) //显示链接的说明0 S" V" E% H+ w* \2 M$ F7 s
{
3 x4 ~: N, @& T9 b9 ` if (document.all&&document.readyState=="complete") //针对IE
$ ^% Z/ W# E+ t) f { {
" k8 U5 r& t3 d1 ]: K ; M* ~, I1 Q6 G, H
document.all.tooltip.innerHTML="<div vAlign=center><font SIZE=2>"+text+"</font></div>";
; K3 I/ s0 P/ c" E# @& u document.all.tooltip.style.pixelLeft=event.clientX+document.body.scrollLeft+10;7 u t5 Y6 F& Z
document.all.tooltip.style.pixelTop=event.clientY+document.body.scrollTop+10;
( S) m! X+ U& ?: z' J/ r1 Y document.all.tooltip.style.visibility="visible";2 e2 h3 C' @8 J( a1 `& a
}6 A& d6 ?+ B3 `' ^
}
5 C; v9 I4 [( ~( m# |' L4 h# b1 Y
function hidetip()
' X" }% A3 R8 D0 A{, F8 a+ i8 A+ w8 j9 H$ o
if (document.all)6 \& k7 j( C0 S
document.all.tooltip.style.visibility="hidden";
; C E3 g% d6 O5 X}$ ~0 b; z5 ~/ s5 V, _! d
* K) `, Z0 a" v1 E6 Z% D& a
function setcolor(fntcolor,bgcolor)- ~, T5 \! L! t5 h
{
, T! K4 q9 h! S% V0 w. D2 f2 P document.all.tooltip.style.bgcolor=bgcolor;4 ]) m; ]8 u, U5 d
document.all.tooltip.innerHTML.Color = fntcolor;# n" f& y g9 L
}
& d+ a2 V, h' P0 l! y6 y3 v/ A* s) S7 Z% x0 F
function showhint(text): [# \! b, N/ P8 |. }0 O" @: Z* _
{/ x8 A G* V' Y. [
onmousemove=showtip(text);
& ~1 H1 n: P) T6 b! A6 P( c onmouseover=showtip(text);
' P$ K) H% |. H8 g% {, E onmouseout=hidetip();
9 L9 c# o* \6 H) z}
' M2 a; e' d+ Q) k+ ~' {</SCRIPT>
' m" p* N; }: F0 z% i' d) ^3 ?# Q0 V) R5 x. [! B" P% S
2 n1 s9 l8 ^ Y/ h, W7 e- D, b
8 x: @' V! A, k( x
$ C& n6 Q5 v, X6 Z9 w
* W8 b8 f. j5 m7 W; w7 @! y( Y7 h9 E
1 H0 \9 ~$ `) V( v. W- \; C二：将下面的代码复制到〈BODY〉区
9 e# X @ G, m3 `4 N<table align=center border=1 bordercolordark=#ffffff bordercolorlight=#a8cbf1 ) D: N U& {2 e6 A
cellspacing=0 class=t width="300" bordercolor="#6699CC" cellpadding="0">
4 ]$ L: n4 g' Q9 ?9 J( L! J, C <tbody>
) d3 X* @: w: q. z; | <tr align="center" bgcolor="#ffdfd0"> ; L4 U) s' b6 s7 R5 p, i2 b
<td height=9 width="25%" class="css3"><a href="../../sbtx.html" onMouseMove="showtip('赏心悦目<br>精美的图像和壁纸能使你得到一些放松！')" onMouseOut=hidetip() 1 m3 [( Z. l6 t" F+ l
target=_blank>赏心悦目</a></td>
* }3 P! q1 W- Y% [5 t <td height=9 width="25%" class="css3"><a href="../../flashmenu1.htm" onMouseMove="showtip('网页素材<br>大量的网页素材给你的网页制作提供方便！')" ( p4 Y+ [6 r3 E* I/ n/ v& `
onMouseOut=hidetip()>网页素材</a></td>; v' R; X. _3 `# B1 ?( a
<td height=9 width="25%" class="css3"><a href="../../wyjcs.html" onMouseMove="showtip('图像处理<br>图形软件的使用以及图像的特效制作')" onMouseOut=hidetip()
9 O/ z6 ^, r5 J target=_blank>图像处理</a></td>% C0 U) {$ d0 k# C
<td height=9 width="25%" class="css3"><a href="../../soft.htm" onMouseMove="showtip('网页特效<br>网页特效的大宝库，有详细的使用说明')" onMouseOut=hidetip()
% B! g: K; P5 f% I0 V& H% @# j target=_blank>网页特效</a></td>
. k! Y v8 D* z </tr>
* H# D# _; T0 K4 J7 _ </tbody>
2 [' h; R% r7 l+ a/ k </table> |
|
发表于 2008-1-21 20:52
|