|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之奇特的文字变化特效
脚本说明:
Q8 i k( ~6 A U4 T$ j4 r: z
' @6 ]1 x% o! H+ o9 Y" Z第一步:把如下代码加入<body>区域中+ O G" B0 M; t9 J9 O) [ F& e
<script language="JavaScript">1 \5 q* S# i2 d) w D. ^
2 F' P/ H8 Y+ F0 W' U
function nextSize(i,incMethod,textLength)5 @5 }1 D4 P1 d$ @: k
{9 x% F% l2 |) x- V( l
if (incMethod == 1) return (72*Math.abs( Math.sin(i/(textLength/3.14))) );
# K1 {& ~3 M6 qif (incMethod == 2) return (255*Math.abs( Math.cos(i/(textLength/3.14))));% L8 a% G a" x/ T Y
}
7 I1 T! b& j' {! T; r2 V) {0 v/ J( F
4 k1 F8 |% M# A: U+ ofunction sizeCycle(text,method,dis)
% B- ?5 |' Q- {{
2 ?0 T' N Q1 i* {2 a output = "";
4 |4 `+ j- p2 W* R" v for (i = 0; i < text.length; i++)
4 f7 v& u: \% G, f {* e3 R0 H4 A+ \
size = parseInt(nextSize(i +dis,method,text.length));
# T4 |) u y& H$ }9 F/ E/ S output += "<font style='font-size: "+ size +"pt'>" +text.substring(i,i+1)+ "</font>";
J1 V6 `+ N2 S( t, a, N0 C }7 G: v9 `) k$ R* R
theDiv.innerHTML = output;5 D, k# l* h. n. {" ~: C9 F- X
}
/ \ k: p8 e- b( \2 |' P" X
- v) W% {: Z( I1 N. ~function doWave(n) - S1 [9 _8 R& r9 W* M
{ 9 I6 R& C8 {7 y* a1 V2 @
theText = "JavaScript";3 ~' G W3 _9 l: i
sizeCycle(theText,1,n);# L' U$ V a3 `$ ]' T' _% j
if (n > theText.length) {n=0}+ r2 |# h$ M( E% e. z/ t, n( i
setTimeout("doWave(" + (n+1) + ")", 50);
7 g' _- g, p9 h0 U}
" _ Q; d4 A- a" @% c" I</script>
3 b9 y1 v( z% M) k<div ID="theDiv" align="center"># V8 a' S- V* C4 v% ^
: H* ]4 u" r8 P0 s8 h</div>% s# P/ Q; w/ y2 I! J7 q; ]
( o& g" ~6 _6 W# o
: ^& {! D- _- |+ I* F( U
) \3 X) M/ P. g; I% `" ^8 |1 D
( a$ w- M7 k. r' p+ } Z第二步:把如下代码加入<body>区域中<body onload=doWave(0);> |
|
发表于 2008-1-21 20:50
|