|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之带注释的表格菜单特效
一：将下面的代码放在<HEAD>与</HEAD>之间- `# ?7 X% u! F7 Z9 D
<SCRIPT language=javascript >
: d( {* D- P* Y) ~0 X, mdocument.write(
% t: L( V8 k$ ^3 L"<div id=\"tooltip\" style=\"position:absolute;visibility:hidden; padding:3px;border:1px solid #528AC6;\
! p$ X7 |8 B/ U# ?. y! ?5 V;background-color:#ffdfd0; height: 19px; left: 77px; top: 96px\"></div>");5 _& O6 b$ m: e: L. R7 g
: U* I9 O0 D* X( s& D
function showtip(text) //显示链接的说明
- u% w* K4 c( b{
( u0 K2 B" Y0 Q* C! h8 O' ]* v if (document.all&&document.readyState=="complete") //针对IE; j4 y* P" b% E; U
{: ]2 d1 O; P: P( x+ Y! s/ N# k' v
4 p3 S$ i9 @. O! C J* A- s1 z+ e document.all.tooltip.innerHTML="<div vAlign=center><font SIZE=2>"+text+"</font></div>";
# K6 k4 d b- @& t. ~& `" ` document.all.tooltip.style.pixelLeft=event.clientX+document.body.scrollLeft+10;& N! Z8 B/ X4 C- |6 n
document.all.tooltip.style.pixelTop=event.clientY+document.body.scrollTop+10;1 }/ Y( j0 c& `* ^
document.all.tooltip.style.visibility="visible";
9 R. z" w$ d) h( }3 `8 n5 i$ T, f- r }: [; B7 O3 d8 L1 o- n! i
}
( }& Y- Y h; H6 J
' w* j: \7 b1 g( A1 k8 G+ y- Cfunction hidetip()
# g& \! C: v. ~$ y{9 s$ z; r% A/ T7 b! h& d3 |$ L K
if (document.all)
) d) L8 H- T/ W" \% g document.all.tooltip.style.visibility="hidden";
+ r7 Z. M/ L4 c/ h) P# X" q1 V}" T9 y% d) w# {. [7 b
3 C- ]; ^# P/ ]+ H2 c1 r! n1 Y
function setcolor(fntcolor,bgcolor)' ~7 o- T! w% v$ u( x& R
{
2 k: C7 N5 L' Z5 g# A6 m. Z: X" H document.all.tooltip.style.bgcolor=bgcolor;5 C6 Q1 q8 R# X, e6 `
document.all.tooltip.innerHTML.Color = fntcolor;
" O- h+ A* R2 W7 _7 L! W/ `}
0 e! q* @0 `" N( M8 t( u4 T5 @) B6 \, l- v+ T
function showhint(text)
; U! p$ Y2 ~3 c5 {( p- y" T{2 R& Y( W% \8 s
onmousemove=showtip(text);+ E; `! l0 S h1 f9 z( M3 n
onmouseover=showtip(text);4 u( E) t% J2 v6 S8 m/ \) e
onmouseout=hidetip();
. ^) @1 ] ]& N% j}% c$ o; f4 ] s! ~" G+ e, C
</SCRIPT>
' n8 O/ H1 i8 E5 h+ D
" l! c9 a' f8 b* X, l; y9 @ X1 Q$ X3 g$ P" H5 J R4 j9 B
8 C3 \- m7 E' t( n# O6 f4 g, G" [" K) U" x; a1 K, k+ G" I
) ^1 Z7 J* X$ N4 ?+ B
$ u$ p, j: B c9 m二：将下面的代码复制到〈BODY〉区
# F7 l# |% j7 ?4 u6 j% [8 J; G<table align=center border=1 bordercolordark=#ffffff bordercolorlight=#a8cbf1
! I5 @) T' k6 bcellspacing=0 class=t width="300" bordercolor="#6699CC" cellpadding="0">
% Q1 R' ?' c5 d9 B' k4 ?: x7 E( K- d) j2 e <tbody> 6 f( w: y* u [1 M
<tr align="center" bgcolor="#ffdfd0"> + A* V Q9 V9 P2 ?/ {
<td height=9 width="25%" class="css3"><a href="../../sbtx.html" onMouseMove="showtip('赏心悦目<br>精美的图像和壁纸能使你得到一些放松！')" onMouseOut=hidetip() - W& U4 o; u e, z; l/ S5 B$ G
target=_blank>赏心悦目</a></td>! W$ x* T' f K5 |' x7 b! Z! b
<td height=9 width="25%" class="css3"><a href="../../flashmenu1.htm" onMouseMove="showtip('网页素材<br>大量的网页素材给你的网页制作提供方便！')" - U! {' C. r# {3 n4 ?/ g
onMouseOut=hidetip()>网页素材</a></td>, P2 r0 {. x9 V6 V0 @# g" ~
<td height=9 width="25%" class="css3"><a href="../../wyjcs.html" onMouseMove="showtip('图像处理<br>图形软件的使用以及图像的特效制作')" onMouseOut=hidetip()
1 }7 O. H# P6 ?1 j( D' s target=_blank>图像处理</a></td>
) ^# L& F. X6 ?8 J7 w% o4 M- ~# T# { <td height=9 width="25%" class="css3"><a href="../../soft.htm" onMouseMove="showtip('网页特效<br>网页特效的大宝库，有详细的使用说明')" onMouseOut=hidetip()
* ^% b7 Y% F+ b target=_blank>网页特效</a></td>
, U0 q4 p) Y0 M6 w( M8 p </tr>
1 B4 p) r$ x$ L! |! g. K </tbody>
( C6 w0 l! J' |2 u' L4 r </table> |
|
发表于 2008-1-21 20:52
|