|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之奇特的文字变化特效
脚本说明: & W' \/ a4 I1 w: {# ~* K x, h
7 P* P6 f/ h j& \
第一步:把如下代码加入<body>区域中
4 R$ n0 X, E$ t3 ~- N; f <script language="JavaScript">' P. O2 p0 I+ q J
$ D$ }* A* K# o. Y+ l
function nextSize(i,incMethod,textLength)
% ]% u: W6 v# I5 S% o{8 U" N) _) s3 B7 u: ~
if (incMethod == 1) return (72*Math.abs( Math.sin(i/(textLength/3.14))) );7 v$ w% P( v/ @# _
if (incMethod == 2) return (255*Math.abs( Math.cos(i/(textLength/3.14))));
9 M6 K# a! l a# ]0 w5 N9 {& j9 Q}
/ q- Y- N; N6 X0 J" [
' I. j) h8 j: P) h& L6 `5 Afunction sizeCycle(text,method,dis)
! E7 A$ _- W7 E8 O' }{ [ f/ G( y1 V, V" j/ N* ^0 o
output = "";
8 ?, r" ?+ r+ ]! g* m for (i = 0; i < text.length; i++)3 R8 y8 \# G' a- z7 u
{) s) Z& }) w2 K! w
size = parseInt(nextSize(i +dis,method,text.length));
' U1 j5 I: u Q4 T; f2 e output += "<font style='font-size: "+ size +"pt'>" +text.substring(i,i+1)+ "</font>";; _ ^! W) r0 z
}0 [4 |' J- W; k# S$ m5 `9 X. }
theDiv.innerHTML = output;
" T/ A3 c9 M* D! u# D( g% k5 b}
$ D7 @! \/ n( W0 P6 J
8 {1 D( U1 b# z# T" j9 f zfunction doWave(n) 5 ]8 X" R, w! L- F
{ 3 K0 C. p) _8 o6 @" b
theText = "JavaScript";
0 y3 A- m: J3 c3 \2 D7 F' h sizeCycle(theText,1,n);
. _$ z" U. _, H7 ~, L if (n > theText.length) {n=0}
5 ^7 Z% W1 z) s setTimeout("doWave(" + (n+1) + ")", 50);
8 p. l8 \2 N% G3 ?8 @}
& V, E5 c! ~& `</script>6 B. q* h1 w1 x
<div ID="theDiv" align="center">
; m3 L7 H& A. W5 N' ^3 a, ?8 g: f8 M. ]/ t' a" H+ f
</div>
: B3 y5 K$ O' O5 P9 R/ ~" i
" y7 J+ Q4 M; l; T$ U
6 F0 |% w4 K- N& O2 x8 S1 O6 l& t
k3 H6 W8 b! f- t! q第二步:把如下代码加入<body>区域中<body onload=doWave(0);> |
|
发表于 2008-1-21 20:50
|