|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之奇特的文字变化特效
脚本说明: 9 \; l9 ~* z! i, l4 J
" ?& K5 c' v5 G# `第一步:把如下代码加入<body>区域中
1 D6 Q3 S$ K7 e u: @# V. T* y <script language="JavaScript">: X! a# S2 r4 }
7 s) j# k1 q2 `) Sfunction nextSize(i,incMethod,textLength)( M3 G- }3 x# b) h. L/ T
{3 X) ^ ^. S6 w4 l& e# T
if (incMethod == 1) return (72*Math.abs( Math.sin(i/(textLength/3.14))) );
+ x& }* I& ~* }+ c* a0 aif (incMethod == 2) return (255*Math.abs( Math.cos(i/(textLength/3.14))));# } n @2 V" C% f( A# L3 S
}
. g+ e G2 S: |; ]$ D0 X% c7 p% N0 c5 }; j, x! c
function sizeCycle(text,method,dis)
$ I" g. O, @$ @1 D4 x+ U6 I{7 U, T" _" N& y2 N, ?5 r
output = "";+ ?) d5 N9 V+ C7 A5 A
for (i = 0; i < text.length; i++)
( A$ X+ a: D5 u; s! b: p {
; U, ~# w o$ K7 O4 a: Z6 s/ j size = parseInt(nextSize(i +dis,method,text.length));
2 e! N; }6 X' _( z output += "<font style='font-size: "+ size +"pt'>" +text.substring(i,i+1)+ "</font>";
* }3 E0 n2 j# G }
" a8 b. I! ^, r$ y theDiv.innerHTML = output;
! ?1 ?5 M9 a# \5 N( G+ @/ q# q}
. L2 Z( t; C8 Y' i# e4 ^, p" {
4 N% l: x" X7 N# U8 x9 P7 ?0 @function doWave(n)
1 ?4 \! |9 g) }9 P{ / _- b* j9 g, S, }
theText = "JavaScript";2 S0 _" m% \2 |
sizeCycle(theText,1,n);
$ I* `* i( J! W# _% r8 W5 J# V if (n > theText.length) {n=0}& W& l/ L5 N* V& F6 l# j- w3 R) D
setTimeout("doWave(" + (n+1) + ")", 50);
5 {1 o3 g& P0 {8 a}: z" K4 o! y' s/ W) z" [: {0 B
</script>$ P+ ^9 ` }9 V; R5 ]
<div ID="theDiv" align="center">8 a$ c# A7 T0 f+ C1 L1 y9 X
; i$ z3 ?1 \8 Z# @9 a4 D3 P& Q</div>! o+ v" ]( }! D
) |- o8 K! {6 D7 O" r" Z5 o2 r
* H% s* y* e' g; A7 Q( K# H
& @& A! g; Q5 H' P$ c/ b* C 0 b% D1 l# {$ A
第二步:把如下代码加入<body>区域中<body onload=doWave(0);> |
|
发表于 2008-1-21 20:50
|