|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之奇特的文字变化特效
脚本说明:
+ k, i m* F" j1 C; x# @
* }- H0 X) i# J第一步:把如下代码加入<body>区域中
" K8 ]- C2 F2 Z' S |7 F0 a <script language="JavaScript">
! d3 k1 e/ u n8 L T0 c/ Q7 Q& C4 V( j8 ?; }- o" ^$ Z1 J
function nextSize(i,incMethod,textLength)
# l* e" o/ w2 y' e. @1 E- X- A6 _{
% W1 A4 R, t: q; @if (incMethod == 1) return (72*Math.abs( Math.sin(i/(textLength/3.14))) );+ c" N* B# M, f* ^) O: \0 m" D% p
if (incMethod == 2) return (255*Math.abs( Math.cos(i/(textLength/3.14))));
/ i9 g& P8 ]6 Z5 _* c}
* x- n! T! x' }3 }( s9 I9 b
3 {5 t4 ^* ?$ R! {2 mfunction sizeCycle(text,method,dis)
! h) f y) @& p ]" R3 m' c{
; i! W4 d' n `# r# m3 }, x9 G output = "";- h. L( @: ~/ k; Q
for (i = 0; i < text.length; i++) X" f' g0 o1 w) ]
{0 P1 {9 \& C7 A8 e% C
size = parseInt(nextSize(i +dis,method,text.length));( X. R, c# U3 l; W8 F" @- ^
output += "<font style='font-size: "+ size +"pt'>" +text.substring(i,i+1)+ "</font>";1 o: W0 Q/ h# s4 V) o9 q, |+ A
}
: `6 X4 G' Y! D2 F4 Z' ?3 X* o theDiv.innerHTML = output;
; _7 ~ u D c1 h" X) x7 R}
1 ]2 j. v2 @7 M: Q
3 O6 A1 L6 u) y) d. N& lfunction doWave(n) ( F- R4 ]% l& v- ]
{
3 [9 S8 r8 |* y+ f theText = "JavaScript";
7 X5 I; _5 s+ {- G) ?! V; ~ sizeCycle(theText,1,n);
) o4 |' Y. r" d* R2 J" n- } if (n > theText.length) {n=0}
: O7 ~3 f& g8 _9 c4 p setTimeout("doWave(" + (n+1) + ")", 50);/ L/ U4 ?% t% P, `7 q- Z6 x
}
* n& V7 s x2 E9 a3 d</script>; J7 c' @$ Q3 D; A
<div ID="theDiv" align="center">
9 |1 a" U. h0 J- p1 |
) F! ?( Y. [! F; k5 o+ M</div>) V5 c0 _% o! @5 |5 o9 c4 s p
3 [! U4 Q" e" m8 f2 U! M' D- h4 @8 _2 w
0 K2 M, K( M: H) k% S9 Q8 {
0 e" f/ X2 Z. `% Y
第二步:把如下代码加入<body>区域中<body onload=doWave(0);> |
|
发表于 2008-1-21 20:50
|