|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之奇特的文字变化特效
脚本说明:
: s1 \" V, S1 a5 n. K 1 i7 u e' I5 k5 s
第一步:把如下代码加入<body>区域中9 i: t' s$ o& i
<script language="JavaScript"># r m4 E: K+ S3 s4 {
0 F6 X% Q5 D5 S1 Y. d6 [" d" c/ y
function nextSize(i,incMethod,textLength)
- g6 h' _0 f/ B: X4 ^{
& T3 J2 C' ]: s* a& u: K0 P- V, pif (incMethod == 1) return (72*Math.abs( Math.sin(i/(textLength/3.14))) );$ I2 I) {& b4 T
if (incMethod == 2) return (255*Math.abs( Math.cos(i/(textLength/3.14))));
9 n" Y u0 q4 B2 n/ g% J8 W4 m}
' a: d- d8 f1 q( t
# K% s2 _) e" Q$ F+ F: Cfunction sizeCycle(text,method,dis)6 r0 U6 ]2 C3 p4 A, A" q
{
2 ^) P/ i) c' Z output = "";3 @8 K* k) N) [: g6 k! |6 U& V
for (i = 0; i < text.length; i++)
i& @5 b. O& e {
; S1 s6 v) F/ C7 l* x8 U0 w# } size = parseInt(nextSize(i +dis,method,text.length));
, \# V' b9 `) M5 W9 v output += "<font style='font-size: "+ size +"pt'>" +text.substring(i,i+1)+ "</font>";
/ q/ J- \- D2 r3 \7 ]+ l1 C }
( ]; V) C" T: F- v L- T9 c theDiv.innerHTML = output;' y0 p! d% Y5 E) h) {$ R2 O$ |& D( }
}
x& V2 l0 F( ^. U
( C1 `7 E8 L8 G* xfunction doWave(n)
% I1 t! q. |1 V. J5 w5 ?; L{
- o5 l# d. d, \* U3 x! F& P2 Q theText = "JavaScript";% X* F: k0 p) l6 W
sizeCycle(theText,1,n);9 q5 e2 w; N5 m7 v$ G* Q0 w
if (n > theText.length) {n=0}4 C: I2 J$ E t' [
setTimeout("doWave(" + (n+1) + ")", 50);
" G7 V7 T$ ?' X% r" G5 T}7 E S! {+ m! n
</script>
6 Q+ K, O# I0 t+ e( m. \$ O8 u<div ID="theDiv" align="center">
$ R9 \: ^; e/ Z( u8 x
0 u O4 y& B5 G9 c u2 }</div>
1 s8 I) f+ r; w& J+ ~7 i! q+ ^0 H1 G) c! ~
) U4 j+ W( h# y1 l; {- \5 ]
7 L* I1 b. I0 `$ y) |
% w) P; D+ h6 U6 s' H7 \
第二步:把如下代码加入<body>区域中<body onload=doWave(0);> |
|
发表于 2008-1-21 20:50
|