|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0
|
网页之奇特的文字变化特效
脚本说明: / d& T9 ?5 o6 d' W/ `
+ p" \, n% E4 S: l第一步:把如下代码加入<body>区域中" p6 O3 n2 |5 R f* {$ M
<script language="JavaScript">% ~" Y4 ~8 w9 T( [. g. \! Y7 X4 p
3 U- z2 Z" b, t1 g
function nextSize(i,incMethod,textLength)
: o& `% }) R/ ^8 [: J$ ~{
U' @' p( y$ B+ vif (incMethod == 1) return (72*Math.abs( Math.sin(i/(textLength/3.14))) );
; { F2 O0 N& Z, ^7 X# F8 Aif (incMethod == 2) return (255*Math.abs( Math.cos(i/(textLength/3.14))));: V6 x) V y/ v# g
}
+ X {$ d m. E# C
( j7 ^/ }: d" ^0 c( T2 y. Afunction sizeCycle(text,method,dis)) ]% g. @6 ]9 g* W' t' w% D, G
{6 Z, ?# R0 x4 c2 y8 Y) |
output = "";
; s" w0 o' C$ {" G/ t for (i = 0; i < text.length; i++) o/ y( }* Y+ Z/ L
{
& u) Y C9 f2 C' C: Y size = parseInt(nextSize(i +dis,method,text.length));
& P$ N% Q; `" h1 ~" S output += "<font style='font-size: "+ size +"pt'>" +text.substring(i,i+1)+ "</font>";
4 @. v7 v8 z4 ^" y* I }/ W4 t) _3 V* }
theDiv.innerHTML = output;
t3 b n0 Z8 ]2 e4 r7 q" [( d}* _' D/ _ A/ B2 I m: N6 `3 O
8 N/ e; C. H* q9 \4 i% l; R, e/ a
function doWave(n) 9 J' a# q9 B6 `' S) H
{
. ?5 A$ m+ U$ z; \6 L& [1 C theText = "JavaScript";
: R c: s2 U7 G/ B; D( ^7 R sizeCycle(theText,1,n);
; [6 E, I% v7 p _8 b if (n > theText.length) {n=0}9 A8 x; j# K0 G* \0 [" Y
setTimeout("doWave(" + (n+1) + ")", 50);
- E) h6 i. F. E& ~. x}: q4 N) i/ I# N
</script>/ L- x; k, W E5 o, O
<div ID="theDiv" align="center">
* c. S( c: [6 H+ x- p; E# a! w& P" A$ Z
</div>1 j7 v( ~! n1 A7 v5 [% H* _
. h4 X9 I8 F8 g1 z0 s" _
$ I- q4 |0 p) T1 ? r8 X/ P; d3 k. O
8 ?8 V9 G! T& G" s
第二步:把如下代码加入<body>区域中<body onload=doWave(0);> |
|
发表于 2008-1-21 20:50
|