|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之带注释的表格菜单特效
一：将下面的代码放在<HEAD>与</HEAD>之间' I+ ^% I# K0 g. ^0 V n' J
<SCRIPT language=javascript >" F& y+ w) \4 o5 M, Q
document.write(3 I! v9 j" @7 `" Q0 k
"<div id=\"tooltip\" style=\"position:absolute;visibility:hidden; padding:3px;border:1px solid #528AC6;\
8 h! R. u! u3 f) P1 s$ ?+ w;background-color:#ffdfd0; height: 19px; left: 77px; top: 96px\"></div>");
! z) N& Y, U, \* g" {* A V8 I' H9 `% k& c% E+ D0 I* {7 ?
function showtip(text) //显示链接的说明$ }0 T5 Z& ^# m. Y2 {; J
{
, W& u# B+ R$ S& m% { if (document.all&&document.readyState=="complete") //针对IE
. Z4 n+ W5 m, C) A+ x {0 [2 z- p$ \% R( b3 m+ M- o
6 `" [& Y5 t' g# C% h
document.all.tooltip.innerHTML="<div vAlign=center><font SIZE=2>"+text+"</font></div>";
) R$ t9 L. v: m. M J document.all.tooltip.style.pixelLeft=event.clientX+document.body.scrollLeft+10;; ~$ d, A4 J0 _
document.all.tooltip.style.pixelTop=event.clientY+document.body.scrollTop+10;1 N4 d/ R, i% s ~& r3 R$ a8 q; C
document.all.tooltip.style.visibility="visible"; C% K/ `8 H6 O' G9 z# N
}) ?; Z0 i* t* V9 q( S& A
}0 |8 z" o* R7 _% P' }: v8 P5 Y: K
; Q" Q- \7 u+ S5 B. ^9 z* D. C+ Ofunction hidetip() 9 P( ]% @- M/ b" Y/ Q3 Z
{
) F: _+ Q: |' x) g( }if (document.all)9 \- T; u; I4 }2 \/ \
document.all.tooltip.style.visibility="hidden";
/ {) u; G8 H1 X' X, r1 S}
( Q) z$ z6 C( t T+ R
( @/ c, z2 z; z" J8 gfunction setcolor(fntcolor,bgcolor)9 i i# T4 |$ {9 L
{1 `- d3 C8 p* V! [3 s6 D
document.all.tooltip.style.bgcolor=bgcolor;
" M6 H4 ?- {9 u- M1 L document.all.tooltip.innerHTML.Color = fntcolor;8 H/ A. O) {# R
}( i. D: E% u! i7 D
6 c# m) Y# f: _2 y3 C Yfunction showhint(text)1 P5 x- `4 v1 \9 i: v8 J
{) h8 H- Y8 h8 ~- v! A+ W7 V/ P
onmousemove=showtip(text);* C6 d1 f; e$ N; S: O/ H
onmouseover=showtip(text);
8 Y' @3 |& b, y onmouseout=hidetip();
- L" T7 G/ b& y( v- Q8 }}4 V- S. f- s" U, y5 m8 z7 [
</SCRIPT>$ C' U, j5 F( t
+ j; k- j" v( N0 x! Q9 u' j! Q8 M7 t0 o
5 e4 C9 \- I: t/ ?6 X& H
4 }5 ^. F: m {3 R6 o1 Z
6 P9 D' D3 ^, q: W( u/ G
8 A2 K8 T4 D9 ]1 s; |二：将下面的代码复制到〈BODY〉区
, v- e. F9 r$ z2 s- h) B<table align=center border=1 bordercolordark=#ffffff bordercolorlight=#a8cbf1
/ D! D* R. ~# Mcellspacing=0 class=t width="300" bordercolor="#6699CC" cellpadding="0">
5 t' u6 I# _. s3 `6 R# g <tbody> 8 z2 M- C. t0 U; W
<tr align="center" bgcolor="#ffdfd0">
f6 w) D$ K6 ^9 q+ t; L <td height=9 width="25%" class="css3"><a href="../../sbtx.html" onMouseMove="showtip('赏心悦目<br>精美的图像和壁纸能使你得到一些放松！')" onMouseOut=hidetip() 2 t7 L9 Y& C# j C- ]1 I
target=_blank>赏心悦目</a></td>
q2 m1 H/ j4 ^: t) c) I# R <td height=9 width="25%" class="css3"><a href="../../flashmenu1.htm" onMouseMove="showtip('网页素材<br>大量的网页素材给你的网页制作提供方便！')"
1 E7 ?6 `, [- p& p6 R8 a onMouseOut=hidetip()>网页素材</a></td>
; `& v* J) [! k% q! L1 ~2 h# J1 z <td height=9 width="25%" class="css3"><a href="../../wyjcs.html" onMouseMove="showtip('图像处理<br>图形软件的使用以及图像的特效制作')" onMouseOut=hidetip() , b% [. x$ u- L: l1 t2 _
target=_blank>图像处理</a></td>9 N9 E5 o, G4 d7 L H" k u1 q( M) O8 N
<td height=9 width="25%" class="css3"><a href="../../soft.htm" onMouseMove="showtip('网页特效<br>网页特效的大宝库，有详细的使用说明')" onMouseOut=hidetip() 5 `$ C' R; A; ]0 a5 u
target=_blank>网页特效</a></td>
: p) i( b& F+ g# X+ E; u1 Z </tr>
! j2 ~7 E( K3 F2 l& Y/ |) Z5 G8 |) X </tbody>
! p/ @7 F& F3 s" n </table> |
|
发表于 2008-1-21 20:52
|