|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之奇特的文字变化特效
脚本说明: 3 ]( @. o! ]- f9 |: `
, W0 R0 D4 C7 q: _. [9 d) o
第一步:把如下代码加入<body>区域中
0 i" Q) c' M, V! ~ ~ <script language="JavaScript">6 j- o3 P( l8 J' b
% A4 F5 X/ S0 D: ^
function nextSize(i,incMethod,textLength)" r; t8 E( h* L& K8 d7 T4 V
{: Y1 j, ?$ a- T G+ r0 h
if (incMethod == 1) return (72*Math.abs( Math.sin(i/(textLength/3.14))) );( \* l9 A5 d- S) m" p3 C- p
if (incMethod == 2) return (255*Math.abs( Math.cos(i/(textLength/3.14))));
$ M) }; K. X! T! f; e}
' u# G* H9 t6 B. U3 H$ s h# @9 v) V
function sizeCycle(text,method,dis)" W5 z' C+ r6 _0 l5 C8 |$ I
{* Z( o1 ~& |8 T; i
output = "";7 y5 H" O* X. c7 @* i
for (i = 0; i < text.length; i++)* Y6 |9 z7 S' m2 X, d5 P
{! r+ l5 k/ B, j; _; }; `! ]6 V
size = parseInt(nextSize(i +dis,method,text.length));0 Z$ n/ Y! L. n$ T0 ]1 ]
output += "<font style='font-size: "+ size +"pt'>" +text.substring(i,i+1)+ "</font>";6 m* t+ `! C3 h/ u7 D
}
$ }+ J2 C. r7 W) S7 o theDiv.innerHTML = output;
; a, @! R ^( ]}! f% p* T X% N. W3 [( U
# i6 ~2 {& |. Q, }4 v+ ]
function doWave(n)
* q# N/ ?& Y1 \{ 7 l+ y- {0 J/ p: O
theText = "JavaScript";
) \; _4 n1 z( ?( w: i/ i8 x, } sizeCycle(theText,1,n);7 d& ]+ F1 r v) U( X2 B
if (n > theText.length) {n=0}
- N$ y0 H5 d( G! W2 ]) G2 P+ D- G setTimeout("doWave(" + (n+1) + ")", 50);
; ? N! z/ ]! h; J; c}" ^( V' n: F* L' F4 u* W; {& {
</script>% A/ r: w9 F# g2 E" ~, c
<div ID="theDiv" align="center">! H; |; V- M! w3 {9 M$ L. {# ]* [
5 D1 G% y7 ~6 F, s7 B* P
</div>/ g& F' |1 h6 s3 [6 U5 b5 \
1 R: e7 w3 y; i! D" E5 j
# I0 r( N! W0 o& u
4 c- M: x, L/ t) ~: L
* N0 L# x) @0 y* D+ V% T
第二步:把如下代码加入<body>区域中<body onload=doWave(0);> |
|
发表于 2008-1-21 20:50
|