|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之奇特的文字变化特效
脚本说明:
K3 D- _8 K# s' j) @# |* O2 D 5 M0 s" R4 d) ~* z! ]
第一步:把如下代码加入<body>区域中- z' R' Y8 {; [9 X! f5 p2 z4 V
<script language="JavaScript">$ S) Z: a$ A8 Q9 M6 `: m
& F4 y- @* B4 z9 y3 x, u# Afunction nextSize(i,incMethod,textLength) [; l ] p9 ^! k: d" m+ ]
{
J4 ~2 w' m7 @) n& F6 kif (incMethod == 1) return (72*Math.abs( Math.sin(i/(textLength/3.14))) );
3 _& a8 x+ b; m5 S% eif (incMethod == 2) return (255*Math.abs( Math.cos(i/(textLength/3.14))));
2 t/ ?! J/ J- X3 C; L2 g}( k8 ]$ q) {6 W4 t/ ^
% L) z# C2 `& K* O; U
function sizeCycle(text,method,dis)" j( S& s3 t; N! J# E1 C" S+ |- o( l
{
* S9 N4 ]8 V" ^ output = "";' k, x2 R9 Q2 x
for (i = 0; i < text.length; i++)
+ d3 y9 ~/ c" M# X* m. } {& [5 J9 L& \3 I" e% A* c4 F
size = parseInt(nextSize(i +dis,method,text.length));7 ~. D- f; P( A" W9 J1 i% @
output += "<font style='font-size: "+ size +"pt'>" +text.substring(i,i+1)+ "</font>";
9 |% `# ^' d1 X" Y+ ^ }
4 ?$ ?- Q4 w; H2 Z, r' x theDiv.innerHTML = output; l% [0 D6 I& M# ~7 f* B$ n$ Y
}
# z- S8 Q- }0 F$ D3 r/ h' J0 z* K# W
function doWave(n) . C$ _; ?: c) S( `3 e& R
{ : o( R" ?, c8 N w7 y, V; S/ b
theText = "JavaScript";; }+ {5 ]' g: k: E- J7 c9 n
sizeCycle(theText,1,n);
' O# Z5 a4 [4 Z if (n > theText.length) {n=0}
( r) x7 ?$ u2 ^" D setTimeout("doWave(" + (n+1) + ")", 50);8 M0 c3 s% Z3 Q3 N* D j- |9 v! K: Q. x
}7 i7 T3 M. E6 m5 q
</script>
, E# } s, ?$ K) e3 \<div ID="theDiv" align="center">
, ^. e: G% {; x7 I9 d0 b- i/ x$ U" f% z" ]4 e
</div>
+ `$ k* K0 l& f4 w% c: Q7 L2 Z/ \4 l# H
% b+ q( f" z3 j
6 m) h9 |7 E6 A9 P/ ~ 0 l% G) J+ F$ K# r
第二步:把如下代码加入<body>区域中<body onload=doWave(0);> |
|
发表于 2008-1-21 20:50
|