|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之带注释的表格菜单特效
一：将下面的代码放在<HEAD>与</HEAD>之间0 v7 Q1 V- ]! ]# i6 N9 }5 @
<SCRIPT language=javascript >- e" c' Y$ K/ i; b: @
document.write(
+ Y# Q& _. S; q- ?7 Z8 G"<div id=\"tooltip\" style=\"position:absolute;visibility:hidden; padding:3px;border:1px solid #528AC6;\3 ~" ~$ t" n6 s& ^2 c9 ]3 G" _1 }
;background-color:#ffdfd0; height: 19px; left: 77px; top: 96px\"></div>");5 F. I6 ^! [. ?! T, v
2 y; R" M! k% U% g5 E0 H
function showtip(text) //显示链接的说明0 [6 x+ O# Y; S$ H9 Y. f
{9 J7 A! C" b6 r( ]: w# ?0 @
if (document.all&&document.readyState=="complete") //针对IE2 g& n' i/ _- L
{
9 D( ^5 L' |% v$ ~) Z4 x1 t $ u5 ~4 C! ]: Z; E( p& p* _
document.all.tooltip.innerHTML="<div vAlign=center><font SIZE=2>"+text+"</font></div>";
& X! t5 X& H# B& N6 f document.all.tooltip.style.pixelLeft=event.clientX+document.body.scrollLeft+10;
* s n5 t1 Y& A, B- C document.all.tooltip.style.pixelTop=event.clientY+document.body.scrollTop+10;( X9 n7 ? Q* c5 ]$ ~+ c) [2 W
document.all.tooltip.style.visibility="visible";. @2 W* {- E) S1 j& q$ D! G Y0 @
}
% i4 ]$ R6 A6 u/ l9 Q2 U0 H} M' \6 ]7 S# f4 M7 m) x
3 J# a$ V- S9 a8 d4 W. c$ k( v
function hidetip()
0 z7 [# k. u% V* _+ m5 u1 f5 F{
0 z+ u& | q3 V- @if (document.all)9 y; d; l% E' H8 Q9 @& p: P4 V- h+ q
document.all.tooltip.style.visibility="hidden";
; j: I" C3 W/ N, K- P& d/ l8 n% X}# [% @4 b D& R5 F9 @ M# F1 l
6 r9 r; H5 \. ^# v5 s/ ^% g
function setcolor(fntcolor,bgcolor)
- r3 X! u9 X% l7 h) }{; U1 G6 f, F3 _* p7 r, ~7 u
document.all.tooltip.style.bgcolor=bgcolor;* d! X0 P& i$ y) Z
document.all.tooltip.innerHTML.Color = fntcolor;; F/ o7 L4 W9 c$ j; @
}
" g% B$ _, N" I, K9 M8 u6 m" ^+ K9 A2 n( T) \
function showhint(text). J V7 g8 i( |( g5 [3 h
{
: e$ I+ X; C% Q/ {9 _) t onmousemove=showtip(text);
5 b0 q& P1 m+ N/ g! V onmouseover=showtip(text);$ B- n# _! _5 E* E( P$ k
onmouseout=hidetip();. ~) R, {" ]: @5 X0 j% W
}. E& s U2 x3 v( o5 F! J
</SCRIPT>
& d$ ]* X* I2 Y
; f( G+ W2 l. z* v# E( X
+ H2 w. B$ L' I4 `3 X3 l
( x% f* _1 F, }) @- Z4 O7 m) @ p5 @$ Y7 G) k7 Z% s N
0 ?! g9 ?# }4 o5 r: @( \# E
; k5 r3 L( w$ y r4 n) f二：将下面的代码复制到〈BODY〉区( j+ v8 d% M9 G6 }$ s8 L
<table align=center border=1 bordercolordark=#ffffff bordercolorlight=#a8cbf1 0 W y8 [( T. y3 A
cellspacing=0 class=t width="300" bordercolor="#6699CC" cellpadding="0">! ^. Y( E6 l. A8 M5 w7 G/ C3 Y
<tbody> 5 S0 e, S2 K8 o/ y- |4 ?- H. o
<tr align="center" bgcolor="#ffdfd0"> - T' a1 r! r* m1 Q+ I5 y
<td height=9 width="25%" class="css3"><a href="../../sbtx.html" onMouseMove="showtip('赏心悦目<br>精美的图像和壁纸能使你得到一些放松！')" onMouseOut=hidetip()
* _" v& F E! J9 o% R target=_blank>赏心悦目</a></td>/ o5 t3 c4 Q6 J, X# D' _0 l
<td height=9 width="25%" class="css3"><a href="../../flashmenu1.htm" onMouseMove="showtip('网页素材<br>大量的网页素材给你的网页制作提供方便！')"
" X5 v' X% A/ y* S onMouseOut=hidetip()>网页素材</a></td>
/ @) O1 f3 w3 R0 f* A <td height=9 width="25%" class="css3"><a href="../../wyjcs.html" onMouseMove="showtip('图像处理<br>图形软件的使用以及图像的特效制作')" onMouseOut=hidetip() 9 K+ ] r- I' j" n& e# n+ T* }6 f
target=_blank>图像处理</a></td>9 i: n3 J: _" {9 P
<td height=9 width="25%" class="css3"><a href="../../soft.htm" onMouseMove="showtip('网页特效<br>网页特效的大宝库，有详细的使用说明')" onMouseOut=hidetip() 4 {5 |: u- F; ^+ C4 o8 ?/ G
target=_blank>网页特效</a></td>
, m! H' g3 ~% [8 u </tr>8 [/ h1 Z0 `% [7 R
</tbody> 8 S: X) e! j5 g( j/ g. b/ Q+ b/ W
</table> |
|
发表于 2008-1-21 20:52
|