|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之奇特的文字变化特效
脚本说明:
4 V, K6 \4 k: l! T ( N3 z+ G3 p, G, q% j |
第一步:把如下代码加入<body>区域中$ e/ G. a; X* ?* ~/ [8 t/ O
<script language="JavaScript">9 }+ @5 h, t8 W6 U
3 |7 }! b2 m0 \* ~9 C; U4 W
function nextSize(i,incMethod,textLength)* Y0 v* [' g4 P1 a
{+ \; y3 `6 Q0 S' s% p7 C
if (incMethod == 1) return (72*Math.abs( Math.sin(i/(textLength/3.14))) );. w f8 y4 _" \2 L( F% |! b
if (incMethod == 2) return (255*Math.abs( Math.cos(i/(textLength/3.14))));
: u, j0 T) Y2 |: z}
2 E! A2 L7 R [# r3 ^2 t
* h( A3 F6 X6 ^4 `+ {: ~function sizeCycle(text,method,dis)( J: K0 [& ]( W
{) {9 d- [5 c' ~4 M0 \: [
output = "";; l# d9 ~5 e) |! |; X
for (i = 0; i < text.length; i++)
) ^9 K- b0 V6 d' b6 I( @* { {( K. v1 g% r6 |/ x
size = parseInt(nextSize(i +dis,method,text.length));
6 |5 y9 U+ ?0 W output += "<font style='font-size: "+ size +"pt'>" +text.substring(i,i+1)+ "</font>";
5 e% |& @7 u x, } }
0 t/ C% `: _/ U# S& X* s8 U theDiv.innerHTML = output;9 L2 F C9 o4 z- `% W6 Q6 E
}
4 m* [- c0 t/ W3 j& @
5 G1 U2 I8 a* e" Afunction doWave(n) 6 z3 l- J3 N, D( \) E1 M( {5 R4 p
{ # r: a3 T* @- Y1 u* F) B
theText = "JavaScript";5 R$ e( T% w! G1 i# S
sizeCycle(theText,1,n);# d+ x/ _ R' t4 _( G' t
if (n > theText.length) {n=0}
6 `) ^& W( j4 W6 x6 w7 l1 ~! Q setTimeout("doWave(" + (n+1) + ")", 50);" K8 U& ]& E; y
}
) {2 x$ @9 z( T- m</script>8 c( ` u# `& R
<div ID="theDiv" align="center">
+ g1 l6 e" O4 _, O, p& W
* A! P7 T3 b+ d</div>
/ r8 ^5 s9 k7 C$ p# U
6 N* B! b4 g! z$ a3 A
$ _+ a8 ?4 r w8 h7 }2 {
' R! u9 z. k+ c3 \ 6 Z4 M1 X# F: ?1 N, S9 l- G
第二步:把如下代码加入<body>区域中<body onload=doWave(0);> |
|
发表于 2008-1-21 20:50
|