标题:
网页之奇特的文字变化特效
[打印本页]
作者:
zw2004
时间:
2008-1-21 20:50
标题:
网页之奇特的文字变化特效
脚本说明:
6 W; `2 B7 k/ e
6 j, u- G. K$ h* o! Y' ?
第一步:把如下代码加入<body>区域中
- N1 Y% h6 \$ z/ P" v$ ]
<script language="JavaScript">
4 O! @' E; ~3 G/ j, b
. O& X5 L5 s8 n6 Z5 t3 e
function nextSize(i,incMethod,textLength)
4 W& ]% m) y& y1 F6 K: Y' Y
{
4 P2 e. ] S7 I2 x, t
if (incMethod == 1) return (72*Math.abs( Math.sin(i/(textLength/3.14))) );
7 y: f% I' z! O2 [; [) V
if (incMethod == 2) return (255*Math.abs( Math.cos(i/(textLength/3.14))));
' k1 ]! D2 V# D
}
\9 l+ a% X& ?
, k/ k7 u {1 l, O B: ^# \
function sizeCycle(text,method,dis)
8 u4 m$ f! b. H: w* f
{
- s, E2 O s' C" j
output = "";
' x$ z. v8 F1 r/ ?% G' j2 C& o
for (i = 0; i < text.length; i++)
* w/ }, J) _0 ?
{
' Q6 Z# y7 U4 E' D! v. |/ P
size = parseInt(nextSize(i +dis,method,text.length));
- y! g' x* T4 P5 j
output += "<font style='font-size: "+ size +"pt'>" +text.substring(i,i+1)+ "</font>";
5 X8 g; R4 ]! S4 l; {2 u
}
. g' @& h: @ M7 z7 S
theDiv.innerHTML = output;
+ E/ i" `, J/ D2 K; n* x6 Z
}
5 }! h/ a0 @+ I2 k) M0 f
% Z9 b' ?/ R9 A$ i* D
function doWave(n)
; v- ^/ k+ f6 o3 Y
{
% N% ^1 R G0 m9 h! Z
theText = "JavaScript";
; g) I. K3 V" V7 H8 m
sizeCycle(theText,1,n);
" S- \) `& `) a; D# F& Z0 ?
if (n > theText.length) {n=0}
0 N M* Y; o9 H; S/ U# o9 b p
setTimeout("doWave(" + (n+1) + ")", 50);
( C8 K; f3 o2 {. m$ P/ V
}
! ?: [+ |. u; A4 Z# \% E
</script>
6 M' X' q2 V7 q2 Z2 c3 y
<div ID="theDiv" align="center">
' L8 y- D1 J! d# o0 r% P
& a; H) n) o+ I2 ~
</div>
% V/ p2 r2 @2 h: L/ L7 t
' M6 r d* H5 T
7 i4 L+ Z2 ]9 F( u
9 h1 r1 n6 r _7 s( S& v2 m
+ M4 l: d' M \" H: m
第二步:把如下代码加入<body>区域中<body onload=doWave(0);>
欢迎光临 捌玖网络工作室 (http://www.89w.org/)
Powered by Discuz! 7.2
