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

zw2004

<script language="javascript" type="text/javascript">
+ ]) X1 W+ b& k+ A# y1 Q<!--3 J- k# k' y1 F/ k( l8 h/ l3 A) B
// convert a single digit (0 - 16) into hex" g& F6 v& c3 W6 ^9 E
function enHex(aDigit)
! k6 D, j* ~& q) Y{
4 L& d3 V; B- c: ]1 D( j( U    return("0123456789ABCDEF".substring(aDigit, aDigit+1))) V* q' h' u8 s( p+ G; t6 i" z
}* E3 @) B* b& ~7 B
// convert a hex digit into decimal1 c3 A+ ^" y: }7 e
function deHex(aDigit)9 R# J$ B3 F3 ~3 t2 t$ t9 P
{8 w4 D5 h* X/ w6 ^2 V
    return("0123456789ABCDEF".indexOf(aDigit)), x8 _2 @5 C; T$ V* Q
}) Q- k; Z+ K/ a: t+ Y4 a9 ^( g
/ E, r/ c- O7 q# V
// Convert a 24bit number to hex
- w( S6 O" z0 U0 ]5 z+ Ifunction toHex(n)/ }/ J* i7 r- W9 z2 b, m. o
{
. z" J# g. l+ C- a1 Q# ]5 W    return (enHex((0xf00000 & n) >> 20) +3 K/ b8 E, J' G% \* k
            enHex((0x0f0000 & n) >> 16) +! \6 a; h" c. A2 h6 q8 M; U
            enHex((0x00f000 & n) >> 12) +7 f$ O* C; y0 f/ A: Q2 ^+ r
            enHex((0x000f00 & n) >>  8) +
' z- L3 y# k; Q, \$ [! j            enHex((0x0000f0 & n) >>  4) +
" x% P; F# z$ F- P            enHex((0x00000f & n) >>  0))- g( f( [, H2 O# s* ]9 M/ P8 x' g* o
}
/ F, e+ K9 a& Q9 ^. Z0 s// Convert a six character hex to decimal
. v+ q' q1 Y6 Rfunction toDecimal(hexNum)4 n! q4 g3 w% F4 Y* J+ g! S' o- _
{$ i/ F3 p7 x( q* D' ^. f
           var tmp = ""+hexNum.toUpperCase()
5 ]2 f2 X2 q3 `' x9 P    while (tmp.length < 6) tmp = "0"+tmp
: B: O+ m; D, o- K" ?1 Q           return ((deHex(tmp.substring(0,1)) << 20) +
$ s! R! B3 B+ o* f) m                   (deHex(tmp.substring(1,2)) << 16) + + ]+ v- J, h* C
            (deHex(tmp.substring(2,3)) << 12) +
% P# E8 ~1 ^# E1 L0 e& N0 r+ X            (deHex(tmp.substring(3,4)) << 8) ++ G7 S) k0 [7 N7 R$ B
            (deHex(tmp.substring(4,5)) << 4) +3 M+ N4 d  K* W' \! Y; L/ Y
                   (deHex(tmp.substring(5,6))))
5 l- _) \9 ^) w9 \}; O1 Y  V& j5 i0 j* p
///////////////////Shimmering Links/////////////////////
- v& N4 ]' G3 e- ]/ j/ J7 V, w. v/ _//global variables1 q, c/ @3 T. M' ~3 Y
var hoverColour. }2 c# d7 B) I/ L- x- w
var numLinks;
+ b- U' x9 i) k6 k1 y. i: Zvar rate;
" N: m' x, N( r8 I: V" Y( T9 Z) ?var numFadeLevels;# k9 Z$ a. D: S9 c% c. m9 w) V
var bgR;1 g- Q; P2 m4 @, U) l
var bgG;7 Y4 y" G5 B3 L, N# j8 U  z
var bgB;1 x) X# \& R) B% V
var currR;
0 H( Z9 @/ p% R4 S: n2 hvar currG;1 \# G3 n, _# r: l# M& T8 K
var currB;
" v/ ^' h7 f+ x8 l9 i8 ivar count;, z% G+ y, X# U% e) d7 k; L
var fadeOut;: r9 v2 k0 s" C- l2 w' e
var continuous;5 A% B( ^+ s& s! X" c2 t- o
var newColour;
; {1 {  x4 x% R8 k# _$ _var tID;5 b0 C6 V0 i3 }0 `
var redInterval;
2 v. k: y+ N. p0 \. x# {var greenInterval;8 r, P+ E! s5 q
var blueInterval;4 Z, N! \  E" V% M; v! u# e+ b8 X
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
* m( g* @" T: i% ]9 B( }0 t{9 [- o  ?0 ]$ G7 j, K
        hoverColour = mouseOverColour;
% t  T0 r% W/ ]* e) s        numLinks = numberOfLinks;
& g& E5 a( u& d+ z' B        rate = 1;
9 g8 O) D0 a  c9 i" S7 R: }        numFadeLevels = 30;$ T9 T+ ^0 g" n% b7 a( q. f
        function initArray(theArray, length, val); E# b) A: E& M! B4 K0 t
        {
3 F4 V/ ~" n+ F5 r* R+ p( Q/ d: h                for(i=0;i<length;i++)
) A7 \4 v. k( e/ f                {
' L% u; r: ?- a9 Q                        theArray = val;( f% `& n8 }, k9 F
                }8 V. N# S& x/ ]: Y1 b) X/ `
        }8 m# G& i) w9 g) s& y, W, `3 s
        bgR = '0000' + fadeOutColour.substring(1,3)
  Z0 V$ R7 g7 u        bgG = '0000' + fadeOutColour.substring(3,5)
( o" }5 K/ r- X$ l5 B5 B, T        bgB = '0000' + fadeOutColour.substring(5,7)" S1 P8 p5 ?$ R( v: g# O
        currR = new Array(numLinks);
- b3 m5 f5 O9 _  O4 ~0 z+ z        currG = new Array(numLinks);$ g/ ]  z, t5 m1 W; z5 R$ b
        currB = new Array(numLinks);
+ M5 L0 Z, ]. i: b        count = new Array(numLinks);' @9 h  {! O% f
        fadeOut = new Array(numLinks);7 G) t5 k; R" B* a' x1 \8 Y) v
        continuous = new Array(numLinks);9 t6 E0 e3 R8 i2 |( E* v- V; a) O
        newColour = new Array(numLinks);+ U( M8 w: Y& v: z) h2 Z
        tID = new Array(numLinks);
0 s4 {6 r9 b# h  U/ @7 L2 _. V        redInterval = toDecimal(bgR) / numFadeLevels;( F4 T* Y/ S/ _8 g1 C7 I
        greenInterval = toDecimal(bgG) / numFadeLevels;) A/ s, J# k6 g
        blueInterval = toDecimal(bgB) / numFadeLevels;8 E  R1 K6 A5 t- Z1 ?5 `
        initArray(currR,numLinks,0);5 k: T& @/ c% P$ f
        initArray(currG,numLinks,0);
, B7 d+ p/ D& R2 M        initArray(currB,numLinks,0);
$ p( g1 G: j# K8 h        initArray(count,numLinks,0);
6 |" q; @1 f4 L        initArray(fadeOut,numLinks,true);9 y9 ]5 s7 ?& k* A' ^
        initArray(continuous,numLinks,true);- G+ z8 z1 ~8 f, o! M) Q
}        : y# j- _- X% V0 }# |1 k$ c
function startFade(id)7 K, C- g1 H0 R2 d
{
$ C* n! w9 f" @. C% k, }7 R        if(fadeOut[id] == true)- |# o# K" p8 L1 y# }
        { /*move colour towards background colour (increment)*/
/ d* X8 s( n( B5 q                currR[id] += redInterval;
: F2 W' t# c1 _  K0 }& ?- ]                currG[id] += greenInterval;
) n5 |7 g; f+ E( [3 n' _                currB[id] += blueInterval;& ?: t1 O2 W- k2 X
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
6 T" x6 h; V9 f2 t                if(++count[id] == numFadeLevels)
' W. w1 w9 U( \0 b                {! q: e% a! L2 q; S2 Y
                        fadeOut[id] = false;
: K3 K0 d3 g8 x: t  r                }1 {1 i: p$ Z! k* }
        }
/ p" I6 T1 |  s1 I4 M& P% B        else
2 c! l# A; S. l        {
* l3 y1 F. d, J$ l: B                currR[id] -= redInterval;5 {4 s8 X. T! g
; q; X6 m3 ?# }
                currG[id] -= greenInterval;) i* ?0 P, w9 }  C" C9 u
; L0 j  a; l9 @2 R$ S! o% ]
                currB[id] -= blueInterval;' z  g6 j- o" l& J9 X& U

6 O2 w0 B) I9 i. S6 d                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);) r; x" x2 ^+ D
- E! k; R: V/ J. S4 q2 ], c
                if(--count[id] == 0)# _" `- g* _- a8 t/ e3 i

. Z) j/ z  b" ]8 y                {
$ X7 Z  x/ x( U' a* N5 w4 Z
. W% [8 o" U' p- k9 W, m0 x                        fadeOut[id] = true;& p8 A2 c! g4 Y! P

8 F2 X9 j% \1 O2 z4 S# L                }
' j. @/ V, H/ l0 C/ Z0 [$ s
$ [5 v* J( q$ Y        }# T$ Z; n$ I& Z$ ]6 J& i% e
2 j/ {5 _7 v: F
        if(continuous[id] == true)+ H/ B/ [6 V; S1 u

6 U, Y* e1 S/ _8 o% L        {
0 e' w" T+ C& _; ?& t8 k& f1 A& z0 D4 _+ u& Z# y) g/ l1 C
                document.getElementById(id).style.color = newColour[id];               
5 w: ?* c% n# R1 w$ e* v
" E7 }7 p" H$ j5 V0 a        }  }6 P- i* k1 r5 x4 u2 G. \
% B. v! i: O/ |; o" a( C
        else9 t6 x0 E9 \) }3 n- i
: C) n: D6 q) p3 o7 M% m
        {9 s: C. ]& J- }" Z

2 K$ M5 N9 R; p                document.getElementById(id).style.color = hoverColour;3 x* |: a& O- s# T, [
/ N6 c# F; f2 x5 F3 ?% I
        }
) B2 O+ W- |7 o% j+ i9 Q0 l4 l1 N& O/ I1 ^9 m
        clearTimeout(tID[id]);
& |& b: [+ i& k! |' W" b$ w# v6 L# x  H! u- ]$ g% Z
        tID[id]=setTimeout('startFade(' + id + ')', rate);
) a, C( J9 f; P9 t6 C' `8 C! B& a5 G9 d$ c; A' X8 b
}% E9 K% W% y. o3 c8 F' v+ E
0 G; f0 C; y+ S6 G/ `
function continueFade(id)
+ a- p  q4 @' O: u0 v! G7 D
. j3 D6 v2 C$ i! h8 e{3 g: V$ v2 S. U
$ p8 T/ U) s# S# Z; F' J
        continuous[id] = true;
5 }$ C$ b1 i+ L4 O/ w# c% g# T; I8 V) U7 N9 x( @& \7 S9 C
}
8 A7 y: ^" C" {0 V  w
5 m( C& Y0 O3 G. |8 Yfunction stopFade(id)
2 o* X. T/ j# j4 a# V- E
3 H9 v* h5 E2 Y6 m{" Y  M: _2 i4 D1 A* M* [

- y. V8 a4 }3 S- z' @; e# ?        continuous[id] = false;5 A1 m' Y8 D+ P9 [7 |/ l
$ g- R! v/ A/ t3 ?$ `( D0 J
}; C+ {3 f; T2 R- e' ?, O2 A

8 G/ ^# ^& {1 k' H) l9 tfunction StartTimers()& B5 w3 N8 h- D% N5 Q
& r( J- N! [7 c* H$ y
{        //set up an initial set of timers to start the shimmering effect) z# c( Q7 J8 n- v: W4 _5 \: C8 O

# w$ Z1 Z0 z2 Z) ~% r1 v        for(id=0; id<numLinks; id++)# c+ Z4 ?$ {% V
$ ^% p2 Y! J% _6 ?) s. y$ E
        {
$ q6 K) v4 {/ H8 f, e$ }. N+ {" e
) `7 w! d7 _8 h6 J6 k9 x                t=setTimeout('startFade(' + id + ')', id*100);; m1 Z3 J- \2 H: y

4 X  j3 L& V% _# T4 J        }
2 g$ N6 J% d  V4 C4 W
; a6 E, R* f0 {0 k* O}
7 t1 S+ G! w( @5 s" L( _9 [
1 W+ d4 V( x: W  I2 {6 c# y& D//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')% I( s) R, \/ M" ]
( D$ j% A+ ~' W6 K0 Q/ Y& t4 v
initLinks('#FF0000', 6, '#FFCC77');
9 c. L) a: T& o& T5 W. ^; A1 {/ x, S+ @2 y
//-->% H, S' v1 t, n# s" K4 ~/ j; e

9 y9 A1 D6 A- ?) T# T8 ?</script>
9 P: S2 Z/ [  b* i# w+ r3 m+ I- G& }9 n<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元  ~( D* G7 g8 @; d
</a>; u2 k0 r0 \2 D. }( s4 `
<br>' D' Z; N7 s3 X
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>
* E9 U# }8 d5 h/ N<br>
$ l) i% G6 T2 {' D: c, X( _% b<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a># |# }$ n: U1 n) H  O
<br>        : N7 l& }5 b! S7 v6 u7 Z$ Z, u
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>4 ^1 d, r1 @4 B- }
<br>" m+ O; ~+ @4 e# X& |" h( R
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>0 \  v5 ]9 L$ t5 p9 [: v% e0 k
<br>
2 d; U# G1 B; |. L8 [* L  Y" L<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>
, [$ X3 l% ^* j. E, R5 J) \<script language="javascript" type="text/javascript">. }" I5 L  S5 z, N7 k
<!--
# Y! q- o# d# X7 g5 D2 DsetTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
/ P$ v$ \) ?( _6 x6 m, b6 B//-->
3 e+ z* K6 @  s9 w7 Z</script>