|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之带注释的表格菜单特效
一：将下面的代码放在<HEAD>与</HEAD>之间0 f+ |! q1 j8 E# G
<SCRIPT language=javascript >
0 j5 n- U/ ~/ ddocument.write(
2 p y0 k7 G# R- X5 Y0 V! E9 ["<div id=\"tooltip\" style=\"position:absolute;visibility:hidden; padding:3px;border:1px solid #528AC6;\6 O1 t7 ^/ m7 k
;background-color:#ffdfd0; height: 19px; left: 77px; top: 96px\"></div>");1 M; y5 l$ n& l- p1 X' j) Y4 U
/ K: a6 k6 _7 ?( o: ~$ b/ g& G
function showtip(text) //显示链接的说明* S4 E& Q% A6 e, c# U$ ^. L
{
" Z) ]4 l' I. A! m) L( \" @( m if (document.all&&document.readyState=="complete") //针对IE4 [2 \9 A( r& c" D/ R
{
$ F6 |9 D/ `" B8 W8 m g( B9 ^ ) b4 m" I! U' _7 o9 A3 E/ w
document.all.tooltip.innerHTML="<div vAlign=center><font SIZE=2>"+text+"</font></div>";
7 Y( D% |. P B0 d- r- ] document.all.tooltip.style.pixelLeft=event.clientX+document.body.scrollLeft+10;5 K$ Q& f4 t, I: T) K+ M0 c
document.all.tooltip.style.pixelTop=event.clientY+document.body.scrollTop+10;: r @8 C4 }5 {7 A
document.all.tooltip.style.visibility="visible";4 Z1 ^( V: c, N7 s) l
}- q, X: S: H; g) W: Z- w
}4 S6 `& o+ t' [& h0 G6 S0 p% R1 Z" Q
( _9 H! e- Q. o6 n
function hidetip() 4 f; H9 \2 T/ s; G9 O; l2 m
{
: r3 \ R+ _. N" f B+ vif (document.all)
# V2 e9 T2 i9 e. g3 D document.all.tooltip.style.visibility="hidden";
. y9 v" z$ ]& ^+ u! Z}, ^3 O1 q1 n! S/ J h5 S
a2 J3 {$ x. H% X9 h* @$ kfunction setcolor(fntcolor,bgcolor)
. d8 r/ W+ a( |/ Z{6 c3 C1 P j, q0 R I- S
document.all.tooltip.style.bgcolor=bgcolor;
6 ?. g6 |3 V6 K0 P document.all.tooltip.innerHTML.Color = fntcolor;
$ C7 e) I: K) s! L' U$ a}/ N" r& D$ J) E$ G
5 Z' A _6 z. {6 `6 m; Y g
function showhint(text) x: R* F+ X8 f, x) {
{
6 z) ]9 n9 R3 w1 x9 I1 j8 ~6 f8 u onmousemove=showtip(text);3 Y; c! \" R1 ~) K! [* j O
onmouseover=showtip(text);
* Z+ @) @, I; }" j9 u onmouseout=hidetip();/ \( c1 p- i; {, F3 y. ]
}4 b0 ~4 Y: G9 P
</SCRIPT>9 |9 T. k! o" w4 o8 U3 f" h; ~! N- K9 E
( L6 D& ~# n/ W9 O! V! R7 A) U0 N; }6 }" J, k
7 Q6 `# P7 [; \* v
- I0 }# x- o* W( Q( r" {
. g! H$ F1 ]6 b; e5 l: E7 ^9 ~$ H1 m6 |" t) |7 f/ o$ K) R `
二：将下面的代码复制到〈BODY〉区
7 J2 S" \1 |9 q<table align=center border=1 bordercolordark=#ffffff bordercolorlight=#a8cbf1 4 B; \6 d+ k6 b n5 z$ r
cellspacing=0 class=t width="300" bordercolor="#6699CC" cellpadding="0">; Y* d7 Q' P: G5 ^' e
<tbody> 0 Z) H% @2 ]# p% e
<tr align="center" bgcolor="#ffdfd0"> 7 ?7 I: S+ D% V3 b) Z9 l
<td height=9 width="25%" class="css3"><a href="../../sbtx.html" onMouseMove="showtip('赏心悦目<br>精美的图像和壁纸能使你得到一些放松！')" onMouseOut=hidetip()
" }6 U* S7 A6 n% F; ~3 `& u; c target=_blank>赏心悦目</a></td>! }* A5 b" w! w( [5 a1 I
<td height=9 width="25%" class="css3"><a href="../../flashmenu1.htm" onMouseMove="showtip('网页素材<br>大量的网页素材给你的网页制作提供方便！')"
- I8 t7 b8 b, N onMouseOut=hidetip()>网页素材</a></td>
# r8 H1 I* R5 H: f2 o <td height=9 width="25%" class="css3"><a href="../../wyjcs.html" onMouseMove="showtip('图像处理<br>图形软件的使用以及图像的特效制作')" onMouseOut=hidetip()
' X# r& f* g9 t2 g0 S$ K" L target=_blank>图像处理</a></td>( S; U6 S" p9 L- o
<td height=9 width="25%" class="css3"><a href="../../soft.htm" onMouseMove="showtip('网页特效<br>网页特效的大宝库，有详细的使用说明')" onMouseOut=hidetip() * l5 A5 ?: c' R
target=_blank>网页特效</a></td>
+ A6 R- ^. n- @9 C) U3 i- h1 j- V </tr>
) o! X) G3 i& _: _; k, X. ? </tbody> 5 H% F6 Y) T. K2 F$ e
</table> |
|
发表于 2008-1-21 20:52
|