|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之带注释的表格菜单特效
一：将下面的代码放在<HEAD>与</HEAD>之间
6 v7 @, l8 h" }4 A1 T<SCRIPT language=javascript >
; [( R1 t5 W! |2 Cdocument.write(
- a+ `, P$ \. |: d) m6 `"<div id=\"tooltip\" style=\"position:absolute;visibility:hidden; padding:3px;border:1px solid #528AC6;\$ [; |2 y5 m Y" V7 a* l# l
;background-color:#ffdfd0; height: 19px; left: 77px; top: 96px\"></div>");
9 {* n' [9 ]& o6 o" M0 h/ x& Y$ N- m
4 H; U) h! c' \, f# {$ G) tfunction showtip(text) //显示链接的说明3 i* A8 U) ~+ [+ o
{
1 Q- U# q- ?7 I' Q/ B+ f2 O8 [9 {2 u6 E) d if (document.all&&document.readyState=="complete") //针对IE
; J4 l% o p5 U+ W/ x9 U {2 M) i- d, ^( E1 J$ j) s
! i' {$ Q& P2 l3 R, G
document.all.tooltip.innerHTML="<div vAlign=center><font SIZE=2>"+text+"</font></div>";
) @8 ], S( ~2 s document.all.tooltip.style.pixelLeft=event.clientX+document.body.scrollLeft+10;
& o5 Q, b& X# L* l4 c+ S document.all.tooltip.style.pixelTop=event.clientY+document.body.scrollTop+10;
3 J' R! m. @2 W. H4 a document.all.tooltip.style.visibility="visible";; L* o5 {- ]" S9 {" Z' Y) a+ Z
}6 k. j: b- M* `, d: }8 g' h
}; g- H) \! x9 j
# N7 L5 W O* J6 G$ ^
function hidetip()
# M6 S/ M& N# T' N{
2 ?1 D6 A1 @* V9 Kif (document.all)
8 f$ B1 c% A: ]- q, h# H7 g; o document.all.tooltip.style.visibility="hidden";
4 D6 j! d4 s3 o2 m3 J3 j2 s/ c}& w( y( a2 M! ]2 e3 F
4 \: d1 M' d O, {* c+ S# [0 H& [
function setcolor(fntcolor,bgcolor)
# i* Z4 f, F. j: f6 O{5 W& p. c( w* D3 V: e7 Y' M6 ?
document.all.tooltip.style.bgcolor=bgcolor;
% d2 j4 X1 Y* l$ P" M8 \8 R document.all.tooltip.innerHTML.Color = fntcolor;
+ `/ K# \; L" u- L+ l}
3 {+ Q( A2 k. E [
* T* c( e; c* M1 {9 v7 b7 nfunction showhint(text)0 X; d$ _" h9 e9 W+ k Z3 J
{
' k1 O1 x; a5 g( O onmousemove=showtip(text);
/ e6 c2 Z: S- v onmouseover=showtip(text);8 Z$ _8 l$ E% H; {2 x& q
onmouseout=hidetip();
& P. J( A: _& B0 i/ ]}
- E" J& u5 |8 f" ^5 v$ q</SCRIPT>
$ Q n, v8 }$ I1 P7 j. g- O7 H
6 M1 G8 K- L/ Z. O2 n3 r+ j* B
2 ^, J; x. [9 b* k! D" `" F. d" ~- F: F
: A" I- p2 m6 T3 Z# X, Y5 p( g# M: ?$ H
: h# N. \4 ~: |% q- ]& V. {0 p二：将下面的代码复制到〈BODY〉区5 H' R, ^9 Y7 z+ O8 k
<table align=center border=1 bordercolordark=#ffffff bordercolorlight=#a8cbf1 6 |3 E: B3 e( |, S8 x
cellspacing=0 class=t width="300" bordercolor="#6699CC" cellpadding="0">
; C) s/ x& Q" ~ <tbody>
* e& _0 I' e7 j: i- h <tr align="center" bgcolor="#ffdfd0"> & D: E% H* o5 `7 y! o/ H
<td height=9 width="25%" class="css3"><a href="../../sbtx.html" onMouseMove="showtip('赏心悦目<br>精美的图像和壁纸能使你得到一些放松！')" onMouseOut=hidetip()
/ X# m. L/ o( s! `- R target=_blank>赏心悦目</a></td>0 B4 `* v7 m+ X/ l6 T- D
<td height=9 width="25%" class="css3"><a href="../../flashmenu1.htm" onMouseMove="showtip('网页素材<br>大量的网页素材给你的网页制作提供方便！')"
; ]9 F& r! k, r$ H7 t8 T0 f onMouseOut=hidetip()>网页素材</a></td>
- I8 }. U( W8 R: K% r* G! {9 c, ^ <td height=9 width="25%" class="css3"><a href="../../wyjcs.html" onMouseMove="showtip('图像处理<br>图形软件的使用以及图像的特效制作')" onMouseOut=hidetip() 4 ^. y: U: M1 S% z5 \& o
target=_blank>图像处理</a></td>
, J. |) R8 X4 c6 w <td height=9 width="25%" class="css3"><a href="../../soft.htm" onMouseMove="showtip('网页特效<br>网页特效的大宝库，有详细的使用说明')" onMouseOut=hidetip()
, @4 h5 B+ @/ B6 V6 R8 I6 l target=_blank>网页特效</a></td>7 t/ E7 M' l, e- `7 Y. g+ n6 V
</tr>
! `5 l6 A- o9 F2 s. l7 g </tbody> ' i) {- a) O% W1 S: L( P
</table> |
|
发表于 2008-1-21 20:52
|