标题:
网页之奇特的文字变化特效
[打印本页]
作者:
zw2004
时间:
2008-1-21 20:50
标题:
网页之奇特的文字变化特效
脚本说明:
( Z. f/ D% M2 ~, V
) O2 @6 i2 e. a5 _5 |; X
第一步:把如下代码加入<body>区域中
3 }& ` M. I0 }! V; k9 D0 g
<script language="JavaScript">
$ H. K2 D. b! u6 Q' Z+ l U
# C( q% q8 Z, D: r% @; M( L1 @
function nextSize(i,incMethod,textLength)
$ m! H, _9 x# t
{
3 \& Z" V9 e" S' V
if (incMethod == 1) return (72*Math.abs( Math.sin(i/(textLength/3.14))) );
6 C5 L# C- t/ i. ?0 t' K" O& f
if (incMethod == 2) return (255*Math.abs( Math.cos(i/(textLength/3.14))));
0 e- ~9 e' G' Z4 ]* G2 o
}
2 p1 @6 D6 M; i' a$ u8 z
1 e! C5 x& @+ l; _2 E" ]
function sizeCycle(text,method,dis)
$ Y# N' k& c! j a* Z, N0 m* x4 V
{
1 u* C0 U2 j( I" t
output = "";
: }5 j, \. B2 J. F# R
for (i = 0; i < text.length; i++)
: ], T) d# O( {: D, C
{
3 A/ ]: _) C: m, x
size = parseInt(nextSize(i +dis,method,text.length));
6 ^/ ]' ~' h% j9 J- s/ E3 O" i! B
output += "<font style='font-size: "+ size +"pt'>" +text.substring(i,i+1)+ "</font>";
2 V+ l: ~& n; V0 r( C4 I
}
0 s4 x/ m( ^8 p- B2 E1 Z* C- r$ Z7 ]
theDiv.innerHTML = output;
. t/ g) ]( o( } R
}
6 p7 r2 `$ ?) X, ~' w7 n7 h3 A. L
8 P) z6 y. @. p7 ]! K- _/ d
function doWave(n)
2 U3 a- u9 a2 R4 {* u" T/ l0 |
{
3 l9 K) y& D: _5 C
theText = "JavaScript";
# U) P8 {* h( f! {4 P+ B
sizeCycle(theText,1,n);
* F. ]* z. M; M6 p4 _/ t# c- L
if (n > theText.length) {n=0}
3 c A4 c% ~5 S* g& n& t
setTimeout("doWave(" + (n+1) + ")", 50);
: p5 s& k6 m* y. f2 ?
}
1 S3 W6 D, m7 l L8 f' o8 [) p
</script>
$ p. C* X0 b8 e: [0 `
<div ID="theDiv" align="center">
2 W: H$ z+ ]! M0 Q L) Z. E) F9 x
, o: S8 ~" @: k( x
</div>
5 M: g, m* L$ M% W3 k$ @9 ~! l
1 _4 K' \* { n$ T
( V W, k) [8 R
' _, O8 A9 b; M* B d4 v- y# _7 Z
& {; D- Y% I) f" v
第二步:把如下代码加入<body>区域中<body onload=doWave(0);>
欢迎光临 捌玖网络工作室 (http://www.89w.org/)
Powered by Discuz! 7.2
