|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之奇特的文字变化特效
脚本说明:
$ R( p/ u* e0 S. K9 N 7 Z+ i, y8 e4 G2 _
第一步:把如下代码加入<body>区域中
M& p+ b$ L+ q* x' B# ~ <script language="JavaScript">
, b6 {) R& }* U4 L- ], p
+ e6 p) T* b. A) D" z3 u7 a( nfunction nextSize(i,incMethod,textLength)) m( E6 N$ P4 W, e, B# u/ j; N) B
{; R; q @/ G$ {, t& }" S2 [
if (incMethod == 1) return (72*Math.abs( Math.sin(i/(textLength/3.14))) );- b( m, f& B# |- v' m
if (incMethod == 2) return (255*Math.abs( Math.cos(i/(textLength/3.14))));; B" O3 ]/ Z9 I
}
# N; @5 m" f2 U- d6 q
! ^ n5 M L) D* l: tfunction sizeCycle(text,method,dis)) e9 D5 T& U( N* C6 Y) l6 @
{
8 c3 s$ q6 m8 U' M! K output = "";
1 j/ `2 Q0 H! U/ F9 B8 V2 E% K; F/ v E for (i = 0; i < text.length; i++): _3 M+ `, z M1 \( E3 I" X. U& s
{: h& P" q4 V- K T8 y, e# u! ]+ O
size = parseInt(nextSize(i +dis,method,text.length));
& ?+ A' o! }* x M) X. w output += "<font style='font-size: "+ size +"pt'>" +text.substring(i,i+1)+ "</font>";% m( v% l- ^& B
}; M1 q: G ~1 f$ B
theDiv.innerHTML = output;$ ` c- j; @2 ]/ E. @
}' H& Z2 t: ~0 `( I# a
7 {- V/ e) P1 B/ \9 e) j( [+ y
function doWave(n)
0 X# F/ E/ @; o/ v* B% Z{ ; q/ W7 K2 _ D% V
theText = "JavaScript";8 j5 U3 s+ u( ~9 e! I+ |
sizeCycle(theText,1,n);
( T+ G( K' l/ R& O* q; O if (n > theText.length) {n=0}% q3 U. c0 ]; S B
setTimeout("doWave(" + (n+1) + ")", 50);6 e+ d# S \% k, a
}& W' g2 P: E- k7 l8 x
</script>
0 u. g( z# y, B9 l! g3 v<div ID="theDiv" align="center">- w3 o" P/ `4 C0 J* \
: f4 ]2 O" X% C4 z! o
</div>
2 p1 z$ V" {1 X+ p7 Q8 ]* W+ S0 I1 ?0 h2 b
% E, ^3 q" {5 ~
1 m5 k4 t' H d6 A6 O
: t+ U- [# I* S: I第二步:把如下代码加入<body>区域中<body onload=doWave(0);> |
|
发表于 2008-1-21 20:50
|