标题:
网页之奇特的文字变化特效
[打印本页]
作者:
zw2004
时间:
2008-1-21 20:50
标题:
网页之奇特的文字变化特效
脚本说明:
0 j# L$ x+ T$ D# x2 @3 F+ b
' J: J, `2 M" v- D
第一步:把如下代码加入<body>区域中
' j, x$ ?( {" ^. N- v" ^
<script language="JavaScript">
# }4 e& r. ]1 ?" z
# {+ A3 F; l. Y1 p+ ]
function nextSize(i,incMethod,textLength)
2 q9 Q b" R1 Q. I: _7 J U
{
z* T$ Q% e1 {8 L& c& L
if (incMethod == 1) return (72*Math.abs( Math.sin(i/(textLength/3.14))) );
5 j0 f' F8 M6 b# [2 f* [
if (incMethod == 2) return (255*Math.abs( Math.cos(i/(textLength/3.14))));
2 {& X* J S; _8 b6 @
}
- R$ V2 B% F# K# K2 E
2 a8 {: w- h- M. Q* f: O3 u i& C5 c
function sizeCycle(text,method,dis)
. y0 X: s. n5 K+ I' p! R( v4 a
{
) Q9 g5 @- |, y0 W: b% T( ^
output = "";
, I) @# G9 ~$ i" [
for (i = 0; i < text.length; i++)
, [$ H2 K; k: s% _. P
{
) S; g7 x' r ]. T
size = parseInt(nextSize(i +dis,method,text.length));
0 S& e0 b) Z6 d' T/ s
output += "<font style='font-size: "+ size +"pt'>" +text.substring(i,i+1)+ "</font>";
. y- q7 |4 h& w1 |
}
8 U |# D* B* E7 M9 d7 W) \. q) M
theDiv.innerHTML = output;
# }' \8 D) L! c; c0 k' Z
}
/ ]. O; Z! x @8 J3 c. c& h
2 Y: L. t# Q6 F4 H1 I" ^
function doWave(n)
5 r: J9 ? |8 o( z9 W- x
{
3 F& c( I, B4 V
theText = "JavaScript";
& h# U9 U+ W! J
sizeCycle(theText,1,n);
3 a3 ~6 }4 _1 T- K W
if (n > theText.length) {n=0}
2 D; c1 n3 y& z! Q/ ?
setTimeout("doWave(" + (n+1) + ")", 50);
8 ]$ p* K# {9 m+ t' C4 _/ E- P
}
9 R# F5 m' f# I! T5 p
</script>
$ Y# m& t- z2 D
<div ID="theDiv" align="center">
9 `2 J( Y% h& y1 @0 ?6 J$ j/ P
& R' T4 o# s, s2 h
</div>
0 X2 w% r. _2 E8 s# I; d
" K; [6 L: n% |8 @' V
8 j: [& H c5 u; u! T
) z) m1 P' V$ r9 ~/ q9 Y0 ~" e
7 S2 y; q! p1 |4 E* x2 V1 B y$ H
第二步:把如下代码加入<body>区域中<body onload=doWave(0);>
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2