|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之奇特的文字变化特效
脚本说明:
! Y7 @9 Z/ Y. ?* c! v8 [. V/ T " R o# [1 T7 s7 k; ?
第一步:把如下代码加入<body>区域中
' }4 k6 w$ b8 `! }* }3 n! n <script language="JavaScript">
- a [4 A q- l( V: o, W; O; ^
# d; s& H5 d; r% [ u% Cfunction nextSize(i,incMethod,textLength) [( o) S6 ^8 a6 M. x6 v7 \
{
$ S- V5 L1 ^7 J4 u$ lif (incMethod == 1) return (72*Math.abs( Math.sin(i/(textLength/3.14))) );
, K$ {8 M8 k& s0 f* E- F+ P: q- Lif (incMethod == 2) return (255*Math.abs( Math.cos(i/(textLength/3.14))));
9 ?8 ^, T* M( u}5 a6 v3 D8 x! U# y* J4 O
: }7 o3 R ~9 R3 x7 C8 D: L9 cfunction sizeCycle(text,method,dis)
$ F& O e: @* y$ u2 J6 i7 m; W{
0 r4 G8 h* z7 u6 q7 y output = ""; d. b2 G4 p) Q+ ]$ n
for (i = 0; i < text.length; i++)
2 p y8 u _5 L! d0 {1 s2 @ {% y- A8 [. r1 h/ j, q& [) J& c6 E6 Y
size = parseInt(nextSize(i +dis,method,text.length));
, l: ^4 K. d, A; O output += "<font style='font-size: "+ size +"pt'>" +text.substring(i,i+1)+ "</font>";9 B r& l3 }0 i! \5 c) d6 ~4 G
}
+ F0 I! N. x% N* U4 k theDiv.innerHTML = output;/ J' ?( @- C: Z, n# z3 }5 L6 y
} f0 E- ~; ^6 J
) P8 {6 t- Z N8 O' W/ w) }9 Ifunction doWave(n)
$ q- o% V# [* K) m6 g& ]! h{
% t4 P$ F4 y5 u3 U$ Z8 G7 ? theText = "JavaScript";, W) b! [; T: }) O" _/ e
sizeCycle(theText,1,n);! E9 m. `1 Y) l' j2 C
if (n > theText.length) {n=0}6 c. G4 f9 w0 H3 F2 f4 L
setTimeout("doWave(" + (n+1) + ")", 50);6 M7 e. w/ l2 d j T
}
0 U7 c4 P# _( E0 x4 }1 H</script>3 [* r- g" ?/ R1 O
<div ID="theDiv" align="center">
2 t& M" m- x1 G( F# H
& R. Z: x. I. m, m) W; R</div>6 D1 }0 }- y+ Y% b) [- t
2 s! Q& h7 p4 X
C; r' ~) d" V6 q z
+ a. }% e, u2 G3 A. u# K 0 M9 v0 h/ `3 b
第二步:把如下代码加入<body>区域中<body onload=doWave(0);> |
|
发表于 2008-1-21 20:50
|