|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之带注释的表格菜单特效
一：将下面的代码放在<HEAD>与</HEAD>之间3 S$ q5 p$ E0 n/ [
<SCRIPT language=javascript >
2 e, G/ c$ E5 o1 Zdocument.write(# J$ H9 X$ j* r& V7 l0 Z, n
"<div id=\"tooltip\" style=\"position:absolute;visibility:hidden; padding:3px;border:1px solid #528AC6;\3 W# Y( \; _5 |+ C8 G
;background-color:#ffdfd0; height: 19px; left: 77px; top: 96px\"></div>");
( l4 {0 g3 w8 H8 i; \+ c$ e/ Z% j3 E; n: J" N+ s ]: j3 r
function showtip(text) //显示链接的说明/ f c& M: S7 @/ a R/ T
{( d4 w. r; x6 c' R( ]8 y4 c
if (document.all&&document.readyState=="complete") //针对IE. }& X- l7 W, y+ U. f) V' g" m
{$ ?* p0 N( z9 G b4 T; {) J
% W }; [ Q' q1 _7 R
document.all.tooltip.innerHTML="<div vAlign=center><font SIZE=2>"+text+"</font></div>";
' W0 l" `0 f/ h- P- q document.all.tooltip.style.pixelLeft=event.clientX+document.body.scrollLeft+10;
, f* h9 K9 v. |- P, o' c+ M document.all.tooltip.style.pixelTop=event.clientY+document.body.scrollTop+10;
# K) B+ ` F) y8 I document.all.tooltip.style.visibility="visible";% E4 G; A% W4 }0 p6 t- M
}* m# F, f8 H6 B+ Q* P( p
}
) f+ N& G8 T2 ]* \) n; O
/ |. } H' o: l! e% l% ~, f ffunction hidetip() - D9 ]; t( Y1 q' \
{4 x" O2 f' Y1 S
if (document.all)
- M( }6 a! F, `1 E document.all.tooltip.style.visibility="hidden";
$ P8 K' |& ^5 ~1 z. @7 e& ^9 g4 y}
" q2 V1 m3 V I8 e6 A* H7 Q& S5 y3 o9 W* {+ e0 [: c
function setcolor(fntcolor,bgcolor), N" T) L/ r) W* O9 p
{
4 W2 a( d r% ]; V) l% K& ~: z( Y5 k; N document.all.tooltip.style.bgcolor=bgcolor;8 y+ S; {9 c* k; S$ v0 I
document.all.tooltip.innerHTML.Color = fntcolor;
8 v$ i) t/ J$ ?: D0 p! E* V}' ^5 \* A L. W6 O( P
# l. P* g! @, P6 V" h) I9 qfunction showhint(text). H+ y7 A4 t* J' S
{
9 }% }* e( u. T. H onmousemove=showtip(text);- d* [1 D! X j* p# @: z
onmouseover=showtip(text);- v( h& {' f3 j" n5 Q0 t- k, G7 B" \
onmouseout=hidetip();
, d4 ]9 `$ W: k" d}4 T! q' U2 N2 o$ G/ L
</SCRIPT>- D: L" I. Y3 X% o
+ k4 \% u4 t* N% {# U d3 p* Q6 N4 X* ]4 W, Y4 W, L
, O1 [6 m& d' w7 ^: q+ p p
* u2 E6 ~" C2 H/ |) ^3 o( j5 f" i R1 _2 f2 i
F' b3 k1 c3 I8 O. }* p" T二：将下面的代码复制到〈BODY〉区
3 m$ U; g n3 \. a$ Z% l<table align=center border=1 bordercolordark=#ffffff bordercolorlight=#a8cbf1
1 H1 r' Q: R/ pcellspacing=0 class=t width="300" bordercolor="#6699CC" cellpadding="0">
6 _! l7 j9 N. @* Z9 Y <tbody>
4 G& r8 x" n/ a6 D <tr align="center" bgcolor="#ffdfd0">
# g/ h3 X1 [0 z" b% e( [* G8 W$ C- F( j <td height=9 width="25%" class="css3"><a href="../../sbtx.html" onMouseMove="showtip('赏心悦目<br>精美的图像和壁纸能使你得到一些放松！')" onMouseOut=hidetip() ( a8 \6 A" Q5 Y" d8 K
target=_blank>赏心悦目</a></td>
0 b$ @, r0 t, x ^ V: Z9 L <td height=9 width="25%" class="css3"><a href="../../flashmenu1.htm" onMouseMove="showtip('网页素材<br>大量的网页素材给你的网页制作提供方便！')"
3 w/ I! x1 |9 @ k' q$ \5 x onMouseOut=hidetip()>网页素材</a></td>2 `- m1 q* P5 ^9 ]4 z
<td height=9 width="25%" class="css3"><a href="../../wyjcs.html" onMouseMove="showtip('图像处理<br>图形软件的使用以及图像的特效制作')" onMouseOut=hidetip() 4 Q! m9 L6 M$ r
target=_blank>图像处理</a></td>! Q# ~8 ^* r' j* L8 q
<td height=9 width="25%" class="css3"><a href="../../soft.htm" onMouseMove="showtip('网页特效<br>网页特效的大宝库，有详细的使用说明')" onMouseOut=hidetip() 7 c# p2 W2 e' c5 R# F5 A+ _
target=_blank>网页特效</a></td>' S4 x" r, @* b/ S. \4 [+ K
</tr>
2 G7 F: R0 M" B: x, e/ i </tbody> # `( _- G! {0 z5 T( g
</table> |
|
发表于 2008-1-21 20:52
|