|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之带注释的表格菜单特效
一：将下面的代码放在<HEAD>与</HEAD>之间6 n* n$ L3 c$ S7 [- h* j, _
<SCRIPT language=javascript >
9 t( T: T( o3 Z ^, \3 s: N2 H$ N) Ldocument.write(( \8 C0 \7 ?* K( W( e- g
"<div id=\"tooltip\" style=\"position:absolute;visibility:hidden; padding:3px;border:1px solid #528AC6;\6 |% w1 [: _' T4 C: f, A! _
;background-color:#ffdfd0; height: 19px; left: 77px; top: 96px\"></div>");
$ `$ P0 g; N" o* k* w1 K1 f. o1 a. Q: L2 J* E
function showtip(text) //显示链接的说明% [5 Z' P4 F5 M( ^4 B
{
( o2 u4 [0 I- j# U7 _* n if (document.all&&document.readyState=="complete") //针对IE
% b/ \ F0 Y7 ?4 [0 d {' C0 t8 D7 {% p E j
, o$ z* q& p: i$ o: Y; A$ T document.all.tooltip.innerHTML="<div vAlign=center><font SIZE=2>"+text+"</font></div>";/ M) R7 Y) {7 [2 q! W0 T
document.all.tooltip.style.pixelLeft=event.clientX+document.body.scrollLeft+10;5 e2 n2 e; J. C6 N; |+ Q! _
document.all.tooltip.style.pixelTop=event.clientY+document.body.scrollTop+10;
9 o( H2 T% V1 r2 | document.all.tooltip.style.visibility="visible";
% s$ Q- e) A) T2 j }( R( [4 R* }' b9 E5 d+ q
}
) V2 x" B' X' P# @4 y; \* T# F. g, d" L$ G& c
function hidetip() % R$ @6 Z5 ^3 I% ]7 e8 l$ B
{
8 i% q) T! f8 q* a8 x) aif (document.all). m0 U6 u5 r# m1 R
document.all.tooltip.style.visibility="hidden";8 `( _1 H! \, F2 W- L$ j1 V
}
) R$ y0 F4 ?6 Y* I I8 O3 @( ^; D! ~' c% {0 n, S% [4 D8 ?
function setcolor(fntcolor,bgcolor)* n& s3 E. G5 F9 |; E
{
* }, ]% h# i8 T& Z; Z document.all.tooltip.style.bgcolor=bgcolor;
! R0 s C! v0 I1 p document.all.tooltip.innerHTML.Color = fntcolor;* V M. Q: `! p4 [
}; m' y8 U" Z# d9 g5 w$ M
4 @ j# `2 Z+ ]6 f1 V: h! H0 |/ C
function showhint(text)1 k S# Y9 P b
{
; ]3 F: [; J3 S2 E onmousemove=showtip(text);
6 U. ?" J1 C& G0 B onmouseover=showtip(text);2 |7 N2 A3 p6 l
onmouseout=hidetip();
# C( B; y% Y3 b1 r' b}" p# N3 K: U! |% c6 D% G) p f
</SCRIPT>
6 C) n$ V; E H9 H6 I& j# t
% K: |0 ?! H" P8 C* n
( c. t* o v1 {- a8 Y
% T- ^" g" X5 U6 z; t1 j% ] H5 f {8 M' P1 Y: o7 R
: o/ w$ ~' X5 ?% I3 U% q/ o
6 z/ ^. P, x! x: ?
二：将下面的代码复制到〈BODY〉区3 e, b: @7 s* K0 C$ q v* ~: Q
<table align=center border=1 bordercolordark=#ffffff bordercolorlight=#a8cbf1 / g( [% S4 O0 ]$ a0 N
cellspacing=0 class=t width="300" bordercolor="#6699CC" cellpadding="0">
0 | `) l: M9 w. K4 n <tbody> ! ]0 A: t5 A5 p
<tr align="center" bgcolor="#ffdfd0"> : K4 ?4 t9 [# z$ Z8 q* o
<td height=9 width="25%" class="css3"><a href="../../sbtx.html" onMouseMove="showtip('赏心悦目<br>精美的图像和壁纸能使你得到一些放松！')" onMouseOut=hidetip()
" S5 S- w( O; v! a/ p target=_blank>赏心悦目</a></td>8 @" U. C5 R' A
<td height=9 width="25%" class="css3"><a href="../../flashmenu1.htm" onMouseMove="showtip('网页素材<br>大量的网页素材给你的网页制作提供方便！')" 8 X( e" t: W) O2 A }, Z) Z" |, v, G
onMouseOut=hidetip()>网页素材</a></td>
3 K9 D z) c+ O <td height=9 width="25%" class="css3"><a href="../../wyjcs.html" onMouseMove="showtip('图像处理<br>图形软件的使用以及图像的特效制作')" onMouseOut=hidetip() ( `8 |" x3 ~- c0 ^3 d9 Q ^
target=_blank>图像处理</a></td>" y( l c8 r( N
<td height=9 width="25%" class="css3"><a href="../../soft.htm" onMouseMove="showtip('网页特效<br>网页特效的大宝库，有详细的使用说明')" onMouseOut=hidetip() & J6 u9 A, y* Z# {1 x/ Y
target=_blank>网页特效</a></td>
; u$ D1 Z$ Z- C, x) R! B: j- I9 l </tr>8 X. l x! h9 M4 e" n
</tbody>
: @- d% p9 J+ G! s/ S </table> |
|
发表于 2008-1-21 20:52
|