标题:
网页之奇特的文字变化特效
[打印本页]
作者:
zw2004
时间:
2008-1-21 20:50
标题:
网页之奇特的文字变化特效
脚本说明:
; A, [ j) D: S0 T
' g! I* J+ f2 `+ j$ L, Z* v/ n
第一步:把如下代码加入<body>区域中
8 u8 v$ k& @$ r4 f9 G+ {, h4 f
<script language="JavaScript">
4 k' N5 }+ F) _" ?1 m, _
" ?) R6 n$ D8 S
function nextSize(i,incMethod,textLength)
; h V+ M0 G) M3 {' z+ u, Z
{
5 E! P* k" Y5 B
if (incMethod == 1) return (72*Math.abs( Math.sin(i/(textLength/3.14))) );
; `* R+ R" x+ Z+ K; |- `( d( S
if (incMethod == 2) return (255*Math.abs( Math.cos(i/(textLength/3.14))));
: x" A5 P8 E7 z
}
0 u$ _) K4 C k
9 o! _1 a* s' \& L) C" ~
function sizeCycle(text,method,dis)
& ~3 N' X0 `. t3 {: L
{
3 P7 o: j0 B! N4 g' y, C t; t
output = "";
' T9 o! B( T0 [; F5 o- G
for (i = 0; i < text.length; i++)
/ I9 _; u: }- b9 [
{
# Y& Q# [. A9 E0 E6 g) _2 F- R/ L; U: j9 C
size = parseInt(nextSize(i +dis,method,text.length));
4 J' `; x$ u6 J' @% r! {
output += "<font style='font-size: "+ size +"pt'>" +text.substring(i,i+1)+ "</font>";
$ u& ~2 w7 o1 e# ^; A: |* V2 _
}
$ L/ Z# b$ W* B$ `' M
theDiv.innerHTML = output;
1 w1 g$ c4 n0 F/ x: b: ^6 e
}
7 Z( e' D9 Q- K9 }
- Y+ q5 B! @- v4 C$ n
function doWave(n)
+ |- X, m% x5 V- b h- q
{
; Z# ]/ F' o9 e8 z/ E- c! i
theText = "JavaScript";
* r& W9 @5 q2 ~; p( s3 Q
sizeCycle(theText,1,n);
6 T* X* b3 k' U
if (n > theText.length) {n=0}
1 \/ A$ x6 ~) F' `$ o* X1 N' ~
setTimeout("doWave(" + (n+1) + ")", 50);
+ U" |& Q+ |( B3 M7 r2 l" b, y- Z
}
2 ?) D+ S% H8 F7 j3 P. g
</script>
( c8 t0 f2 u: s" m( Y
<div ID="theDiv" align="center">
; a! i/ }) q3 s. b0 T
: b4 B' J& h, t; ~ I5 z
</div>
3 S3 T( A& o* W! a: N
: a: I* h ]+ m+ i/ M3 f$ w3 y
9 I6 C% I: ~/ }) e
/ x y% H% p' n+ q$ h0 K& z
; x: h) Y7 F7 F; X4 _1 C
第二步:把如下代码加入<body>区域中<body onload=doWave(0);>
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
