|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之带注释的表格菜单特效
一：将下面的代码放在<HEAD>与</HEAD>之间& O7 B) P: h8 J- j4 J
<SCRIPT language=javascript >
: t( ~. q/ g9 p z* _- P) M1 ~; Bdocument.write(
5 v, E4 X5 `, G* C"<div id=\"tooltip\" style=\"position:absolute;visibility:hidden; padding:3px;border:1px solid #528AC6;\
1 {* C' S6 x- I% m;background-color:#ffdfd0; height: 19px; left: 77px; top: 96px\"></div>");# k% q( c: Y8 `3 u' ~
5 p6 p8 s/ Q/ _/ c7 w- W: F4 L( cfunction showtip(text) //显示链接的说明* x& v7 \8 ]( s5 S4 t
{; i( r; C1 u% S9 A/ n
if (document.all&&document.readyState=="complete") //针对IE
3 Z6 y& J0 D8 v6 }! J {
7 E1 `/ H+ s2 r$ { 5 h8 ?' I$ v/ e4 p, z5 f
document.all.tooltip.innerHTML="<div vAlign=center><font SIZE=2>"+text+"</font></div>";
) {- B4 i0 U7 V$ ]. h1 V2 R& _ document.all.tooltip.style.pixelLeft=event.clientX+document.body.scrollLeft+10;' B6 y5 m0 ]3 ^' W, \; h; `- U. a
document.all.tooltip.style.pixelTop=event.clientY+document.body.scrollTop+10;' v- U9 ?7 R9 U
document.all.tooltip.style.visibility="visible";1 ?: n. n- _; b- Z
}
+ c9 x' n" L; q5 e}) z: F+ S: B2 W! O/ \
; z5 R4 |. y Z) ^ l
function hidetip()
9 [) F4 c3 G# F5 @# R4 f& O{. u& a% R9 M! t
if (document.all)
& ~, L; }0 T# l! p; z document.all.tooltip.style.visibility="hidden";
7 T, G7 @% C3 g8 q, d8 B/ ?8 X/ K! W I}) U; C3 `& y# E, B/ a. |& C
! s+ J2 _. }1 @7 [function setcolor(fntcolor,bgcolor)8 j$ w- O3 O5 K
{, M% U% |- }3 I- `2 d; U U9 x
document.all.tooltip.style.bgcolor=bgcolor;7 h+ D4 S( i3 v$ |- z
document.all.tooltip.innerHTML.Color = fntcolor;
8 v7 q7 d+ R% \7 L1 f9 V}
2 F% y6 \8 D7 R2 z/ `) o
& }' l$ S9 E/ N9 p) O0 Z3 S) |function showhint(text)8 D9 s; S# J7 D6 F7 T+ M6 P5 r
{
4 W' x$ Z5 {* W5 N onmousemove=showtip(text);
# j2 z- c. U8 {3 r; N7 B onmouseover=showtip(text);( M7 W' t2 C4 a7 D
onmouseout=hidetip();, J- c" ^, T( L0 }! |
}" Y' W* u' ]6 N0 {6 k3 {
</SCRIPT>7 p" }4 K( z0 d: m% G
* B# q4 w$ X6 U ?
' u* W4 |! ~4 S X8 o: ^1 s
; r O0 } V6 L- y4 u+ n" e: V1 c6 R8 P
" E0 d9 J/ O6 `6 i- E; |, e2 B. C0 U" N( c5 [8 `
二：将下面的代码复制到〈BODY〉区* h5 ]8 Y/ `% Q+ K7 _$ o
<table align=center border=1 bordercolordark=#ffffff bordercolorlight=#a8cbf1
5 p! ]/ I( \0 C5 ]# E- wcellspacing=0 class=t width="300" bordercolor="#6699CC" cellpadding="0">
) ~" |% K9 [0 N% \4 s, l. c <tbody>
3 R% K% E! c1 @% {; n& ^5 r <tr align="center" bgcolor="#ffdfd0">
, u# |/ Z" \! ?4 t! \) N <td height=9 width="25%" class="css3"><a href="../../sbtx.html" onMouseMove="showtip('赏心悦目<br>精美的图像和壁纸能使你得到一些放松！')" onMouseOut=hidetip()
% Z4 n8 r0 m& e z7 x- Q7 r target=_blank>赏心悦目</a></td> S4 @ F$ q2 }7 d1 q
<td height=9 width="25%" class="css3"><a href="../../flashmenu1.htm" onMouseMove="showtip('网页素材<br>大量的网页素材给你的网页制作提供方便！')" , e( w, T4 Y# U3 U
onMouseOut=hidetip()>网页素材</a></td>
8 G! @8 u% {* F* a/ F <td height=9 width="25%" class="css3"><a href="../../wyjcs.html" onMouseMove="showtip('图像处理<br>图形软件的使用以及图像的特效制作')" onMouseOut=hidetip() 3 {, G( w4 _) R! w% q* p
target=_blank>图像处理</a></td>, p# p# O- p* J. g* U/ s
<td height=9 width="25%" class="css3"><a href="../../soft.htm" onMouseMove="showtip('网页特效<br>网页特效的大宝库，有详细的使用说明')" onMouseOut=hidetip()
6 Q0 C7 F, m4 ]7 ~ target=_blank>网页特效</a></td>
8 u& y9 G4 O n$ o1 D3 t </tr>' ]5 I- [, h% ?* S3 K0 ^7 j" M
</tbody> : j2 O/ N/ ]0 D
</table> |
|
发表于 2008-1-21 20:52
|