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

zw2004

<script language="javascript" type="text/javascript">
, d4 _$ R# y' o7 V5 h5 Y, p<!--  T- G' u; m4 j$ J: W
// convert a single digit (0 - 16) into hex
7 F) L: W  ~" `function enHex(aDigit)3 c6 P+ X+ s7 \7 ]5 R2 s
{
- Y( D, F/ d% O, x    return("0123456789ABCDEF".substring(aDigit, aDigit+1))" P# q5 K& V3 X( X) t
}
8 }3 c# r) l- e* C/ D; ^% L// convert a hex digit into decimal
8 Q- J7 d+ i$ Afunction deHex(aDigit)
0 g$ J' ]& ~/ ]" z5 F{
& F- O* Z( a! x( _# C    return("0123456789ABCDEF".indexOf(aDigit))
* l3 A* P3 Q. R6 H}8 x  r# ~$ o+ G5 L- K! z* O! U1 y

, j+ Y: r4 w! m8 Z6 ]9 a// Convert a 24bit number to hex7 p% @* }% {  F( l) \# J4 M; Y
function toHex(n)
$ M2 n+ r! R5 x6 q/ C3 P0 R{* y: h1 V" m6 |- z' c! Y
    return (enHex((0xf00000 & n) >> 20) +% l1 e: X: w$ L) w  P! y) `9 X
            enHex((0x0f0000 & n) >> 16) +
; p4 z9 }. f! f+ I            enHex((0x00f000 & n) >> 12) +
" N: B' z" {( j: R. c5 R            enHex((0x000f00 & n) >>  8) +; \3 X  K, m8 I! m, p3 C( c2 {
            enHex((0x0000f0 & n) >>  4) +
! X9 ^6 X3 @# ^+ |5 n            enHex((0x00000f & n) >>  0))
0 j: f9 x$ N, W}: a% @8 N9 ?$ c) H. @  r
// Convert a six character hex to decimal
& y7 x7 U1 S  e: b; |function toDecimal(hexNum)8 I! X6 E0 e' V& J# @7 n
{
* Q9 ~1 t% u/ J0 A; N( O           var tmp = ""+hexNum.toUpperCase()
: k, U% e* m5 e' `    while (tmp.length < 6) tmp = "0"+tmp
8 J+ K3 d: [, A7 S3 h, I0 m           return ((deHex(tmp.substring(0,1)) << 20) +
/ n4 f) S% u3 R" K" n                   (deHex(tmp.substring(1,2)) << 16) +
. u* S# ~9 U3 O% {6 x- q            (deHex(tmp.substring(2,3)) << 12) +1 n) \% u8 i0 l5 P: T0 ~
            (deHex(tmp.substring(3,4)) << 8) +
4 M8 M* n) [: U) v5 U: E            (deHex(tmp.substring(4,5)) << 4) +* Z) a0 W/ r) p, d7 D" @
                   (deHex(tmp.substring(5,6))))
" N/ H2 n3 f! Z2 @3 L$ e( Z}4 T$ g9 g  @# {9 E5 |) ]4 i
///////////////////Shimmering Links/////////////////////
/ c5 |) z9 s. n, j9 l$ W//global variables% d  U7 V: T; R: D1 ~* n' p
var hoverColour
- W; [* g! \0 ]var numLinks;/ {+ b3 |. U- l$ U6 X! B" ?
var rate;3 t, B* o6 {- N) [* ]( w3 L
var numFadeLevels;# D6 |" j% _# m' B1 t. e
var bgR;2 k4 [; V& D7 @* ?* p7 A
var bgG;
) A+ S$ k8 S: Z- W, h# d) f8 X% Kvar bgB;
3 f3 `4 _/ @/ ~var currR;
9 n! g2 N/ x% N% f5 m* {var currG;. j; a, |( Z) Q. g
var currB;$ k; x/ k# U" ?, z. K' ^
var count;
5 [4 g, s: o3 _1 Zvar fadeOut;
2 T; l" j: N  H2 Zvar continuous;
# i7 j5 N4 N0 p8 ]( \3 Bvar newColour;5 B2 _" J; b# \( O- B
var tID;
3 b6 R3 ~9 l+ ]7 Vvar redInterval;5 ]. h) E2 a4 @' ~' m2 r* t1 F
var greenInterval;, i. Z# B9 i/ ^$ c4 ^+ h5 r1 v
var blueInterval;: ~0 ?! n4 m) B5 h$ x
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
- R, G6 P7 d6 P% _" U{
- ?8 _$ N2 x5 |3 C5 Z        hoverColour = mouseOverColour;5 [. i/ W  Y8 L2 g2 K: V8 U9 S0 J
        numLinks = numberOfLinks;
" g& R$ X  k4 B' U        rate = 1;
7 A( H/ y5 b7 ^- F% y  o        numFadeLevels = 30;/ ^7 M7 `8 B/ I+ d" K, s$ ?) p
        function initArray(theArray, length, val)$ \* N& Y' Q5 O
        {
2 _/ }# q1 E: g1 h* Q$ }                for(i=0;i<length;i++)
% N6 h9 E1 ]& E5 g. \9 ?7 ]                {4 z( q4 w# @8 I) `+ p( C9 I; Q
                        theArray = val;0 \2 T: }9 O5 N
                }' Q% F, H& d" c4 K) D( E
        }: Y' [+ t- `8 C" [% c' i" Y. e
        bgR = '0000' + fadeOutColour.substring(1,3)1 P( ?2 P2 S  C( E# d% @8 C
        bgG = '0000' + fadeOutColour.substring(3,5)" ~0 P) P+ `/ c  V7 C" j! O1 Y
        bgB = '0000' + fadeOutColour.substring(5,7)
" q1 ?% @; Q& G$ m( ~# G9 A, k4 N+ ], Y        currR = new Array(numLinks);
! m( y" |% x6 x- P        currG = new Array(numLinks);" C8 ^, F% P9 J" Z
        currB = new Array(numLinks);
0 c& h5 S2 y0 [, Y        count = new Array(numLinks);3 C# r' F* v! ^2 H- \) o7 ], n
        fadeOut = new Array(numLinks);( H6 v9 B1 ~% W6 a1 Z' K+ N9 q  O6 [
        continuous = new Array(numLinks);, u, W  z; d, I# B
        newColour = new Array(numLinks);
$ x, l% t  {5 P7 y; ]        tID = new Array(numLinks);
! U- j: }8 |3 w% Z3 Z  W        redInterval = toDecimal(bgR) / numFadeLevels;
7 S/ j9 b* L% a5 ?  E% b        greenInterval = toDecimal(bgG) / numFadeLevels;
7 j) h9 k  O8 P+ u3 h: m        blueInterval = toDecimal(bgB) / numFadeLevels;
8 P: D. ?1 y7 M        initArray(currR,numLinks,0);* U3 X$ S% M' L" D( X% J
        initArray(currG,numLinks,0);
% y' U/ k! R' K        initArray(currB,numLinks,0);
6 ~" C" J* f1 o0 W2 D: o% _# i) r6 t; _        initArray(count,numLinks,0);
% R* o5 M0 T7 z: L4 R. G% L  U        initArray(fadeOut,numLinks,true);
) C/ S+ [9 M4 r. R6 S4 z        initArray(continuous,numLinks,true);5 ~/ H2 l7 ]% \* g, S9 \9 m) }3 Y
}        * l# C7 f" n% [$ K
function startFade(id)
+ W; N6 a2 D7 u/ g# g) Z{
8 h! O( ~/ O. r% G# B3 B0 o+ u        if(fadeOut[id] == true)
6 |8 N9 \5 Q5 F1 d        { /*move colour towards background colour (increment)*/
1 }) h5 x- D& K+ q4 t- k$ ?                currR[id] += redInterval;! R% b- X2 ?; U. K% [
                currG[id] += greenInterval;
' c, O6 L: f& H$ {2 p+ u( i5 H0 r                currB[id] += blueInterval;
8 ~6 F9 ]+ u& |5 e                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);8 E5 W+ a" J/ a( o; e9 Q
                if(++count[id] == numFadeLevels)
( d# k6 X' ~+ N  A7 d                {7 \! t' K' p) h8 K$ m! ~+ ]
                        fadeOut[id] = false;
! H; {4 p* r; k/ N7 n! x8 j                }
! j) q) H( ^( o! w. s6 y" O, a        }3 U; J1 c+ b; G
        else
% Q" w1 C, \1 }+ \8 @+ m        {- m) B( }9 O. C' k& a6 S
                currR[id] -= redInterval;, R. y/ X( U9 G; o; X
' n+ y# Y7 K) k' A2 @
                currG[id] -= greenInterval;
* b! P. {. L+ m! W! t
- v$ A* N6 n6 z* M  l/ z- P$ H) L& o                currB[id] -= blueInterval;
) X  z) J9 ^5 |: y
' U8 ~0 J' d' R' Y7 W  R                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
3 ?1 D$ L$ e% n( `' A7 n2 l9 {5 x; t  S4 B, S
                if(--count[id] == 0)/ Y* o$ O- a; D& r# {, S4 p& k

% H8 x  ~( s2 W4 Z8 k                {9 B( O$ H/ {# p0 k

9 P3 X! o3 h7 ]6 h+ e6 E                        fadeOut[id] = true;# W8 l9 E6 C8 s  E
% _4 g# t, z- V
                }. x; p: u) L# Z  W0 B8 [9 `* j% o
2 R3 K" ^: n( B$ ?- x, B
        }
  v. T+ @2 H' G# y! f' A+ t4 S: V  u! c, |' \0 c, q
        if(continuous[id] == true)
# ?9 b$ E& T: L  h9 K" J  F
5 T& t6 n2 ^) H        {3 W7 Q2 Z, a" D" P7 |6 S' W

; q. w9 C; |6 u                document.getElementById(id).style.color = newColour[id];                " b- c( }6 |" ^/ V7 D

- G2 P5 R/ @. S/ u7 {  J0 T$ m        }
  Q6 }" p) H0 Z' V1 _6 ?
+ x" h  m* H; u( n* v; b8 ]        else
$ U3 ^9 W4 @- Z3 s7 x* n2 R( \0 V1 q8 r) w1 J
        {/ Q: N9 S% t7 N0 _. F
) ~$ a9 z9 K4 M% E+ Z
                document.getElementById(id).style.color = hoverColour;
* L3 f+ B, ~! u5 _7 k3 V
& i% t1 [6 j3 k% K4 V) y9 ]        }7 V* w  Z% O' `

: X3 q; k( n# |        clearTimeout(tID[id]);( W) x* U: T( R4 d, O
! `! @7 }! ~% Y
        tID[id]=setTimeout('startFade(' + id + ')', rate);" }3 N% i- ]% W- N% j

  e  r3 Y1 |5 B8 p  `  D}
% j' B  e2 ^, u# k' _5 J, B# A# y5 O7 U. L& y: D
function continueFade(id)9 e% B$ j5 y8 V2 x

' x9 L- q7 Z5 [8 Y" g% p2 D; i{
) h4 A$ r- `$ x- M- X) h! _- b/ o' U) J( |6 x) s& b
        continuous[id] = true;
* q% D! X0 U# G8 _4 }
" U0 e( A7 j7 E5 `}
2 V4 f# M; P6 O
+ b5 b3 g+ e1 ?& z$ p7 X+ I; Y0 cfunction stopFade(id)3 f# U! G& a; g5 d: Q
# O# v, g( Y1 _( k) _: ^
{0 _( F2 P4 K% n4 V- g
; v: N4 y/ a5 P2 v/ v- c  Z
        continuous[id] = false;
1 y9 |: @+ w. j8 }' Z
) i4 x- E8 ^. Q/ ?8 _) k! N}; k4 P) J! H8 ^) a! @

* L, Y1 [8 Z  j: x8 vfunction StartTimers()
/ N9 L. ]1 Z: x
9 [8 I' g2 g* g4 i: {0 y4 m$ L{        //set up an initial set of timers to start the shimmering effect
1 l* @+ ?- z7 F2 e8 ^8 K# Q+ T: M) h# b# V: R6 g, e$ O
        for(id=0; id<numLinks; id++)  _9 {: }- a! x7 f
# ~' T+ g) I: T' O& }8 p0 y5 l
        {
8 k4 {- `' m( z+ d7 a* F; R! F. v
                t=setTimeout('startFade(' + id + ')', id*100);
9 l9 l! v' x6 S1 I% j9 }% u* C9 {0 y' Q7 g
        }) o  g$ l- g* ^

" t0 A3 N; I' P}
& {% L5 v8 y! v3 X
* n4 r) }8 e0 P//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
8 o( l, q7 Y$ U2 [4 ^% G6 ?6 ]% G% W! k2 Y& X% N* D, O
initLinks('#FF0000', 6, '#FFCC77');
1 H7 K" G7 n7 l! `6 ?. p* o% r5 n2 ~4 z. e. C. D
//-->; p& @9 {6 U& X+ U" G1 W7 @2 x
* t: y- J* {8 x; |6 ]& `; u3 c5 f$ C
</script>7 P* @- K, I) {; W2 f) T, d
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元
( R7 b- N. w3 I7 q2 _* L</a>+ R$ u% i/ W$ u/ t* {% H/ J
<br>2 V1 x9 f; ?$ O* W- q2 y5 t, P
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>, z( u. m; s' \9 g+ Y$ j
<br>
3 u9 x+ U+ o+ m4 l' Y9 X<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
+ l! K3 x' [5 `2 d9 R& V) o<br>       
' \( P/ k! L% u9 \1 X1 N* Z8 l* W<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
- B9 ^/ q1 G2 o! z5 _<br>' [6 S5 C0 M' _. B- \/ ~
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>  N5 H, ?4 }6 C( Q+ |4 w* ~/ m
<br>
/ H" @9 Z3 `$ a) F7 b" U4 m& q7 {<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>
) U" y$ }3 e5 X, n4 S, H) G<script language="javascript" type="text/javascript">
) H4 `4 j0 j. e3 P$ S& F; J<!--, {$ {! U; R$ [. D0 ?- S1 g/ v
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
( B; v2 o! s; q6 L  D, A//-->$ w- d: |0 o) G: E
</script>