|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之带注释的表格菜单特效
一：将下面的代码放在<HEAD>与</HEAD>之间
0 h# ^" O+ K4 U# z( z<SCRIPT language=javascript >% v$ s. H' ?2 r5 o+ i% C
document.write(9 Y& a: \8 G3 U/ j" B! S
"<div id=\"tooltip\" style=\"position:absolute;visibility:hidden; padding:3px;border:1px solid #528AC6;\
6 u8 p, `* t$ G8 T& l' O& S3 g3 @;background-color:#ffdfd0; height: 19px; left: 77px; top: 96px\"></div>");; d- N& @3 Q- Z* g6 S) q" g: [
# \/ f- M1 h# {/ S. u' x5 _- Vfunction showtip(text) //显示链接的说明
& s7 e! z7 Q: G4 \{
$ q w- `+ M! \: A if (document.all&&document.readyState=="complete") //针对IE
$ q& ^5 h! t& b {
& I6 h' q; h( r( K7 X; O% H
. x% g1 P8 p- y: c" L) T document.all.tooltip.innerHTML="<div vAlign=center><font SIZE=2>"+text+"</font></div>";8 m" A# W( B; t; V/ J- F
document.all.tooltip.style.pixelLeft=event.clientX+document.body.scrollLeft+10;
7 u* r, y- v" m. T' ]7 I5 V; G document.all.tooltip.style.pixelTop=event.clientY+document.body.scrollTop+10;+ v& H5 a' h& p: y0 K1 k& f
document.all.tooltip.style.visibility="visible";- s' j- u$ ?- M# K! J/ k
}
) S$ Q5 r0 b h}* r2 f1 y* f& _1 d$ z; o
' ?: I! B) f m8 o2 Y1 E& w
function hidetip()
" R5 ]; V" p8 Y q: P8 Y- q5 s2 m{; B* E+ {$ u: k; c- G6 Q
if (document.all)7 F! x3 h% _. o- e) w+ D$ W
document.all.tooltip.style.visibility="hidden";
: W# J, g' B7 {( ]$ w; p6 d" W}
6 A7 |) G, r: `# h$ A# M5 Q. [% q! R$ Y1 y7 p
function setcolor(fntcolor,bgcolor)
0 D* C8 M+ J b8 Q{
7 [$ V" _$ j8 `, A# ^; {+ u document.all.tooltip.style.bgcolor=bgcolor;8 X# U# S& o8 B* H+ H2 t2 A
document.all.tooltip.innerHTML.Color = fntcolor;% f @2 c) e' K9 p1 w ?9 m5 z
}
* f' B! Z/ T. f5 O2 z# R& Y0 V, {
function showhint(text)
' q* ]% w1 {* `: K{
. F1 H5 O O( k" S5 S3 J onmousemove=showtip(text);
5 E) c) ~) ~1 v onmouseover=showtip(text);1 P0 B/ C3 [0 x, }$ N1 L
onmouseout=hidetip();
2 X" ^& L/ j0 ]& p; N$ F}! G" T. j& v6 z1 c
</SCRIPT>) [* d, y: O- y2 n
( ^, T; k7 Y3 C) n, o7 K. Q i- J6 v
7 i. I8 l: F1 C! j( @5 ^! M3 Q& ~4 N8 t. W! K
% B8 c% w) q* A, R! d2 L3 L- a$ M( C- |4 X* t% J( C4 L
6 U& {' y) V9 l0 q$ D二：将下面的代码复制到〈BODY〉区, R# l& a- ^7 s' q
<table align=center border=1 bordercolordark=#ffffff bordercolorlight=#a8cbf1 - X7 q8 ~ ^2 W( h' B- T
cellspacing=0 class=t width="300" bordercolor="#6699CC" cellpadding="0">. I' F' v! S! L8 q/ u+ i
<tbody>
; Y* t* O1 j; P7 S0 q( j <tr align="center" bgcolor="#ffdfd0">
4 n* b2 S- V! q7 p <td height=9 width="25%" class="css3"><a href="../../sbtx.html" onMouseMove="showtip('赏心悦目<br>精美的图像和壁纸能使你得到一些放松！')" onMouseOut=hidetip()
# w% a1 z5 O8 O/ j- Y& A target=_blank>赏心悦目</a></td>
1 \, t' Q8 @* s$ Y/ ]. O: E3 K <td height=9 width="25%" class="css3"><a href="../../flashmenu1.htm" onMouseMove="showtip('网页素材<br>大量的网页素材给你的网页制作提供方便！')"
8 A! \4 L9 D0 p6 @# u( n onMouseOut=hidetip()>网页素材</a></td>2 s* [5 F5 ] z5 J
<td height=9 width="25%" class="css3"><a href="../../wyjcs.html" onMouseMove="showtip('图像处理<br>图形软件的使用以及图像的特效制作')" onMouseOut=hidetip() 5 [1 p6 Y) b ?+ j9 L
target=_blank>图像处理</a></td>
! \$ Q3 ]/ |; Q- R <td height=9 width="25%" class="css3"><a href="../../soft.htm" onMouseMove="showtip('网页特效<br>网页特效的大宝库，有详细的使用说明')" onMouseOut=hidetip()
# w3 M" H& q/ H w' g( g( X target=_blank>网页特效</a></td>
5 R( _2 E Y" V. `4 E8 G+ C </tr>
. a& m p; v6 _/ F: }4 Q/ e </tbody> 2 E) ~5 P6 q! o+ A( c8 }
</table> |
|
发表于 2008-1-21 20:52
|