|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之带注释的表格菜单特效
一：将下面的代码放在<HEAD>与</HEAD>之间
" E( g5 P) L' a* i- p<SCRIPT language=javascript >0 @# \* P @; X1 V B% Z; ?/ l
document.write(
1 }; N S: ^' D$ `+ [ o"<div id=\"tooltip\" style=\"position:absolute;visibility:hidden; padding:3px;border:1px solid #528AC6;\
0 r! ]; a+ g! Q$ b;background-color:#ffdfd0; height: 19px; left: 77px; top: 96px\"></div>");1 h: ^ f1 u+ N+ r
8 Q+ ^8 j% ?3 Z) W- n5 z8 j) E: W, Yfunction showtip(text) //显示链接的说明
* e8 l1 K$ F2 e/ o5 ^* s' Y{9 v3 B6 q; m2 u0 k# y8 B
if (document.all&&document.readyState=="complete") //针对IE
) J- ^8 ~3 O1 p' X! w8 f {+ N: i, H+ C8 r1 W1 R& y+ `6 v
j/ F; d# s2 G. |# x document.all.tooltip.innerHTML="<div vAlign=center><font SIZE=2>"+text+"</font></div>";6 B. e, e& }5 o9 b4 W0 s. P. \+ _) I
document.all.tooltip.style.pixelLeft=event.clientX+document.body.scrollLeft+10;+ [# D1 n2 u5 ~5 X3 I2 j( ] M
document.all.tooltip.style.pixelTop=event.clientY+document.body.scrollTop+10;% ~$ W2 e1 e3 E) m: u
document.all.tooltip.style.visibility="visible";8 y3 a( [1 O8 c9 R; {/ o7 E: z* d
}
. H1 t y2 v" {( U+ K3 M}# K& r- m8 N; S- Y' ? J
: p+ K, m/ N* [8 R& S# U
function hidetip()
+ D: B, q7 a& n8 ?{
. k9 I* m+ a. Z# xif (document.all)
* N8 Y: g1 K. I& V: ~8 O2 Z document.all.tooltip.style.visibility="hidden";
) x' g4 L& Q9 p4 A0 H, Q, ^5 w}
! s* G: [& a: Y& ^: `
; d) s: _6 Q) K% h. o! T) {function setcolor(fntcolor,bgcolor)2 w: F! a" ^; s" ^# x+ a- X
{/ y% ~ a- J7 E" |
document.all.tooltip.style.bgcolor=bgcolor;. _* r( D) Q& q: Z) |
document.all.tooltip.innerHTML.Color = fntcolor;
8 }5 `% |: y+ L8 m E}: @* ?' L) @8 V7 p4 q$ o0 E
/ i) |% ?% _% Y( O) |/ h; C8 @0 Dfunction showhint(text)$ ^' W: F4 i' s' x, c# a
{6 F7 [( ^6 U. a
onmousemove=showtip(text);6 A. N3 h: ^ p6 I( K; f6 L
onmouseover=showtip(text);
2 j q I8 y* R( M' Q5 U1 P onmouseout=hidetip();8 [$ n) C0 [1 |+ e0 b8 }# Y$ \
}- e, P4 |/ W6 C1 u$ k& P m
</SCRIPT>
+ L2 `: J8 O! c/ G& [! {/ u3 f$ t/ i
[- K' U% q/ @/ G2 \3 [. |2 }* v# D- G7 H: ?! i
- |; D' ?5 k4 j! ^8 V: b: i% p) v2 S/ h" k& R
* z4 L5 Q2 E3 r3 C- A( K) o! d8 ~
+ ` |8 m. _% P5 P. C5 h8 R二：将下面的代码复制到〈BODY〉区
: n. e; q7 p$ D" g! {! \9 y. v<table align=center border=1 bordercolordark=#ffffff bordercolorlight=#a8cbf1
# H3 s$ @; r+ Acellspacing=0 class=t width="300" bordercolor="#6699CC" cellpadding="0">
9 e }5 Y* G& D; H7 p <tbody>
: W; y: L1 U. C$ \6 S+ x <tr align="center" bgcolor="#ffdfd0"> ( K0 k5 |; O% S' e- {- W4 z% ]
<td height=9 width="25%" class="css3"><a href="../../sbtx.html" onMouseMove="showtip('赏心悦目<br>精美的图像和壁纸能使你得到一些放松！')" onMouseOut=hidetip() 2 U4 W: x! L/ U1 @: \
target=_blank>赏心悦目</a></td>
7 Y0 a2 m& j4 v: R; X; [0 p <td height=9 width="25%" class="css3"><a href="../../flashmenu1.htm" onMouseMove="showtip('网页素材<br>大量的网页素材给你的网页制作提供方便！')"
1 o, y ]5 f* x4 Q6 C4 p v onMouseOut=hidetip()>网页素材</a></td>
4 H) \* h7 e# q" C <td height=9 width="25%" class="css3"><a href="../../wyjcs.html" onMouseMove="showtip('图像处理<br>图形软件的使用以及图像的特效制作')" onMouseOut=hidetip() 6 O, {/ c2 N) s3 I
target=_blank>图像处理</a></td>) V4 E+ {6 L! P9 g4 I5 v
<td height=9 width="25%" class="css3"><a href="../../soft.htm" onMouseMove="showtip('网页特效<br>网页特效的大宝库，有详细的使用说明')" onMouseOut=hidetip()
% n* f4 d9 R4 c. p$ \ target=_blank>网页特效</a></td>
/ g: _4 g {, V2 i </tr>
% @* `1 _% x2 }1 h+ v2 }. d } H </tbody> : e# {' l1 E0 N# G G
</table> |
|
发表于 2008-1-21 20:52
|