标题:
网页之奇特的文字变化特效
[打印本页]
作者:
zw2004
时间:
2008-1-21 20:50
标题:
网页之奇特的文字变化特效
脚本说明:
! l, M- N/ t' W9 Z# }
* ]- ?% }1 `) N2 ^
第一步:把如下代码加入<body>区域中
, \5 R% D. `( ~0 ]/ ^1 }9 p6 }
<script language="JavaScript">
& Z, ]* ?& i9 b1 F; X
9 d" j* S7 {1 {
function nextSize(i,incMethod,textLength)
5 {9 s* J( ~' [
{
8 @+ i. R: l# }- e# U/ [3 X& X* u
if (incMethod == 1) return (72*Math.abs( Math.sin(i/(textLength/3.14))) );
0 W2 c' b4 A; T$ Z5 l3 {
if (incMethod == 2) return (255*Math.abs( Math.cos(i/(textLength/3.14))));
1 |% R! N' ?- @, }& w- h
}
' c; ~9 s) [8 @6 `- w
7 Q6 W# \2 H, n+ o1 Q# e1 Q
function sizeCycle(text,method,dis)
- b1 o" I3 T# E" k
{
4 R# B; c. X7 b1 y( a* B6 h' \
output = "";
. G/ o9 Z: _/ K4 D6 U; E- \
for (i = 0; i < text.length; i++)
% B2 o4 ~3 c$ y* \, e: ^3 ~
{
- G. ]9 I8 q( p6 Q% S! t2 ?
size = parseInt(nextSize(i +dis,method,text.length));
; V7 k6 p0 h2 p" L3 J
output += "<font style='font-size: "+ size +"pt'>" +text.substring(i,i+1)+ "</font>";
$ \7 a; d4 S+ E; ]
}
$ z1 t6 N+ c1 m: [' P3 \' y
theDiv.innerHTML = output;
: x5 Z5 x$ v6 J2 c' m( F
}
. p( y2 g0 g1 _. D# B$ [( G* |8 Q
! Z- Q6 P1 F# n" [) m
function doWave(n)
h8 o( {; B" d P: U
{
. X+ Z1 A! J) \- R
theText = "JavaScript";
Q9 l) I# b3 o" D' g/ n; o
sizeCycle(theText,1,n);
6 r2 N7 T4 E( _* o& j8 i* E
if (n > theText.length) {n=0}
' v. e/ U q- z4 Q; w4 K* P
setTimeout("doWave(" + (n+1) + ")", 50);
* W! Q9 D- |- ~1 {+ ]+ l2 n
}
$ g ^0 `0 M$ E6 L l) p+ Z
</script>
5 ~6 {3 L& r r/ N+ U2 g) B" v6 I6 U7 J
<div ID="theDiv" align="center">
; K- A( z( e0 t1 m9 o: k
1 L9 S- `2 d' u* N H: b
</div>
9 O/ b3 |. p) {& [" K
. T7 d# V- t1 x$ d5 K
1 Y$ \1 L! q* D! S. k
9 [9 P' t9 R4 j/ t( } }- k
% ]9 V3 l& D% _8 |4 v8 d" _; p5 `
第二步:把如下代码加入<body>区域中<body onload=doWave(0);>
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
