|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之奇特的文字变化特效
脚本说明: - ~5 M; T7 k) m+ [
3 X$ e% X, L" d" [
第一步:把如下代码加入<body>区域中+ @: j: w' H/ H+ q
<script language="JavaScript">
8 ~5 e" B/ C' y; J. _; p- N8 |3 y
function nextSize(i,incMethod,textLength)' ~& _; L$ t1 S/ v
{$ i4 ]4 U5 p; g! O) s
if (incMethod == 1) return (72*Math.abs( Math.sin(i/(textLength/3.14))) );$ G, Z [$ v# f7 B" Y3 t
if (incMethod == 2) return (255*Math.abs( Math.cos(i/(textLength/3.14))));" d2 q, Y* \8 p' N
}$ _& o: _7 |$ g) B; c
# I8 Q) b5 I8 dfunction sizeCycle(text,method,dis)
5 A' _( T6 G4 g% A0 o/ ]& C0 H{
2 }& C. |+ z, W& F& L" _ output = "";
8 p$ |0 w: q8 \5 u6 C for (i = 0; i < text.length; i++)
: {/ o; A" r* b$ v# L: ^# b5 p. P e {
" ]0 S7 N1 {1 V+ f1 E/ P/ U size = parseInt(nextSize(i +dis,method,text.length));
, k5 Q8 ?2 ?, A% I) W2 j: d output += "<font style='font-size: "+ size +"pt'>" +text.substring(i,i+1)+ "</font>";2 K0 @/ B, q( E+ l) `" e
}
I" J# h+ m3 E5 E* ]% I0 a o theDiv.innerHTML = output;
" c! B6 a5 Q6 b; `}7 a5 x; E+ y1 J7 M- r7 i) T& j$ W
' R, o, W- w" {/ v) t! f& b
function doWave(n)
4 s2 P; p3 ?- Q( Z: K3 h{
. e" _1 o0 g- ?% {* K0 ] theText = "JavaScript";
6 M; ?6 o1 d: J. M8 G sizeCycle(theText,1,n);" l M" ^; Z0 N0 [2 G; ~! p
if (n > theText.length) {n=0}
- S+ \% j! W! q7 E2 V setTimeout("doWave(" + (n+1) + ")", 50);% h% U+ y* L. c' F
}. _/ ^' _# `; L& T& w
</script>4 t0 a" u. t1 h9 C7 Q7 V G
<div ID="theDiv" align="center">0 T7 D; D, G2 U9 D
) r8 m5 p5 p5 _; [) V' D2 B& k8 v+ d
</div>- Q+ Q' S' \' C# r0 Z. A* R" T- O
" q Q" R/ ?* r( _' {0 G
. O. v5 ?, q" c+ N/ o& K* i6 q( r# I( L7 [: V! T }
+ r' d h7 f! ?. y& p7 d- o& T第二步:把如下代码加入<body>区域中<body onload=doWave(0);> |
|
发表于 2008-1-21 20:50
|