网页之文字的循环闪动特效

zw2004

<script language="javascript" type="text/javascript">
6 J. w4 y! f/ I% l# }$ C<!--
2 j; d$ S/ q8 j// convert a single digit (0 - 16) into hex
( ~" b% F/ |! V* I4 e* o5 l. L8 X* Qfunction enHex(aDigit)6 T0 x9 P" r' S4 c! l( b# v: Q
{
8 x: `. I/ m2 p    return("0123456789ABCDEF".substring(aDigit, aDigit+1))
/ b. W1 V, }& L! X, l2 p}
: I8 k' ]. ~* U$ r1 l4 L5 W5 J// convert a hex digit into decimal3 w% b7 f2 {  k5 h& I: E. R
function deHex(aDigit)
$ j# w1 G5 e: u& Q+ b! y/ e, G{
: w" K- P8 R: T6 H# F    return("0123456789ABCDEF".indexOf(aDigit))9 g2 |5 J/ h2 t( R
}
9 v( {! d% x& T& Y; F$ q# U: C$ s) b$ C" Y! v
// Convert a 24bit number to hex
: {" L' H, K  \" P/ Afunction toHex(n)' E7 S& t( S6 j( b1 X
{
1 A" f1 X& c( b8 F# p2 k    return (enHex((0xf00000 & n) >> 20) +% H+ i0 P+ G+ T: }* A  i- O3 t6 Y
            enHex((0x0f0000 & n) >> 16) ++ W! ?" k8 q3 L6 d/ \' g+ {4 @
            enHex((0x00f000 & n) >> 12) +4 P  l7 m% d. T$ _7 A6 u5 K
            enHex((0x000f00 & n) >>  8) +6 ]3 u9 i% I; g3 M; A1 P
            enHex((0x0000f0 & n) >>  4) +& k, z+ n0 h5 @; O9 ~7 s
            enHex((0x00000f & n) >>  0))
3 s3 ~8 A' B0 ]9 I% Z' b8 B}  n) d8 Y1 r' E; a' G' l3 B& B
// Convert a six character hex to decimal
- x/ B; A' k% C+ S) V3 Yfunction toDecimal(hexNum)1 V6 j% g8 Q! `) D" u; c
{0 h8 B; L% I8 k
           var tmp = ""+hexNum.toUpperCase()
2 U& c- s7 u' \3 `2 B    while (tmp.length < 6) tmp = "0"+tmp; V) V3 n; l% `# ~9 n
           return ((deHex(tmp.substring(0,1)) << 20) +
$ G- M9 l' @; d2 V3 D4 t                   (deHex(tmp.substring(1,2)) << 16) +
0 i4 m# o% r  J% b            (deHex(tmp.substring(2,3)) << 12) +
' T3 ]! I$ ]' n8 d3 }            (deHex(tmp.substring(3,4)) << 8) +# u, w9 }. H2 X3 X1 }% `" b
            (deHex(tmp.substring(4,5)) << 4) +$ F+ r$ l- @: Y/ D. a; \
                   (deHex(tmp.substring(5,6))))3 g& U1 B4 R) E/ _4 ]
}" f7 |: _' K# \1 ?. e. c: x7 U
///////////////////Shimmering Links/////////////////////
) j+ L* i0 M# h" ~7 s9 G  n//global variables
* G7 c* Z/ O' F- j* r6 kvar hoverColour
  V$ [- g  q& y# ^" l) z* i3 m8 mvar numLinks;
! R8 u* W$ g) Xvar rate;+ F; ~: X/ c0 S- e
var numFadeLevels;
3 A* K! S  n* x- qvar bgR;
) d% G( z# E/ j; R3 ?var bgG;
5 V5 s2 ^0 f0 G) R( ]) Q2 O* v; qvar bgB;7 x' Y$ E6 n0 a
var currR;5 ^( h- d2 \" q. y4 }- h0 H( x3 I
var currG;
* e& Y5 b9 b; G  P* x0 Ivar currB;
( f3 ?7 r2 c5 ]) J6 fvar count;1 `" {5 J# ^/ }; T( I* t0 \) J
var fadeOut;0 a$ @& I0 Z1 I# \5 f
var continuous;
# k7 n3 S. t# E$ z+ Cvar newColour;3 z: U# f. U$ ~# O( o# G: P
var tID;
4 u% m" W  {, J" l, ^5 \  c7 H2 Pvar redInterval;
( P  @1 `. f3 `& j- _! L, ivar greenInterval;
" C: @0 l, z/ Y" s6 yvar blueInterval;
* y/ D9 W  [1 _" \6 w+ v2 M4 K: ofunction initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
( I0 g7 X. L! o" m. ~0 I+ q3 ^. L{8 {. M- k/ m: N
        hoverColour = mouseOverColour;
" q: f" o5 `9 ]% a0 ~1 ]        numLinks = numberOfLinks;& w3 ?6 p& I  c' }" d
        rate = 1;
, V/ O3 n" Q/ Z" @8 R  c        numFadeLevels = 30;3 @, `6 N: v) L' P  l' m% s
        function initArray(theArray, length, val)* I, n+ _; ]+ J" ~7 G+ H, W
        {
3 }2 A( j( W$ ^. C" S0 R, I7 q                for(i=0;i<length;i++)5 j9 j- R1 s6 b
                {
) z) v( n! K& b% ]( D                        theArray = val;6 Y1 t3 i0 k& a2 P$ D
                }* |% t) ?7 I  X9 z2 V
        }! d0 L$ `, Y) |7 h9 c: r2 l
        bgR = '0000' + fadeOutColour.substring(1,3)" y+ {4 Q4 Q( B- E$ k% {3 Q( J
        bgG = '0000' + fadeOutColour.substring(3,5)- T% s( k5 Y" S( r* @- w6 F- d
        bgB = '0000' + fadeOutColour.substring(5,7)
7 Q8 b4 ^( `4 W: u5 ?# e5 B        currR = new Array(numLinks);. E7 F% `* t1 [; X3 X5 [
        currG = new Array(numLinks);) E, @4 A; P- C7 u6 X0 G
        currB = new Array(numLinks);
. a" e, b8 j9 w, H0 Z        count = new Array(numLinks);
5 |" d5 P; d" q# s- m* f        fadeOut = new Array(numLinks);+ _' F$ \  B: J0 \
        continuous = new Array(numLinks);
+ R9 o- ?9 J( A6 p2 I9 {        newColour = new Array(numLinks);' A+ [+ x5 k, a" S. s' ]/ i" J9 ]
        tID = new Array(numLinks);3 `! y. e2 B* h, [+ e' g
        redInterval = toDecimal(bgR) / numFadeLevels;) C+ P& O! E  s
        greenInterval = toDecimal(bgG) / numFadeLevels;- _  @1 z; m+ j- l
        blueInterval = toDecimal(bgB) / numFadeLevels;# _% U# k$ V) B  I0 Y0 ~
        initArray(currR,numLinks,0);
( h- F8 \2 c' G' L3 y+ ], R        initArray(currG,numLinks,0);
4 O5 O1 M3 w$ w! F        initArray(currB,numLinks,0);  W! ]8 \# a) [
        initArray(count,numLinks,0);/ r* g3 U3 y: N3 L9 z/ D1 u6 s% S
        initArray(fadeOut,numLinks,true);& }* a. y; s" v9 o0 |2 S
        initArray(continuous,numLinks,true);1 p0 ~0 z4 C* D. c, n: W7 \) B" e
}        . P# c( R% E  ?* S' B
function startFade(id)
- G! [0 S% n, n$ k" c: M9 x{
& Z& {& J1 Y1 i7 u7 V- O5 j  ]6 l, w        if(fadeOut[id] == true)
2 C- y4 o! y) Z; N1 u" t; j        { /*move colour towards background colour (increment)*/* H; x6 j0 W% o! B
                currR[id] += redInterval;9 ^% v1 _7 J3 n. J
                currG[id] += greenInterval;
* t$ i1 `# ~4 f  ]0 o6 r                currB[id] += blueInterval;
. Z" w8 @/ z, M' y0 M8 v$ D                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);$ p- V; j% F4 V3 U6 Y. U2 f# F; z" a
                if(++count[id] == numFadeLevels), _3 t6 c: W, n& i
                {
5 q  ?& ^+ W2 r1 W                        fadeOut[id] = false;2 q! B; n7 ?) k  f3 w, U0 b" Z
                }; `5 Z1 O$ E$ ]; y! F  w
        }; [( |. P' V- |: t! Y
        else
9 A. V1 m- m2 F( K2 l        {
1 ^: B# ]4 W1 O. z! @                currR[id] -= redInterval;
. Z& b: m, E7 k2 }% ]; I( z! I8 @: I5 o
                currG[id] -= greenInterval;
/ t) @/ m; Z, `  |" u
, g9 b! G4 |" w; Y                currB[id] -= blueInterval;" c, V. S0 H* t% \

) X$ J/ l5 T9 J2 }                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
* M" p7 M5 H2 B! {2 G; z5 f3 v1 ^2 `; c
                if(--count[id] == 0)
5 G. @: v& m* k- L0 O" J8 w) W7 b2 O
                {
! M5 b0 ]/ h9 m( m! v
5 v: J+ v4 {% Q* U                        fadeOut[id] = true;  X8 Z3 F/ S7 a- J4 S0 I& x
4 L" J/ |1 E$ h- _3 l) E
                }  y; ?3 L6 R# V

; m6 m9 T2 [+ m; _        }2 P2 A* V  f0 h5 r; i

* Q, S. O: ]2 K4 Z% N. ]+ B0 t" B        if(continuous[id] == true)& F" @1 o4 ~: E! t* F$ X3 l

# v' j4 S6 I1 F4 x  p, _( Q        {5 g$ V4 A% y/ s, y

- b  W1 g, ?9 v  W3 J                document.getElementById(id).style.color = newColour[id];               
& t4 P( u# k! l# E. l. b- X% V2 \: y/ {/ R5 l3 E! `* Z( F1 D
        }
, A' }6 \% g" ]" A: x
& y+ l. V; ~2 R6 y# `1 `1 _- _4 s. D* z        else
1 P5 {' i0 ~  l2 o4 B- u/ g+ L/ ~, r1 ]  i/ @$ R
        {9 I: y$ q1 H' y3 a! @$ n* B* L( A
! i: o- r$ `7 n3 l2 m/ E; j' }
                document.getElementById(id).style.color = hoverColour;
3 x2 C( D! X' N: @8 V* M
9 |, h: T) G8 J8 |        }
4 r4 N- g8 H4 I; P  _/ K" C! U' s2 _$ ?# A6 L4 l; F: `" @& w. d$ w
        clearTimeout(tID[id]);# ^2 {7 m7 A2 V3 g% N

6 B' N2 c/ A+ ~4 F! A+ L6 s" H# i        tID[id]=setTimeout('startFade(' + id + ')', rate);
1 V# ^+ b5 x& b/ X6 B5 S7 M# y) `% \3 ?2 }/ h# D* x6 Y4 C
}  m( D' h3 }) V1 ^: _; q7 l$ J
) \" v' q6 s% f" W
function continueFade(id)
/ k& ?% @" w" k' K. V5 _, w6 _
" r$ J% }; ~8 A: B5 @7 x# {9 p{
3 B+ A) x- ]) k# [9 k2 m6 A# i- o' x2 X4 s, `  K; ~( X$ s
        continuous[id] = true;) P5 [8 S4 I1 g* Z" q# O
+ i; M; |4 h1 \9 }
}% ]1 h8 \1 j3 X6 ]5 f) k) T  n( _

  R2 [  C& z- r+ t) x2 t0 dfunction stopFade(id)) o) v1 B* E$ \# D
' ^# C8 _; g' c0 e) a
{
' F$ n6 z- _$ y
( T/ a6 A) r5 }- r* H( d        continuous[id] = false;/ G) x" u) E; D+ r2 T: I
. s" f. h4 C" y
}8 }: n6 H3 ~; G: O7 T! f" y; s
8 [, ^" G+ p) R$ s, g4 A* }
function StartTimers()
$ y: u7 F1 g+ u. k, k5 a- c% z  V) Z5 I0 [  m
{        //set up an initial set of timers to start the shimmering effect
( R/ X) O" x( L% W# [% d# q8 A1 G3 V! B
        for(id=0; id<numLinks; id++)
# }6 i, Z  E8 l* \8 v1 e7 V$ X+ u( Z- X2 u
        {
1 i4 E5 _8 c7 q! W# \/ p& g; J& J8 P5 h. [& c, _- j
                t=setTimeout('startFade(' + id + ')', id*100);
: R8 F% i' E2 J+ j. N- U7 m# L% h$ H: t) ]
        }
2 I4 g! A  Q7 O- _) ^8 b8 I4 o1 \8 E9 m# k! X, W8 {. g
}* n2 F9 }) E* F) n% z& H

3 E+ m0 t" W; D+ ^5 K//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')/ T1 u0 [( o0 @$ g  N  w% K: H

3 ?0 y# k6 _" Y7 j( g  r3 H( ~. |initLinks('#FF0000', 6, '#FFCC77');
; K0 Q, E6 B8 p, G1 e$ ^# B0 T2 v, ?0 N- N* I8 Z
//-->
. H/ b& h; E- B' L1 T9 \/ l' T  p* O2 ], z
</script>
5 t$ W5 k3 w2 z. z# d& q<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元2 t/ [9 ?  f" E: B5 e
</a>
2 \. F8 T4 m8 _+ g( ^<br>& D! l$ V. g5 G
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>
$ D' o  Q8 I) I% i1 c1 J<br>
& X* e* L9 J( f& i8 v: K4 N<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
& A# R* G9 S2 F1 U<br>       
3 D8 ^! K5 O$ X<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>5 `" o; [9 F- b: x. Y; z/ _; W
<br>8 v( H  |2 Z# _7 m) ^5 g
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>$ q) z+ k) e" }( y5 I6 j; n. a5 V: N
<br>
! v+ t9 w) l; e3 ?5 G<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>* y, a5 ?3 _( i- E
<script language="javascript" type="text/javascript">
7 B9 f+ g! {2 D9 i2 X<!--
0 n* Q. k$ o3 b) ]; Z: hsetTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering# V. `: I# o" M9 t
//-->! I' f1 V. I  I1 W/ v$ h' p
</script>