标题:
网页之奇特的文字变化特效
[打印本页]
作者:
zw2004
时间:
2008-1-21 20:50
标题:
网页之奇特的文字变化特效
脚本说明:
0 E" I/ n7 @* i
% v/ f( \' G6 f9 u& Q$ ~
第一步:把如下代码加入<body>区域中
, c4 w! t; [, Z; G( q4 [/ S* s
<script language="JavaScript">
' l% _. f. `5 m' V" g7 y0 y
8 H0 f7 C! O" ?- D4 _
function nextSize(i,incMethod,textLength)
) S' y6 S1 |* R) B; o+ q3 A
{
. z. `. I% Z/ M5 n" v; c
if (incMethod == 1) return (72*Math.abs( Math.sin(i/(textLength/3.14))) );
: c. w( m! @# s* j
if (incMethod == 2) return (255*Math.abs( Math.cos(i/(textLength/3.14))));
( x( r, W% w3 s# S* m
}
. f$ w9 b) z( K
, Y( c# Y8 P1 m
function sizeCycle(text,method,dis)
' M& [- y" n* x% `
{
) H( D% `' W- P, u
output = "";
$ O- K% O2 \: d% U" j* y' X
for (i = 0; i < text.length; i++)
8 L4 E# u Z& Y( U! J; r( w
{
& c: e$ `7 E, ]6 J7 K
size = parseInt(nextSize(i +dis,method,text.length));
& g" A( W. u9 P, F) b: J
output += "<font style='font-size: "+ size +"pt'>" +text.substring(i,i+1)+ "</font>";
( W& m0 U5 h, N) x& y# V
}
5 U3 G l: i" L' q% _" _3 G
theDiv.innerHTML = output;
( W& [1 m9 B$ b2 k; e
}
& o6 u P# A) p' x0 K, [2 l% v
2 v O F$ y h2 n* D. j
function doWave(n)
& _/ x0 I% x- z* v0 q$ P1 x
{
6 ]( R1 t* r, v
theText = "JavaScript";
$ Y' C+ p+ j5 L; Z1 b, @& ^
sizeCycle(theText,1,n);
3 }: K A+ H2 r3 f. c
if (n > theText.length) {n=0}
# b$ \2 k3 y& n6 P# Y) O1 f) n$ m
setTimeout("doWave(" + (n+1) + ")", 50);
/ t2 y3 Z* q, Z6 A
}
5 l9 j3 B, J: [7 w
</script>
! c5 o* M* @$ A4 @
<div ID="theDiv" align="center">
0 X5 x! J: C( F5 l. v2 T+ `3 d
, G+ |4 {( a, q" Z5 C
</div>
& {+ ~+ D, W: L; y2 ^. ^+ ?
$ V! d4 u/ B- E) Y4 @# T! W' j
! m2 q1 l* z1 K$ a% y. Z+ Y9 \9 L
* x* t! }! ~5 m. A
- K5 r' z& `6 c
第二步:把如下代码加入<body>区域中<body onload=doWave(0);>
欢迎光临 捌玖网络工作室 (http://www.89w.org/)
Powered by Discuz! 7.2
