|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之带注释的表格菜单特效
一：将下面的代码放在<HEAD>与</HEAD>之间
; G2 G# X3 |# |9 y- M" ?<SCRIPT language=javascript >
4 m6 ?8 G" }) @document.write(
9 |9 I+ A# y- ]+ y7 C"<div id=\"tooltip\" style=\"position:absolute;visibility:hidden; padding:3px;border:1px solid #528AC6;\! [6 S% o2 O& x, T$ d/ b: K
;background-color:#ffdfd0; height: 19px; left: 77px; top: 96px\"></div>");) P& `/ `; a( c
. l) y( K7 d4 G, J) A. |" q
function showtip(text) //显示链接的说明0 o: k$ n# J; G8 `* \
{' Q) z! ?0 m; X0 m
if (document.all&&document.readyState=="complete") //针对IE
, D) O& v* c, I2 ?# w {
3 a h( p; v/ J5 X& J& u & v9 K* v8 D6 z" B; E" N( Q O
document.all.tooltip.innerHTML="<div vAlign=center><font SIZE=2>"+text+"</font></div>";
- `/ Y* g' m; Z+ p document.all.tooltip.style.pixelLeft=event.clientX+document.body.scrollLeft+10;4 O6 D# g% g$ g4 S
document.all.tooltip.style.pixelTop=event.clientY+document.body.scrollTop+10;; T2 F# B& t$ v- z. {
document.all.tooltip.style.visibility="visible";7 z! V/ V- g$ f0 s2 R
}
+ t+ [! x; q0 W; l& d6 `}
4 j4 A. m5 h/ V( f2 v+ D6 S8 m- L' y2 w4 E2 p
function hidetip() 9 F J/ E1 _2 b/ C* }1 E8 J
{
4 ~ s6 P1 m/ I9 l) Sif (document.all)$ `7 r# ]5 q- v7 k. V; ^8 A
document.all.tooltip.style.visibility="hidden";: \8 M M( H: |. P3 C+ i
}, Z, ^5 ]6 \) {" I& w" E$ S* r6 d
; t t5 u5 p) ?" @: ?4 \function setcolor(fntcolor,bgcolor)
& |3 Z/ |7 q7 @6 P7 k{$ v* M- C. z' H1 d5 H$ o
document.all.tooltip.style.bgcolor=bgcolor;6 i+ N: H. t, `/ v) i# [
document.all.tooltip.innerHTML.Color = fntcolor;
4 @6 ^% O) P- `1 Z _/ ]& f3 M, j}
8 [" T0 L, E& X1 R# o$ C- c
. U# m7 `9 m7 l& j/ u6 k; V/ Ffunction showhint(text)6 |8 j/ p" V Z4 U# @( X
{
7 J K, z- P r. J onmousemove=showtip(text);' |4 j! s7 I' L P4 G7 j& d( q
onmouseover=showtip(text);
. L9 g9 f1 P K onmouseout=hidetip();2 q+ X1 K3 c8 w
}
( }& R9 r! t8 a8 d3 `</SCRIPT>
& K* I& v- f6 L d r
4 |: D1 B% }* r
" ^$ u6 c3 a/ `7 k* \4 c
4 }: I& q; V: T' X' ^2 m! Z2 |% N1 X" U" [, c8 w
; k$ K- A- S2 V g1 B# g& ~
% u3 `( B _# G% X- e+ W% ?二：将下面的代码复制到〈BODY〉区+ a6 D) I: x9 Z: _
<table align=center border=1 bordercolordark=#ffffff bordercolorlight=#a8cbf1 2 i2 d: w' Z% `: Y1 q7 X# F/ L
cellspacing=0 class=t width="300" bordercolor="#6699CC" cellpadding="0">
& P n$ W8 l) X1 e: ]( f7 |" D/ ? <tbody>
$ o$ N8 J" w% g3 Y4 F <tr align="center" bgcolor="#ffdfd0">
' H0 ^9 G: e/ `) v6 X9 @ <td height=9 width="25%" class="css3"><a href="../../sbtx.html" onMouseMove="showtip('赏心悦目<br>精美的图像和壁纸能使你得到一些放松！')" onMouseOut=hidetip()
- i. l: e) ]7 y/ d target=_blank>赏心悦目</a></td>
6 D5 Y8 B$ B4 j; E1 t. x* c# P <td height=9 width="25%" class="css3"><a href="../../flashmenu1.htm" onMouseMove="showtip('网页素材<br>大量的网页素材给你的网页制作提供方便！')"
# ~0 S6 T* t7 w+ L. _ onMouseOut=hidetip()>网页素材</a></td>
' p9 b7 t% |! H- v <td height=9 width="25%" class="css3"><a href="../../wyjcs.html" onMouseMove="showtip('图像处理<br>图形软件的使用以及图像的特效制作')" onMouseOut=hidetip()
. q3 r* E1 V) f! }- t# U% C1 Z( h* Q target=_blank>图像处理</a></td>
+ ]+ G( R D7 i. Y* m2 b <td height=9 width="25%" class="css3"><a href="../../soft.htm" onMouseMove="showtip('网页特效<br>网页特效的大宝库，有详细的使用说明')" onMouseOut=hidetip() 9 @7 D; G; {% N
target=_blank>网页特效</a></td>
" v. m* J B8 Q7 N; [ </tr>3 F/ U3 ~+ v1 `& U6 f/ M
</tbody>
' u4 a( m& o. T7 {2 d/ a </table> |
|
发表于 2008-1-21 20:52
|