|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之奇特的文字变化特效
脚本说明:
+ r# O5 T0 t) y/ A( q8 y
" W3 V" w+ N! M4 N2 m9 U第一步:把如下代码加入<body>区域中
2 `" Y5 e) Q/ \6 i9 o& J <script language="JavaScript">
& k( }' }9 [; c+ Q K7 Q7 Y8 c9 }& m: f( w2 I8 ?2 X( P$ a
function nextSize(i,incMethod,textLength)9 [9 o1 ^. }, X; a ^. E
{
+ E P1 u+ O: P. r$ |1 oif (incMethod == 1) return (72*Math.abs( Math.sin(i/(textLength/3.14))) );5 o7 u1 o0 h; O
if (incMethod == 2) return (255*Math.abs( Math.cos(i/(textLength/3.14))));( s: f! o4 x5 R* K; T v' y) `
}
- q5 J; Q8 A8 c- _7 r& J7 q. g, T* W3 X2 o% h5 L2 \ Z% g
function sizeCycle(text,method,dis)) q z. }7 h& P* s4 z& b1 N
{' }3 \! f( b6 u% k5 g
output = "";5 A4 d4 A5 @% u9 b9 x
for (i = 0; i < text.length; i++)5 g4 x8 f* `* V& ?3 M5 E
{" `. N$ M1 o' s
size = parseInt(nextSize(i +dis,method,text.length));! x, p( O4 x1 Q
output += "<font style='font-size: "+ size +"pt'>" +text.substring(i,i+1)+ "</font>";
4 Q2 D% d4 w0 Y/ E7 r0 @# z: n$ u }# P* k+ d& }7 y! \4 r2 x
theDiv.innerHTML = output;
3 }1 ?5 y( n, e}
: h$ S1 @: s9 C- n$ m
1 Y, s" c# s( M# R. ~9 jfunction doWave(n) 8 q: W+ N0 {9 i8 m8 b
{ * A* m6 C* x4 `1 ]9 b
theText = "JavaScript";
: s' }* K! B) P sizeCycle(theText,1,n);
. S0 f$ e; L3 a y$ M if (n > theText.length) {n=0}" ?& _' L- A) m4 |( U
setTimeout("doWave(" + (n+1) + ")", 50);) c" Q/ K% `' }# [) \, ~: h
}; L- o$ I8 D/ T, l: J: N
</script>3 j: X6 ^3 J1 s. g
<div ID="theDiv" align="center">
6 Y2 o; P/ r5 |) i* O
$ x9 v$ P- n( D2 ]</div>6 V7 E( B5 f& \% O4 T3 L! |3 s
( ~' [3 D3 b4 `# F9 h! ^0 D! y( x) C y' n
; t1 x) Z6 t* a& ^1 ?& M # P/ z7 O( r0 ?: q4 c. G8 S) @
第二步:把如下代码加入<body>区域中<body onload=doWave(0);> |
|
发表于 2008-1-21 20:50
|