|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之奇特的文字变化特效
脚本说明: ! X- S9 P. u. T
: |1 Q% ]( `8 Z; ~1 X- }- Y1 k第一步:把如下代码加入<body>区域中
7 ~; r' p& A# s% ]' V) R6 { <script language="JavaScript">- |# }/ \9 i e1 k+ A6 j2 Z4 C
9 R2 q0 F0 g# f/ S0 Hfunction nextSize(i,incMethod,textLength): M) b; x9 [' m! z8 b
{0 X( a$ q, _8 v( _9 k
if (incMethod == 1) return (72*Math.abs( Math.sin(i/(textLength/3.14))) );
: V9 ]" G! V& o3 [8 Zif (incMethod == 2) return (255*Math.abs( Math.cos(i/(textLength/3.14))));
# U" X' s/ l4 c. X) C}
! x o: c' b5 W+ ] H7 E
" t2 H2 N5 Q- }& J1 ~3 ?" Y) w1 Ifunction sizeCycle(text,method,dis)1 j# S3 x2 i' q% l! A! y) ^3 w' P! b. @7 \
{9 l/ p$ s; Y% o; I p2 A) |2 ?
output = "";: _1 F9 D- G2 o
for (i = 0; i < text.length; i++). u. E+ i3 T5 ]4 y
{
/ @) j- R8 i0 t0 y size = parseInt(nextSize(i +dis,method,text.length));- M) f# r* n, \, ~ _, ?
output += "<font style='font-size: "+ size +"pt'>" +text.substring(i,i+1)+ "</font>";1 y3 @9 l- h/ d; }1 L! z
}
/ I9 E, G) \; S5 ^ O# Q7 Z theDiv.innerHTML = output;
) F( I, p# x; @% _! F}2 h R" j: B% F% Z4 o2 i9 c
& Q3 |5 H4 P8 a% s
function doWave(n)
' y, B/ t4 A( ]6 h, t! P0 P{
8 Q- r; n- i6 a0 w" A# C8 Q theText = "JavaScript";
" C: c0 ?8 K- x! e8 M sizeCycle(theText,1,n);
- @% ] w$ o: z: S/ j; I if (n > theText.length) {n=0}
3 ~) y; E; i8 u4 D8 i. i6 h setTimeout("doWave(" + (n+1) + ")", 50);
: L' w. D, @0 s1 G6 ^& t}
$ j* p. k7 A% L, K</script>
( C2 e1 _4 g1 j8 p. S6 z. i* N6 O3 V<div ID="theDiv" align="center">
! z8 k! p8 D# c4 p8 U7 ~) t# E* @/ c$ n
</div>/ p' F5 D( L$ k9 L" t+ k6 y
0 O7 V/ O) L$ E
1 @8 J: O0 o a6 P P/ Y
7 N# y6 P" j: Z2 {0 |
{8 M* J2 b* ^
第二步:把如下代码加入<body>区域中<body onload=doWave(0);> |
|
发表于 2008-1-21 20:50
|