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

zw2004

<script language="javascript" type="text/javascript">* ~5 ]1 H+ Q* \- ^5 t
<!--$ h! d5 ^! R9 t: |* O4 V1 o4 _
// convert a single digit (0 - 16) into hex1 p7 f! y: [, M. J( i7 C; y) ^
function enHex(aDigit)
1 E5 q8 S1 H; e3 M4 A+ Y2 f{: p) L2 U( M# U9 m5 a' V2 ]
    return("0123456789ABCDEF".substring(aDigit, aDigit+1))1 _) p& P9 K9 \, m
}8 n( n$ c; p' ~% n0 A+ V
// convert a hex digit into decimal
; `) l' l9 _4 b; j- Tfunction deHex(aDigit)/ p8 K/ i- ?8 n. M8 z. q
{  G/ h8 g1 z- I3 C" B
    return("0123456789ABCDEF".indexOf(aDigit)): f* b5 Z4 Y( m7 W/ M! e
}
5 A0 F# z; G! w, W% H+ ^/ K+ U- n8 k* B% c
// Convert a 24bit number to hex
" t/ v! b# Z' o, l4 }' x' efunction toHex(n)
0 R. F( k. u9 a( [9 q8 V0 \1 ~+ B3 U{% f; Y& m. P6 H4 G
    return (enHex((0xf00000 & n) >> 20) +
+ Z9 ^" P4 M2 K& \6 w& A            enHex((0x0f0000 & n) >> 16) +2 C- J2 H3 Y# W' n. I0 z
            enHex((0x00f000 & n) >> 12) +
* Y6 M( u: Q- z* v1 n8 g: \/ M            enHex((0x000f00 & n) >>  8) +
8 g' X: u1 \- Y6 \3 Q( E2 _            enHex((0x0000f0 & n) >>  4) +
: o  c1 g8 p# t( o/ d' p            enHex((0x00000f & n) >>  0))  I. w/ C& N+ s5 n
}
8 H' V/ }- n+ s$ m9 G5 ?  H) I9 e/ ]// Convert a six character hex to decimal
8 m1 g& U* x$ c# r* o1 zfunction toDecimal(hexNum)
' Z% {# r$ J; Z0 y{$ a9 i4 m) J0 }8 k. [
           var tmp = ""+hexNum.toUpperCase()( o" G1 n& G  n8 g9 E
    while (tmp.length < 6) tmp = "0"+tmp
$ H, F+ a+ Z2 W$ k3 H; Q$ ?           return ((deHex(tmp.substring(0,1)) << 20) +" t) M. c- p4 x+ K4 x
                   (deHex(tmp.substring(1,2)) << 16) +
7 H  P3 i/ q# I) X! d/ l! |            (deHex(tmp.substring(2,3)) << 12) +
- Y1 a0 j. Q4 e+ g2 k  q% S            (deHex(tmp.substring(3,4)) << 8) +8 t6 m6 Y: J+ [: H0 I
            (deHex(tmp.substring(4,5)) << 4) +' G2 t$ I* M3 J! \% ~
                   (deHex(tmp.substring(5,6))))$ [% B" X- ^) g* Z) p
}
7 s& ~9 A+ ^( }3 Y) E  O$ K///////////////////Shimmering Links////////////////////// C* ^% [. \& m; i: W" n
//global variables
6 ~( [2 B6 U/ y9 Rvar hoverColour$ _" ?/ }" F- R: V
var numLinks;7 t- f; p4 A6 |( j0 D
var rate;, h. ]# v1 e# w3 I
var numFadeLevels;4 |; f, `+ a! J& `5 l& _! T
var bgR;4 N0 Y0 A* ]% ]& D/ Q
var bgG;
) V% f. R7 E; Q# x5 zvar bgB;. M5 B( u: W6 E: Q; p
var currR;3 [" l! A7 R( _; `3 H8 ]
var currG;
  R: l6 \% g. T# a4 C) F$ Zvar currB;& W- E/ \7 u: B; C$ d/ l% B
var count;
9 y/ N$ e% |# }8 y0 yvar fadeOut;; v. s9 t2 U! n2 t& j
var continuous;1 n. I$ W. U9 G" N
var newColour;
8 g* D' k+ Q8 y+ ~! dvar tID;
! u; y' L3 j* V' q2 Rvar redInterval;
* ^& E! O! P. O" R  i0 S6 z% h' `4 xvar greenInterval;  L* i! X5 m0 G! C# d
var blueInterval;
2 ~/ ]' V; p5 Q% g. Sfunction initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
, D! U, I* R( J2 r+ h{/ B1 h4 Y9 S( c5 u& m: f
        hoverColour = mouseOverColour;: `3 M' @! D$ ^- w& n# \
        numLinks = numberOfLinks;
* Q. x5 g( o0 v        rate = 1;( r, x3 X& \) p7 Z+ h/ x
        numFadeLevels = 30;1 Y# W- b4 G" x9 c. E( ?% P
        function initArray(theArray, length, val)
2 `8 g4 j: Z( E        {8 ?, V# ?" H1 \$ I2 X/ R' l
                for(i=0;i<length;i++)# i9 ]4 ^( G7 h8 H  r0 k+ n2 z+ p
                {7 o: ^& W$ N& a1 E, w0 k* ~( @
                        theArray = val;( {& v: o: @+ G% V, ~
                }: u' k! k# ?& T9 n
        }
8 l+ P# P3 L1 k& o) y, g' D  R        bgR = '0000' + fadeOutColour.substring(1,3)' u+ {4 M7 W' ^- t
        bgG = '0000' + fadeOutColour.substring(3,5)7 P" x6 n* Y! s" Q9 @9 m0 @( E
        bgB = '0000' + fadeOutColour.substring(5,7)6 p/ L$ H) Q# F- u$ N
        currR = new Array(numLinks);: o, h. I2 ?) j5 L( A1 k5 K$ P
        currG = new Array(numLinks);: g4 Z1 [* S4 h" h- W  k9 E! y
        currB = new Array(numLinks);! b( P( s6 z' Y9 M6 E/ m
        count = new Array(numLinks);' L5 \; Z8 ^5 ~8 S9 k) E, t0 y/ D
        fadeOut = new Array(numLinks);
, a( j; {; c; `6 o1 \        continuous = new Array(numLinks);
) h. h; W* J$ u# y7 C3 U        newColour = new Array(numLinks);
' E3 Y8 V$ i" G0 ~; K1 X2 I" F0 ~        tID = new Array(numLinks);
" T$ D1 q/ A+ U) F8 c# W        redInterval = toDecimal(bgR) / numFadeLevels;
2 Q& q2 m3 A! T, e        greenInterval = toDecimal(bgG) / numFadeLevels;
$ ?/ \/ `# I, J( j8 l( B: o, e        blueInterval = toDecimal(bgB) / numFadeLevels;$ Q! M# z$ W: f" j! }; x
        initArray(currR,numLinks,0);9 m* d7 W: g) ]. f- U# a- r1 c
        initArray(currG,numLinks,0);
  A& {$ g9 q9 U% D7 Y" ]        initArray(currB,numLinks,0);
& ]. d; {4 p$ S        initArray(count,numLinks,0);& Y* e) w+ \- D7 J- L! a
        initArray(fadeOut,numLinks,true);3 r& P: _) r- t  Y, K
        initArray(continuous,numLinks,true);% O; _8 C% L5 d
}       
# k  e, x) ]( f6 N2 Dfunction startFade(id)
  I. P( {# x% x' M+ m/ {3 w{7 s' ^0 s& `5 `: {+ g: z! {$ Q2 V9 N
        if(fadeOut[id] == true)
: a- J  K  k& x1 _        { /*move colour towards background colour (increment)*/4 h' D0 s) |. N2 C
                currR[id] += redInterval;
! f% Q" k( l7 N, Y" z                currG[id] += greenInterval;- X' i5 V) @; s, h( x2 G- M1 k
                currB[id] += blueInterval;
/ y: K( v" h* I+ x) }6 \                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
# e3 J! V: E6 ]4 j3 A* h                if(++count[id] == numFadeLevels)9 ]1 K5 u6 j- O# d  l
                {8 O* j- @( Y; g  m
                        fadeOut[id] = false;) j2 B/ C, }$ n8 R8 N7 n
                }
; g, T* a+ L4 d* L        }9 o- X2 _0 |5 }3 H1 \
        else) M8 e" T/ T, D$ w( |% k% Y
        {
" P5 Y  l3 r( ?- r, Z                currR[id] -= redInterval;
+ `3 D3 {; e6 ~' N! g; P2 _4 k& g
                currG[id] -= greenInterval;, T# i% Z) ?# y! ?9 g( j2 _
/ [7 L5 k. J$ G7 q8 g* i
                currB[id] -= blueInterval;
3 F  k; E3 T1 K" Q" G% l9 X# a6 Y/ Z0 U5 m' ]
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
9 a' O5 i7 g: c8 F, b% s6 ]! t
1 J1 n6 r/ j) w; {7 m0 U                if(--count[id] == 0)* h3 M: Z! l$ K' v; d5 T; k/ ~
, c& a: s* w% I# _- A! r
                {
! w* a% e% Q: A" |2 p( B6 o' U
7 C+ C- w% D7 [0 c- J) g9 B                        fadeOut[id] = true;/ p: C6 g0 t. I- u3 P; v
  O" C4 m/ G7 M, S, G$ K
                }/ g9 U$ }! I& J: e

1 ]3 a7 `' S1 n% r        }5 D6 l$ ^7 Q  t, s* [! @: t. f

3 p+ i! i1 J' r4 M) j* F, ^7 E        if(continuous[id] == true)& C$ O$ ]7 P# w1 H& e1 y) i

3 E$ o  ]  G0 z) ^, L  {; f: Z        {9 e- N$ v' s0 H3 q; Q

6 \3 [$ {0 H! j4 a9 w$ V                document.getElementById(id).style.color = newColour[id];               
9 D, J! P2 T0 |& B# ]( d
7 U+ a, M2 r! G3 `3 E. t1 R: V        }
. L0 Q4 T7 {/ n! A* K" i. V5 n' Y. E4 Q" X0 C( C& k+ j: p
        else
# R  `: i9 u7 O; ], d4 l* f$ C! r
8 D7 m2 }# F. q3 `6 G& x5 l        {
$ p" V9 f5 o8 c9 J- g8 x& P' a2 L4 X
                document.getElementById(id).style.color = hoverColour;6 ^# w6 T# X; R2 v1 a. v, {

! m6 p/ c8 X$ e0 g: }9 ?        }3 V! \5 s) w% Z; _) ^# b3 K/ s9 u
3 i: N! M9 M: G( z* ~
        clearTimeout(tID[id]);7 B4 c$ S8 c0 X! J
7 {9 N" i! e' \% I
        tID[id]=setTimeout('startFade(' + id + ')', rate);
% t! n$ \  }+ O" t; d7 w9 t% I0 b* a8 |1 P# n* o
}
  u5 Q# L9 U" E6 |. V$ F+ w
- g& C2 n& M/ z8 V$ `3 E- pfunction continueFade(id)
, R$ z0 B' Q8 v; n
5 N! w6 e$ T$ P. \- ^$ z5 o4 o' c6 y{
; o. Q! r! w) \$ v; H9 v( Q& _, G# Q/ u- a/ `
        continuous[id] = true;
' y8 U: C5 ^! d0 L0 @5 S; }$ ^- m5 O# X2 |, n: H
}
- {: e" U8 m) g: I4 i( M  D
8 ]$ H0 S8 \  K7 y) p; T2 }1 zfunction stopFade(id), N! b3 T0 A1 J% f. s$ t

# v  E. H2 o, R& E4 G& T3 p{
' F! d4 l6 |- O( d- Q2 ^6 F
) [' g9 {& ]  W7 Y% ?. U# {        continuous[id] = false;1 G( p2 L2 v. J/ l

8 \* I9 |# s6 X7 G}. N% t4 s: I( k& j

% u4 p3 E7 ^% Ufunction StartTimers()$ S" Q! @3 R6 @9 E' q3 e4 S

4 s# N/ b: R* I8 f. E# o9 [7 x4 v$ A{        //set up an initial set of timers to start the shimmering effect1 I9 c8 g! o% A5 |. _

# S4 p( p. i4 O! F; t0 y* }( e        for(id=0; id<numLinks; id++)
6 A& N: I$ H! J$ R( F, ~* ?6 H, u! U; C
        {+ `; \4 R( A" `0 Y
! b# b0 _  b1 V
                t=setTimeout('startFade(' + id + ')', id*100);
" A& r  Y# L' c% f& x* q
! d% q9 i2 x+ k+ _/ u. N        }
3 u2 G. H% f1 w- a- s  _) |6 s  B- N4 e* @$ s2 l3 V
}
4 j; ?; i& z3 Z# n& r1 \5 T1 R0 E( l) C7 Y% ?
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')' ~- W& r4 \2 l: x1 n9 y. t9 p
; ?( \: J* @2 f0 ^  I
initLinks('#FF0000', 6, '#FFCC77');
. N+ x2 U8 `  M
. \+ g  R. t# F, L& E//-->" h, o0 u7 a. P, f& `  D& l+ x
& K, R& H) y* C; o. A( n, Z% w* l
</script>
1 K) y) a, q; X  c& O<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元
2 H9 E- [0 J' U$ ^4 ^3 O) }9 `</a>
% o& l/ v. u7 u3 J) ]# P<br>
) }' [  k2 }9 C% ]2 J8 [<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>! a6 }% i" [) y( u# r+ s7 b7 C
<br>
" O. p5 a4 \* u! O# P; n1 A+ Q<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>% w$ z6 E* R5 o8 ]1 s0 @, S: k
<br>        5 X  m, Y( }, K6 R/ x& X
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>" f7 N$ E) E1 H$ l* w  x$ L, P. I2 Z
<br>
! D/ A6 ?( |  q1 w) A3 J) `$ T/ |<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>2 e, d: G1 @8 z6 Z* |
<br>
5 {( X' ]5 L- z<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>. F9 w& h* ~) {; e
<script language="javascript" type="text/javascript">
5 J3 q7 u/ r; _1 Z<!--
/ H3 E% o/ ^+ f- p2 csetTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering* Q8 R  t% C0 `$ D3 ~9 C
//-->
! B' e0 m0 W; T</script>