|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之带注释的表格菜单特效
一：将下面的代码放在<HEAD>与</HEAD>之间% r- m2 d. g+ D, ^: |
<SCRIPT language=javascript >5 R' s$ m2 @4 S2 g
document.write(. ?7 n# @0 V8 Q% K
"<div id=\"tooltip\" style=\"position:absolute;visibility:hidden; padding:3px;border:1px solid #528AC6;\) T# I# s8 O$ l, U+ }
;background-color:#ffdfd0; height: 19px; left: 77px; top: 96px\"></div>");
- s. o I) I* b6 W E; L; h. Y4 M5 h
function showtip(text) //显示链接的说明
' m. {9 [. b/ o m Y o6 Y0 ~: L6 C{
: D" S; ~# e- ?- O( Z8 Q `1 U if (document.all&&document.readyState=="complete") //针对IE. u# w9 _9 l. E+ R( Y {# `
{
( | Q8 \3 Y% E/ c
- j0 V; P8 x' c" [8 a. g document.all.tooltip.innerHTML="<div vAlign=center><font SIZE=2>"+text+"</font></div>";1 u- d* o2 ?" A5 d6 O; j
document.all.tooltip.style.pixelLeft=event.clientX+document.body.scrollLeft+10;
' z& V: u5 g4 G$ z; i& {1 Y6 e document.all.tooltip.style.pixelTop=event.clientY+document.body.scrollTop+10;0 Z. [4 |: g. c( ?/ G" W- V' ?
document.all.tooltip.style.visibility="visible";4 p% E* y! \- o1 A8 _0 @
}5 |; Q8 s A/ Y4 d: \, E4 c5 [/ g' r
}
* V; |0 _2 x: Y$ J9 F
/ d% I6 b: @, l5 @+ S k |function hidetip() * l, `8 S% y( H- f) {3 ?. j
{8 F% G+ _0 Z# V+ \1 V0 }
if (document.all) k+ ~2 _ F) F5 A, W5 k- K
document.all.tooltip.style.visibility="hidden";
9 d: l* A& W9 H( g4 t* V$ N3 z}
. J* y. |/ ~3 R @! _; R- D; K9 M9 F1 u
function setcolor(fntcolor,bgcolor)& o5 z `# k' t8 {' R/ e2 |
{
+ E' f0 m& x2 o% G: ?8 w document.all.tooltip.style.bgcolor=bgcolor;
# k! i: N P5 K) P document.all.tooltip.innerHTML.Color = fntcolor;
: ?. [3 e7 Z0 W h# L4 d. e}
! |3 z; D9 p+ ^: \/ d9 U D' q; _2 R7 G G+ v1 Y
function showhint(text)1 [" w7 z" r3 e( [/ u- ^
{
+ i* B1 Z" t% T9 U onmousemove=showtip(text);; {. X# P& {0 O* X
onmouseover=showtip(text);
7 q4 ^! K4 k' N4 E0 U onmouseout=hidetip();
" Y( G( ^. X) S* Q/ c) A, g( {3 r}1 i4 ]5 U/ ?3 B- V, @8 f
</SCRIPT>4 U9 e. V; c; w7 w% D o, c3 f
B" ? d( K4 o0 p5 }. [
5 C+ f# N7 o' G8 [' O! j) R
4 n" N, \8 e$ k/ v3 m2 g3 q; z2 h
& T) J. ?7 b. ?* @* Z) Y
" t. Y1 j% p5 X- T2 }/ W
4 }' w7 x- x3 j! x9 x( L ~) x* z
二：将下面的代码复制到〈BODY〉区3 r" |, ]) q% g+ D/ j
<table align=center border=1 bordercolordark=#ffffff bordercolorlight=#a8cbf1 8 P6 d( T5 S6 H0 d4 s1 e
cellspacing=0 class=t width="300" bordercolor="#6699CC" cellpadding="0">5 G5 S' t" L6 L- C1 g
<tbody> . F' N. ~. F+ p+ H4 q d1 G
<tr align="center" bgcolor="#ffdfd0">
8 ?& g: c3 n y <td height=9 width="25%" class="css3"><a href="../../sbtx.html" onMouseMove="showtip('赏心悦目<br>精美的图像和壁纸能使你得到一些放松！')" onMouseOut=hidetip()
6 c7 e) J" |% Y target=_blank>赏心悦目</a></td>
: j8 }% Z7 Y" D. J3 }% Q( u3 d <td height=9 width="25%" class="css3"><a href="../../flashmenu1.htm" onMouseMove="showtip('网页素材<br>大量的网页素材给你的网页制作提供方便！')" 1 ?# }* K9 U4 @8 _1 n7 H
onMouseOut=hidetip()>网页素材</a></td>
4 K& q8 N% E/ ]8 M <td height=9 width="25%" class="css3"><a href="../../wyjcs.html" onMouseMove="showtip('图像处理<br>图形软件的使用以及图像的特效制作')" onMouseOut=hidetip() 9 U5 L( P. i5 K0 x6 e, B* z Y
target=_blank>图像处理</a></td>
3 f( [4 {( t' x& z* @- P2 }6 b; c( R <td height=9 width="25%" class="css3"><a href="../../soft.htm" onMouseMove="showtip('网页特效<br>网页特效的大宝库，有详细的使用说明')" onMouseOut=hidetip() r9 Q0 P4 T7 R. L0 |$ ^8 W9 F
target=_blank>网页特效</a></td>
' O- u0 t- K+ X: ~8 ] </tr>
- m( t+ ]8 Z) F) r$ M, A </tbody> ; s$ N; ^ ]# W( D* Z
</table> |
|
发表于 2008-1-21 20:52
|