|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之带注释的表格菜单特效
一：将下面的代码放在<HEAD>与</HEAD>之间
& ?0 N! K# x1 i# d<SCRIPT language=javascript >
- A* s. |! f& c* _5 N( m; w( Sdocument.write(; O/ F+ O& }! B
"<div id=\"tooltip\" style=\"position:absolute;visibility:hidden; padding:3px;border:1px solid #528AC6;\
( i7 I( F; }! ?1 A4 l% J# `: r- q;background-color:#ffdfd0; height: 19px; left: 77px; top: 96px\"></div>");: {! L5 S+ O1 Z9 o% M7 T
& j' r- F7 m( S. u1 `
function showtip(text) //显示链接的说明 O( h3 C* k0 `6 p) Z1 P& [
{% {" b& H+ K9 P/ G
if (document.all&&document.readyState=="complete") //针对IE- l, X: ~; H2 x( [. S
{! e; |+ j: w% I1 ?
7 Q- Z7 ]: I8 B( Y; g document.all.tooltip.innerHTML="<div vAlign=center><font SIZE=2>"+text+"</font></div>";
3 T/ s1 D& G, \$ c. B5 k+ N: E document.all.tooltip.style.pixelLeft=event.clientX+document.body.scrollLeft+10;
' w/ F, _# [6 h- `# e% q4 t document.all.tooltip.style.pixelTop=event.clientY+document.body.scrollTop+10;
; f; \/ Q0 u9 J; A# O document.all.tooltip.style.visibility="visible";, ~4 o: Z# K# t
}
% Z, f8 C/ q+ ]) p0 T}. N1 P) O# f6 A& n
k, C5 \ t( l; r3 p" t. Sfunction hidetip()
- ^) E1 b' Y! ^; `* K3 m{( g, R* U* L- H+ z
if (document.all)
% J# d3 L8 l% i) _# u document.all.tooltip.style.visibility="hidden";
& a$ H* @) }& O2 I/ o( ~- ^5 t}7 p* W, A& U1 `) {. v
7 z, D5 |" {6 r/ y4 m
function setcolor(fntcolor,bgcolor)
5 w3 P0 p! q+ @* `, k# [{" S9 _0 Z* {* G6 Q' x
document.all.tooltip.style.bgcolor=bgcolor;
2 e, y9 d5 t% a0 _ document.all.tooltip.innerHTML.Color = fntcolor;7 b) J( q6 S. r$ n
}
, E1 c3 w9 G* ~& B3 p. B' {9 a
* f5 {2 [5 f v) Lfunction showhint(text)
3 Q8 ?4 P/ P3 R{
+ X; ~6 c$ ]* C+ t9 ? onmousemove=showtip(text);/ a6 u; \3 i7 {/ ?% E& p
onmouseover=showtip(text);
* ], Y1 r% }! p" A4 g onmouseout=hidetip();' r/ d5 a- {& _% U& ~7 ~0 {
} p; j) m) ?2 {* F4 d B* e
</SCRIPT>3 p/ b z6 \4 p- Q
+ P, M* } z0 n2 \( p6 }! C7 ?
+ R4 B- P b6 @* x' i* b
* S: D, Z. z9 [, T# G# v; I& a' P& X: q( R3 s
2 N7 h6 b" C$ i a; H' Y
) i5 _, k1 G+ d) V3 q M& s& a二：将下面的代码复制到〈BODY〉区
0 R8 U s1 s$ p! m, M! }<table align=center border=1 bordercolordark=#ffffff bordercolorlight=#a8cbf1 # }, r5 x# e# w. G( h/ V4 H7 o
cellspacing=0 class=t width="300" bordercolor="#6699CC" cellpadding="0">) f3 e0 h7 M, Y; q
<tbody> 0 Q; h2 M7 s( C8 N/ {- ~
<tr align="center" bgcolor="#ffdfd0">
. I# L) ^% y5 D# Q+ J <td height=9 width="25%" class="css3"><a href="../../sbtx.html" onMouseMove="showtip('赏心悦目<br>精美的图像和壁纸能使你得到一些放松！')" onMouseOut=hidetip() : \) R) v( J; F
target=_blank>赏心悦目</a></td>: C! L! O9 l: N+ h: \; W
<td height=9 width="25%" class="css3"><a href="../../flashmenu1.htm" onMouseMove="showtip('网页素材<br>大量的网页素材给你的网页制作提供方便！')" 6 C s3 ~) I1 W" }" t
onMouseOut=hidetip()>网页素材</a></td>% q \" o4 a" [9 p; q
<td height=9 width="25%" class="css3"><a href="../../wyjcs.html" onMouseMove="showtip('图像处理<br>图形软件的使用以及图像的特效制作')" onMouseOut=hidetip()
2 V2 k# J' h _! w3 x target=_blank>图像处理</a></td>, d) j9 J. p8 R3 V; y% {+ ]
<td height=9 width="25%" class="css3"><a href="../../soft.htm" onMouseMove="showtip('网页特效<br>网页特效的大宝库，有详细的使用说明')" onMouseOut=hidetip()
4 ~$ V+ i* Y$ o; D" F! p* l target=_blank>网页特效</a></td>
0 [# D. N) u/ j. i2 u; v </tr>
/ F, Z- A# m c$ S8 ], X1 K </tbody>
6 c; B+ n7 U/ H! P R$ P1 t </table> |
|
发表于 2008-1-21 20:52
|