|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之奇特的文字变化特效
脚本说明: ! ], l% O, N! K6 D; J
& H) ~. S6 Q2 y7 j' R& R第一步:把如下代码加入<body>区域中
/ k! F0 K% @+ x <script language="JavaScript">& s% o ^7 q2 s( i" ?. ?+ D' X! J7 Q
+ f$ }9 v/ \1 c
function nextSize(i,incMethod,textLength)
/ J& P) c: z) X* R{
- R7 d/ H, f/ Q! J! J, lif (incMethod == 1) return (72*Math.abs( Math.sin(i/(textLength/3.14))) );
- j" k/ J7 Y: m" U! T( M% C tif (incMethod == 2) return (255*Math.abs( Math.cos(i/(textLength/3.14))));
5 @2 J: b7 k4 E}) G: e+ n( U$ c, M7 h0 p
$ d2 l/ U. }! ~
function sizeCycle(text,method,dis)( W# x; y {8 u- B/ k \( u
{/ K( d! z5 z L: Y- n: I
output = "";2 E d$ L$ ]8 Q0 ?, Y& j5 Y
for (i = 0; i < text.length; i++)/ ~# r S; k( V: a1 }+ E
{6 d8 w7 n" G$ }- z. @
size = parseInt(nextSize(i +dis,method,text.length));3 ]0 g# X/ f; y5 h+ d% J- S
output += "<font style='font-size: "+ size +"pt'>" +text.substring(i,i+1)+ "</font>";
, V5 S' d$ m# X }
5 G8 |& {' R+ q( _3 E; } x theDiv.innerHTML = output;7 u9 k8 R+ ]) u3 c: L
}
6 k! k, o! W- c5 Z+ c9 S& }
( I. k& A7 {0 N4 P. B# F' w6 rfunction doWave(n)
" v6 L9 G% h: `% u4 U2 B1 ]2 B8 } G{ / z9 c% C& H4 y
theText = "JavaScript";
' m$ f. j# T$ a% g sizeCycle(theText,1,n);' d! x6 ]) k9 h, o
if (n > theText.length) {n=0}
/ g d& e v8 m! G1 I# S: q setTimeout("doWave(" + (n+1) + ")", 50);( ]# F N& Y& ]% Y4 V; u
}
* s) t0 x7 R. i</script>
, y% l' x5 P2 v1 M<div ID="theDiv" align="center">3 P! x) K D* Z2 k: }8 {
e- U* } K3 j6 I2 m% p w- ^2 F
</div>1 j5 U2 m# v8 ?
. r: O/ J9 c* R- N: @) @
9 F0 ~% H$ t% v% S$ g, T
5 ]. Q/ n. u. n: Q 8 | k& I6 ~+ K- M$ t9 [! K" I
第二步:把如下代码加入<body>区域中<body onload=doWave(0);> |
|
发表于 2008-1-21 20:50
|