标题:
网页之奇特的文字变化特效
[打印本页]
作者:
zw2004
时间:
2008-1-21 20:50
标题:
网页之奇特的文字变化特效
脚本说明:
9 W3 r$ \0 q- d
8 N# ^9 G/ G6 r! F8 q, H& o
第一步:把如下代码加入<body>区域中
# @& S( D$ F& X8 K
<script language="JavaScript">
+ C* Q7 v+ T# U8 Q2 p
! U' L8 G+ V; H9 ]! p
function nextSize(i,incMethod,textLength)
( {+ j7 n1 A* q# P5 V2 g% W T, H, @5 h
{
: g1 K% p0 e# @& n. ?
if (incMethod == 1) return (72*Math.abs( Math.sin(i/(textLength/3.14))) );
) w3 m' d; w* i( W8 S& b6 M# v
if (incMethod == 2) return (255*Math.abs( Math.cos(i/(textLength/3.14))));
# I) O5 Y) F2 Q
}
9 S% [3 C- i# x7 C! V! m+ S
2 e9 H% _5 y! J. ~
function sizeCycle(text,method,dis)
. r9 [+ Q9 |2 n# [. `
{
+ b2 m! `, m- K* k; z
output = "";
4 [: U; U0 g2 ?4 G' E
for (i = 0; i < text.length; i++)
& f: c+ Z: \3 _+ ~5 |
{
* ?' e! ?' Q7 r
size = parseInt(nextSize(i +dis,method,text.length));
$ P( Q$ M. l! I Q( b
output += "<font style='font-size: "+ size +"pt'>" +text.substring(i,i+1)+ "</font>";
6 P/ |- i" f* ^3 U
}
# K- A. F1 {" h! F4 S
theDiv.innerHTML = output;
" R/ o+ @: z9 l% ^! o0 e
}
* G: ]: j/ U3 Y* f7 z; c
% d- t# \2 p8 r# Y% l$ ?8 d0 l
function doWave(n)
- P# o1 A8 M5 W" f' y
{
) f. v1 k E$ B; }
theText = "JavaScript";
& h0 i/ M8 L" e" X$ k* g# Q" S
sizeCycle(theText,1,n);
, z! r1 M9 R: C3 H) j7 t
if (n > theText.length) {n=0}
0 \! V' E/ R3 i# D. Q
setTimeout("doWave(" + (n+1) + ")", 50);
9 p) L% m/ \& ?4 S/ \
}
3 u. w% x3 m+ I9 Y6 G& I6 b( z
</script>
+ h' v& T+ Z v* L. c, S- r7 n1 F
<div ID="theDiv" align="center">
# q7 t# p# p2 N$ y7 M
- g& c3 g3 V) |/ v0 r
</div>
- p4 \% V4 B- k2 i" s1 [
% q% ~- y) r* r4 j* n
; B9 m2 p# `6 G
3 ~3 Q) y! l. I4 w3 }
- D+ o; m$ d( Q5 l1 e
第二步:把如下代码加入<body>区域中<body onload=doWave(0);>
欢迎光临 捌玖网络工作室 (http://www.89w.org/)
Powered by Discuz! 7.2
