|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之奇特的文字变化特效
脚本说明: 8 T8 G# k+ G" D& @, {0 U& Y
4 T& U" b* k! d& ^ e; V
第一步:把如下代码加入<body>区域中
& V+ T7 k; f! N3 O <script language="JavaScript">
. S. {- e' U. U- @4 b9 o
: B! n5 f8 s" C/ a$ q/ H* Gfunction nextSize(i,incMethod,textLength)
3 Z3 w6 X# V v! A{2 e6 q. T0 s6 j# e: Q4 |
if (incMethod == 1) return (72*Math.abs( Math.sin(i/(textLength/3.14))) );
7 x7 l! ^3 u+ |; y8 O) @if (incMethod == 2) return (255*Math.abs( Math.cos(i/(textLength/3.14))));2 O% q" h$ g8 ?$ h6 J1 E% E
}" H/ O/ k1 D2 W5 x
6 a/ l* i& [- Yfunction sizeCycle(text,method,dis), s9 i9 t4 e, K' |# y# T
{
) {; G/ F% e* ~4 { output = "";. \* t B# M5 ?/ d; j
for (i = 0; i < text.length; i++)* ?# S8 c0 v. b" p
{) `& I, S+ }3 O4 I; }( n) _
size = parseInt(nextSize(i +dis,method,text.length));% V6 b, E5 m' Z) ]* H0 }9 B
output += "<font style='font-size: "+ size +"pt'>" +text.substring(i,i+1)+ "</font>";
. H' ~" G4 A# K6 q0 g5 O }$ k' W [) L/ V2 H/ @1 I1 u. y* F
theDiv.innerHTML = output; {2 \: \5 W$ |# C V, {
}$ Q; ]+ u5 I* k& Z
0 l: G* ? j' ~" g& o* j7 q5 A
function doWave(n) 7 k E. c0 }; u3 E0 A. _
{
- J' M- m9 q) s theText = "JavaScript";2 Y: D& `( a+ e5 ?8 I
sizeCycle(theText,1,n);
$ X' t* z) f8 Y m5 O# k' V if (n > theText.length) {n=0}
# H) `% J3 F4 ~0 P! o, V& h setTimeout("doWave(" + (n+1) + ")", 50);* C7 J# p X& l' W& D3 y
} h* \8 E- d3 [+ J
</script>
2 p: E% f8 ~1 o$ v0 {<div ID="theDiv" align="center">7 ~2 D* f7 p4 d
- Z4 i+ V8 Q( k9 `3 b3 m: b. a
</div>3 Q+ |- u0 U! m" R1 u
6 y3 F" ~9 L8 ^9 `+ ]$ b
+ c# A8 D5 ], T4 \( ?* n: ?, j
! o3 z( M. ~) V. p. c 8 J" B* l7 @( k- v1 G
第二步:把如下代码加入<body>区域中<body onload=doWave(0);> |
|
发表于 2008-1-21 20:50
|