|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之带注释的表格菜单特效
一：将下面的代码放在<HEAD>与</HEAD>之间
% v& W' ^' S8 v" n2 j" u' k5 d6 R6 t<SCRIPT language=javascript >. e) x; g2 a, v
document.write(( y7 g1 K5 P+ O& k2 [" d4 ?
"<div id=\"tooltip\" style=\"position:absolute;visibility:hidden; padding:3px;border:1px solid #528AC6;\9 s, O/ }8 X3 J
;background-color:#ffdfd0; height: 19px; left: 77px; top: 96px\"></div>");% O; Z; l, W$ \/ g6 T3 y: h
2 V1 C6 x7 n7 `3 E5 q cfunction showtip(text) //显示链接的说明$ N$ u9 d3 t4 h# }1 c* e% H: B
{) r$ A. j5 ]: W$ ?
if (document.all&&document.readyState=="complete") //针对IE
9 @+ f1 W% u$ r W. n4 c1 ^ {
) `" R! r8 y6 p3 q* l: p/ ? ) N7 M: {8 H1 Q; P# b
document.all.tooltip.innerHTML="<div vAlign=center><font SIZE=2>"+text+"</font></div>";" e7 Q' F; n! D& S5 I5 d
document.all.tooltip.style.pixelLeft=event.clientX+document.body.scrollLeft+10;; n5 J- T: _7 P/ {
document.all.tooltip.style.pixelTop=event.clientY+document.body.scrollTop+10;
n- H6 E1 G5 V6 n( T! J document.all.tooltip.style.visibility="visible"; E1 u* N: O1 \9 C/ a2 u* r, \
}1 W1 q$ p6 A, }: |
}
$ O8 {$ d& t z: \- {" v1 v5 ]5 G# n* n
function hidetip() 6 r7 j+ j3 v9 o7 t/ k; E, _/ ~: A
{
3 R' v9 c1 j+ i. b0 Y s5 W% L: Jif (document.all)' }3 b0 M* R- @* V
document.all.tooltip.style.visibility="hidden";4 r, Z* i, X9 `, ^, Z6 b
}. C& h! `. z( M! q
4 S Y+ `* T! S0 ^" lfunction setcolor(fntcolor,bgcolor)
$ [- M( ~3 F+ G7 O3 i{2 j, n' R, F( W$ x4 q7 D W* p
document.all.tooltip.style.bgcolor=bgcolor;. m5 |% x# H7 J& z F+ o# f! v2 s
document.all.tooltip.innerHTML.Color = fntcolor;
1 X, h7 a9 x6 R. E}3 ]: \0 w( T0 d( M+ K
; ~4 F! L7 s% s! t! I& T
function showhint(text)
, `" X) T- u5 a+ ?4 M* x* J% a{/ g- C J* F9 w S: X3 |+ J9 e
onmousemove=showtip(text);
+ ~9 {7 _- A6 G8 Y# K- `$ a onmouseover=showtip(text);2 J* @$ N* Z! V+ _0 F. f& P2 c
onmouseout=hidetip();
) L$ E. d/ d1 r$ K0 H0 f) z}( o& l7 \/ a5 B9 g+ b
</SCRIPT>1 t. t" A% l+ I" I1 a. j
0 ?- T# H- H( s1 x7 S4 f. C/ H
1 \1 Z8 f) i9 M! r1 ^, w
; a8 y- `" t3 {# D( }0 n
, Y( X! F( S/ j5 ]$ }. z* t! F4 [! I
. ~* f, @& q# r; w& W( K二：将下面的代码复制到〈BODY〉区/ [0 q A5 R' U8 R
<table align=center border=1 bordercolordark=#ffffff bordercolorlight=#a8cbf1 . E, U, b+ s8 u2 b# ]4 ^* K+ S
cellspacing=0 class=t width="300" bordercolor="#6699CC" cellpadding="0">
; [8 I7 H% E/ J, @) P" e3 P7 O+ g/ @ <tbody> . T) h% t7 k/ d f# z0 a
<tr align="center" bgcolor="#ffdfd0">
" A5 {6 q8 Y$ t( |* S <td height=9 width="25%" class="css3"><a href="../../sbtx.html" onMouseMove="showtip('赏心悦目<br>精美的图像和壁纸能使你得到一些放松！')" onMouseOut=hidetip()
# q% F8 d0 a( A, e& B& | target=_blank>赏心悦目</a></td>4 @0 G9 D' T' Q# E
<td height=9 width="25%" class="css3"><a href="../../flashmenu1.htm" onMouseMove="showtip('网页素材<br>大量的网页素材给你的网页制作提供方便！')"
! S% q- V" [% {8 v* s3 G onMouseOut=hidetip()>网页素材</a></td>- E; y& x8 y& w
<td height=9 width="25%" class="css3"><a href="../../wyjcs.html" onMouseMove="showtip('图像处理<br>图形软件的使用以及图像的特效制作')" onMouseOut=hidetip() % p2 W2 d( E* m7 Q0 J7 |. L
target=_blank>图像处理</a></td>
- K/ s1 P& l( W <td height=9 width="25%" class="css3"><a href="../../soft.htm" onMouseMove="showtip('网页特效<br>网页特效的大宝库，有详细的使用说明')" onMouseOut=hidetip()
) ]% _" @& E% _ target=_blank>网页特效</a></td>
# c5 @ A' q" h& e </tr>5 b1 s0 a& X I% h- {. t* G
</tbody>
/ a$ ] U4 k) A/ k' l </table> |
|
发表于 2008-1-21 20:52
|