|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之奇特的文字变化特效
脚本说明:
' H+ @, W1 l1 D' B, q4 t+ Q
/ C8 y x) {5 W! a5 O: O" k _第一步:把如下代码加入<body>区域中
) j j# v; q* M4 N <script language="JavaScript">2 M, M9 {# g. {& i& e) t4 A
( `( c* G" b: X
function nextSize(i,incMethod,textLength)
2 F5 s/ f0 J9 w s3 ~' e2 t# Y9 e, z{) ^, d6 f: `2 Z% u% ?# S% Y- P& J2 _' E9 C
if (incMethod == 1) return (72*Math.abs( Math.sin(i/(textLength/3.14))) );0 X8 P1 C- S: V) `: [ r
if (incMethod == 2) return (255*Math.abs( Math.cos(i/(textLength/3.14))));
# K c1 \8 p1 C% ~& f- K$ E: h9 R. f}
, T& S; Q0 m" B% g) N' j0 n8 g
& O1 G0 L: w' W3 Bfunction sizeCycle(text,method,dis)8 g3 W; ?6 O6 X! U
{! A x$ j4 r0 T1 g- u1 c! ~
output = "";
2 z9 _/ {) l' a, ?" ] for (i = 0; i < text.length; i++)9 X C- b* R" `2 ~5 O4 W
{3 T: \( N" N, P& U
size = parseInt(nextSize(i +dis,method,text.length));
! q4 S2 Y1 D" `7 S3 F/ q output += "<font style='font-size: "+ size +"pt'>" +text.substring(i,i+1)+ "</font>";
9 ~( }: W. Y5 z- _5 k }; v. s8 L* N9 N
theDiv.innerHTML = output;% k# ]6 ^9 t2 O L1 ?
}
+ l7 E9 z+ X; e. y. Z. _+ N
, W$ Y" g$ D4 s9 ~# N& efunction doWave(n) ( |4 t5 r$ `$ P9 Y, W* h
{ 7 h& r0 H, H" `# x9 L3 K* r
theText = "JavaScript";
0 u2 h9 o4 f: j sizeCycle(theText,1,n);
6 e$ h# ]) X5 ?6 H$ y3 L/ F if (n > theText.length) {n=0}; \2 x F& x4 ?
setTimeout("doWave(" + (n+1) + ")", 50); b: h; N9 o0 ]- Y
}
2 f: u8 T- N: {8 }" L4 q2 I</script>+ T$ g9 W" M5 g. U* H8 o
<div ID="theDiv" align="center">
+ o: j! V2 X5 C$ D P
A6 Y" y- t% x) A% V</div>
3 _2 B3 Y8 G G7 z
6 E' }4 v0 ]3 ?6 ~7 c# k% a5 @" v5 F; S7 e
0 ~1 J1 F0 Z6 F: _( ?
7 b- A# r; u+ i/ J, j第二步:把如下代码加入<body>区域中<body onload=doWave(0);> |
|
发表于 2008-1-21 20:50
|