|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之奇特的文字变化特效
脚本说明:
/ C4 p- F: k. J: \' G T 9 P* F- K3 l" j7 j! s
第一步:把如下代码加入<body>区域中% q' p5 }4 W% \& _% B% g1 X" B
<script language="JavaScript">
- I! i% h e* @% D. Z$ x$ R; d- l$ [( B( D% |4 `5 j: Q; W' m
function nextSize(i,incMethod,textLength)
+ J2 w+ x- A, O' {{
# |) X# n% Q3 F2 U/ Iif (incMethod == 1) return (72*Math.abs( Math.sin(i/(textLength/3.14))) );8 V, i9 \5 Z* G
if (incMethod == 2) return (255*Math.abs( Math.cos(i/(textLength/3.14))));
! y" q, q3 _5 Z$ u1 n+ f}+ J9 Y$ C# X+ N! A
1 g6 ~8 b6 S; {* i/ _" Sfunction sizeCycle(text,method,dis)
$ N* h! h1 ^* W3 L{3 \; u9 p0 J4 k8 ~* M; j* N
output = "";" s v9 L6 E* n. _* Z
for (i = 0; i < text.length; i++)' w8 ?9 s% J( P1 B
{5 Y* o5 m' b: u9 _) U- a
size = parseInt(nextSize(i +dis,method,text.length));0 I" g. o. x0 W, H, E
output += "<font style='font-size: "+ size +"pt'>" +text.substring(i,i+1)+ "</font>";
( o* }3 j9 w: ?( i3 M5 Q }
) J+ n8 p1 @' ?, K7 _. E/ t theDiv.innerHTML = output;$ t- a1 H% B& A8 @
}7 Z1 m' S, G4 q& R3 I" U: c
8 ]9 C3 [9 q {
function doWave(n) 4 |/ x4 F, x2 x6 J& m/ R
{ 3 V5 Y( O' p$ L* n
theText = "JavaScript";
% T: @" B) f& f6 x* w% F sizeCycle(theText,1,n);
0 s" r& n7 N+ x! C if (n > theText.length) {n=0}
; t: ]9 w1 s6 p: | setTimeout("doWave(" + (n+1) + ")", 50);8 y8 `/ n. d' W5 A4 {' [) [4 i
}
x- s- a1 [% `( d) N9 A</script>
* w4 ?) N; m5 x. u6 D. r) Y6 [7 [<div ID="theDiv" align="center">& L4 U d6 k1 I I) t9 r
1 u9 T. e# I' L: z m! @! }2 D
</div>4 q' x. o4 J3 j2 ]$ x) ~2 I
$ i# X7 M# r! S3 @9 h! V/ h8 Q ?% \. U: B' K& q( B' N
1 {0 G9 T$ @1 T/ f `/ `
9 ~ J9 i% F2 e第二步:把如下代码加入<body>区域中<body onload=doWave(0);> |
|
发表于 2008-1-21 20:50
|