|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之带注释的表格菜单特效
一：将下面的代码放在<HEAD>与</HEAD>之间# {$ _/ |! m) t
<SCRIPT language=javascript >+ j! V0 ^( N* T; ~7 k. n; E( G
document.write(- K$ x8 P T0 }5 j
"<div id=\"tooltip\" style=\"position:absolute;visibility:hidden; padding:3px;border:1px solid #528AC6;\
( x- i% ]0 `1 R2 W1 N$ H;background-color:#ffdfd0; height: 19px; left: 77px; top: 96px\"></div>");3 Q8 C! o [% D0 A5 [) ]$ ?) h
9 E9 c; E* c" i& ~% [: U3 D R
function showtip(text) //显示链接的说明
* ~( p+ E) w; a5 k, a( t{
* h1 n- Z5 j3 o) A if (document.all&&document.readyState=="complete") //针对IE3 n6 M) P3 K9 Q7 W8 D
{! B" J# ^7 i+ u' u) `
! k' w1 `. |3 g
document.all.tooltip.innerHTML="<div vAlign=center><font SIZE=2>"+text+"</font></div>";
' R1 J( w" i# g B) V3 H document.all.tooltip.style.pixelLeft=event.clientX+document.body.scrollLeft+10;& {5 V* c3 N& \% o) R6 e+ `
document.all.tooltip.style.pixelTop=event.clientY+document.body.scrollTop+10;; w) c4 a% [. L
document.all.tooltip.style.visibility="visible";
1 |; t9 }, C% O$ W5 } }
$ G7 L0 _* C7 I, n1 c}
, I6 l1 G& E0 X! _8 X! O3 d- [ ^6 R* J7 d" \- S2 ?
function hidetip()
3 V" A$ \( |5 k( \7 \4 q% t{
; P) S* V% j: Y+ Z' vif (document.all)6 \' e5 B9 p# q9 M4 E7 f
document.all.tooltip.style.visibility="hidden";- f2 k7 a& z1 |# G6 p
}8 U: b' S" h$ @
0 g9 E& ]* V9 @6 Z& C& K3 | y8 Lfunction setcolor(fntcolor,bgcolor)
- I2 x& \; Y3 q5 i5 z7 l{
! L; m) V- R- m& y document.all.tooltip.style.bgcolor=bgcolor;
; b$ U% S! p, ^3 G3 q0 ^# C8 }% i( g+ \ document.all.tooltip.innerHTML.Color = fntcolor;2 z, r8 k1 a) x* P8 a; m, o k
}8 ^! W8 d; r, x2 D
. p* r0 Z) H; J- X: ~: p9 ]% u
function showhint(text)
9 d4 L/ O M- A% x+ ?% Y( c{1 V- j; N1 r" \/ X! j
onmousemove=showtip(text);/ `9 I- ?: k7 v- Z+ P7 T
onmouseover=showtip(text);
) p, ]0 f0 @5 q1 w, J3 w onmouseout=hidetip();2 m+ j% Y- s& X+ l+ b, m
}! |" }/ j+ a; B8 c/ U, U- Q1 I4 ]
</SCRIPT>) B) i `. a( T4 F
1 [8 i) }+ P4 h8 g2 ?: o/ D1 N
: S3 D9 |2 J* Q" Y* E& b, U B
& _5 P2 [0 R% O3 H, F. ^3 Z
4 I- R6 r4 O, g# \$ Q& \9 H4 ]
1 [( t! a6 L- I$ h6 f二：将下面的代码复制到〈BODY〉区! {% h6 n3 P5 h0 t. A& ~
<table align=center border=1 bordercolordark=#ffffff bordercolorlight=#a8cbf1 - m6 [( }* n* ]- N# q; q, G
cellspacing=0 class=t width="300" bordercolor="#6699CC" cellpadding="0"># n# r3 a4 p. `" n; V. I
<tbody> / Z" i3 |8 W- Z' n" \' V9 r' s
<tr align="center" bgcolor="#ffdfd0"> 8 q& n5 {% R6 b4 K2 K/ g; v/ C4 l
<td height=9 width="25%" class="css3"><a href="../../sbtx.html" onMouseMove="showtip('赏心悦目<br>精美的图像和壁纸能使你得到一些放松！')" onMouseOut=hidetip() " ~: g. z# S" I8 l1 k: s! P
target=_blank>赏心悦目</a></td>
3 n, Q/ \1 R; [; I/ k <td height=9 width="25%" class="css3"><a href="../../flashmenu1.htm" onMouseMove="showtip('网页素材<br>大量的网页素材给你的网页制作提供方便！')" $ A( l; `2 T/ Z& B+ d% S
onMouseOut=hidetip()>网页素材</a></td>' L- E2 N& _ a2 H1 n
<td height=9 width="25%" class="css3"><a href="../../wyjcs.html" onMouseMove="showtip('图像处理<br>图形软件的使用以及图像的特效制作')" onMouseOut=hidetip()
9 n3 D* N w2 Z1 G. M+ x target=_blank>图像处理</a></td>
+ p D- _4 C/ D: X <td height=9 width="25%" class="css3"><a href="../../soft.htm" onMouseMove="showtip('网页特效<br>网页特效的大宝库，有详细的使用说明')" onMouseOut=hidetip()
/ b- v" e6 E6 j3 q: q o- o1 J. w target=_blank>网页特效</a></td>
5 B+ X. X) F M h6 p, m- V </tr>) q. A4 T0 h7 P1 p9 B2 @, D* e7 G1 f! Y
</tbody>
- o: N2 } [% G% n </table> |
|
发表于 2008-1-21 20:52
|