|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之奇特的文字变化特效
脚本说明:
& R" [9 _/ t! p2 W 8 p5 `$ d2 N# o+ C2 ^
第一步:把如下代码加入<body>区域中5 @* l9 K: i0 o; g
<script language="JavaScript">
0 y! d( o/ A* _* e8 U$ r2 t9 \; l) S% B! T
function nextSize(i,incMethod,textLength)
. {( f A& j% I{
, S7 X7 b: \; H/ S1 bif (incMethod == 1) return (72*Math.abs( Math.sin(i/(textLength/3.14))) );
7 R2 d- e( v/ Zif (incMethod == 2) return (255*Math.abs( Math.cos(i/(textLength/3.14))));) s% e: x$ W' i
}
' F1 b0 l! O9 l3 M0 O. Q3 ]3 a+ y, K3 q/ X' m3 z
function sizeCycle(text,method,dis)) ?% i7 p; m6 d" O5 O
{2 L9 P/ t; n, a
output = "";
) P- h( r h* F9 l! {. e- G* B for (i = 0; i < text.length; i++)2 q1 l% B R4 o" g: b' u5 h
{6 C$ x) @3 C. u% M1 K
size = parseInt(nextSize(i +dis,method,text.length));
( D7 R# _" r B V$ O- \0 J output += "<font style='font-size: "+ size +"pt'>" +text.substring(i,i+1)+ "</font>";8 c* i- i6 i' R% d/ h4 E: H
}
$ {2 f% e; F- p" [ theDiv.innerHTML = output;. I* W, e! f+ L" g& i) [+ y: U
}
% H5 o: |/ m/ V1 y+ A; @! Z+ N; P* o6 n! K2 x c5 B H8 X# L* t
function doWave(n)
% u$ g5 h, f& u" [: f) @0 K2 o{ % ]; H& w8 M" k8 Q7 M+ r5 a; H; J2 H
theText = "JavaScript";: f+ w- m3 m9 U) H; @/ S4 k! k' u+ K6 b* i
sizeCycle(theText,1,n);
% O9 _* y0 U3 Q) D y if (n > theText.length) {n=0}
- r# H3 {, q5 u |. _, N setTimeout("doWave(" + (n+1) + ")", 50);0 |, G' ^ ^' g: X
}2 f; d1 N7 p- G0 @# G0 r& j6 ^! ?
</script> y% g6 ^( N4 O9 ~
<div ID="theDiv" align="center">
, g, c3 {& P+ |3 V
2 u0 [ J' [! `</div>
+ {. V! q% e; M$ L' @0 W7 l4 j# a" J' ]
4 l9 X/ k7 S5 _) ^, G2 C$ Z9 x. N1 b! f1 g$ P% l
/ a5 f; F' Q- d s: Y第二步:把如下代码加入<body>区域中<body onload=doWave(0);> |
|
发表于 2008-1-21 20:50
|