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

zw2004

<script language="javascript" type="text/javascript">" v1 y/ k* d; |7 B+ m: X- E
<!--
  g9 E; m' v& D, y- ^. R# z// convert a single digit (0 - 16) into hex- x4 f6 a) p- P+ t
function enHex(aDigit). _% b4 b& \2 P; A4 C8 B& D
{) Y; T3 n; G4 @- p) E; I
    return("0123456789ABCDEF".substring(aDigit, aDigit+1))5 y( s4 M5 N8 c, u0 a
}
- s: ?5 T* g$ @/ S. u// convert a hex digit into decimal9 E9 E, k1 |& f! L; C- C4 H9 v
function deHex(aDigit)& N  {  ^2 W- ~0 Y
{6 C" P" r+ b- T) Q$ m* @1 |
    return("0123456789ABCDEF".indexOf(aDigit))
9 |) X7 ?9 c- q! |  {  C/ j' l}
: s4 J3 O9 @; {# V- u! k- s" P) ^$ {& o; A- m% t1 F
// Convert a 24bit number to hex
/ P- r. f# P( I% e8 d" Jfunction toHex(n)
. `8 y$ G$ j, m( {. Z% C  q( p- o{" ^, z% @3 h8 Z0 z: ~4 M. ]
    return (enHex((0xf00000 & n) >> 20) +
3 x% _! s9 x3 X            enHex((0x0f0000 & n) >> 16) +  j8 V1 z5 D' W- B
            enHex((0x00f000 & n) >> 12) +
. z2 Z5 E7 s- X9 [) D- [9 R3 A            enHex((0x000f00 & n) >>  8) +0 ?0 y1 w) {* N* |# Z
            enHex((0x0000f0 & n) >>  4) +
. v  i2 ]* X% [            enHex((0x00000f & n) >>  0))( D4 b; G- P7 e
}. g/ ]4 j: B2 ~! p+ f! I$ C4 L# n) n" D
// Convert a six character hex to decimal$ W. e: G0 f* b* o7 C
function toDecimal(hexNum)
; h& l2 {; ^7 \/ V4 B{
1 W$ \' t9 Q; T4 O+ f9 y1 e$ _           var tmp = ""+hexNum.toUpperCase()
! C) E: ], n6 G8 D9 J    while (tmp.length < 6) tmp = "0"+tmp) U: Z/ A0 Q' Z5 K) s( l
           return ((deHex(tmp.substring(0,1)) << 20) +( X4 A  P' z6 H+ w
                   (deHex(tmp.substring(1,2)) << 16) + ) Y0 u# c( g) |3 @9 N: a$ A. A
            (deHex(tmp.substring(2,3)) << 12) +
" @& f2 x4 P, ~            (deHex(tmp.substring(3,4)) << 8) +% j' ~+ q% Z5 z
            (deHex(tmp.substring(4,5)) << 4) +
* v# G" N' w& A% H8 r/ O' u                   (deHex(tmp.substring(5,6))))
5 q; q3 L+ c9 c( X* D}
8 b' ]) a+ `9 a2 ]! m///////////////////Shimmering Links/////////////////////6 Y8 `* @8 e2 Q
//global variables
# I# V& ?4 c5 I8 Y% Kvar hoverColour
& G% ~" e9 [7 B* |' ^: j" Nvar numLinks;
' V5 J) P- ?  l+ c3 fvar rate;' |( E1 O- l% t& Z
var numFadeLevels;1 X' R9 W/ F. W8 w1 |
var bgR;; z& k& N0 Y+ m+ q/ Z
var bgG;
3 `* d/ V+ w, o) N0 Z7 d: |5 ~var bgB;8 P9 a) D! w8 k2 s9 a8 ]& x! _
var currR;
( u: G+ _/ {" R0 w; t7 lvar currG;
4 z+ F; T. m7 u' \4 h& [1 c' Avar currB;
) o9 b6 u7 u/ Y; k$ i/ k2 ^var count;! \0 ^8 P. `/ l$ Z
var fadeOut;. B8 ]5 V! K0 ^" n' V
var continuous;5 p, E/ {' w! ]! W
var newColour;. ]9 m$ s: O& [/ _. @
var tID;
9 k' \# o5 h9 qvar redInterval;# q2 }( b+ J' c- O* T/ H
var greenInterval;
* W9 S( m4 d( Fvar blueInterval;
0 x4 @" }) @' `  e3 `7 p4 afunction initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
: A9 m3 ~8 D$ U{* @7 k4 M- ]# O7 ]
        hoverColour = mouseOverColour;
) P+ {8 H. L( g" Q! V9 S        numLinks = numberOfLinks;
3 w+ Q9 K& O0 |- L. |        rate = 1;) P, K5 f% w' B8 E1 _8 j
        numFadeLevels = 30;4 |* t" c  U0 C
        function initArray(theArray, length, val)' F  S9 t' E% u2 e, G0 l
        {5 E) s5 H7 g% |1 Z* u
                for(i=0;i<length;i++)0 v/ z- v5 u  m$ j, n1 p- Y6 l
                {
5 e( J. i" R& \) @6 i9 Z8 |                        theArray = val;+ H5 d4 b/ M& j+ i, K/ K: @. S( Y4 H
                }
4 {9 S1 ?& l8 i* Y& J        }8 A# N0 Z% G6 s1 @. w  U  P
        bgR = '0000' + fadeOutColour.substring(1,3), R8 ^) S9 V/ @9 Z( |
        bgG = '0000' + fadeOutColour.substring(3,5)! X1 b: z( }4 l7 y) \' E8 m
        bgB = '0000' + fadeOutColour.substring(5,7)9 f& X' w- v& ]' J' G2 U
        currR = new Array(numLinks);
# R6 y! P' Z; Y/ v# b! t, n        currG = new Array(numLinks);
7 {: K' Y* X7 S' K        currB = new Array(numLinks);# v9 g* E8 U$ u0 m0 L
        count = new Array(numLinks);6 Y# H( t- W4 [+ n- s+ z# U
        fadeOut = new Array(numLinks);& j3 O/ Y( x9 q6 [0 i- n+ B( |
        continuous = new Array(numLinks);8 [' p, V1 D' f
        newColour = new Array(numLinks);
; E0 I' g9 K/ |+ B8 F. k, E        tID = new Array(numLinks);: N/ x. T2 `$ x" ^. \
        redInterval = toDecimal(bgR) / numFadeLevels;, N! \; t& B- O. M/ i" H
        greenInterval = toDecimal(bgG) / numFadeLevels;% Z1 i) S2 L$ _" F3 y
        blueInterval = toDecimal(bgB) / numFadeLevels;
8 e% G/ H5 A- C- S        initArray(currR,numLinks,0);$ O5 j0 {1 m+ g* R0 `+ G
        initArray(currG,numLinks,0);, y8 u7 C- R# w/ z, k1 O
        initArray(currB,numLinks,0);
+ |9 E. d# h4 i0 ?. r( S        initArray(count,numLinks,0);
  e7 R, a5 y9 G% i" k$ z% j4 ?( y        initArray(fadeOut,numLinks,true);: W1 ?/ X3 _2 ~  j/ F  P
        initArray(continuous,numLinks,true);
: B2 Q; ^& |/ x}        8 ^* @% Y9 R, Y1 l9 i9 A7 U9 _
function startFade(id)
  @( x, s1 L0 _{
" {0 Z& J. Z3 m! G" q! X* k        if(fadeOut[id] == true)" @$ m; Y7 S0 \2 K
        { /*move colour towards background colour (increment)*/- k2 l, N' l* ~4 L7 I
                currR[id] += redInterval;
  ^, C6 r  h& r7 B                currG[id] += greenInterval;# j- {9 {$ l  _2 A7 p7 j& J1 F
                currB[id] += blueInterval;1 J# K! y7 d; i* |( @0 q4 m. X
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);0 p! c1 }+ Z+ k5 p& q+ U7 y3 w
                if(++count[id] == numFadeLevels), @3 M" Y% x2 N, J# x" ]
                {
- @5 `) U% @0 l6 e2 e+ H                        fadeOut[id] = false;
! {, G+ Q# T; {4 g2 H                }1 p4 [2 O5 v. Z
        }0 E4 n0 v; h- f. h
        else
3 r) d( z. R8 e        {! I2 e+ T, U$ x1 K6 z: g) A4 c9 [
                currR[id] -= redInterval;" A7 k' s6 D* S# X8 i7 x  ^

, r; N: l! p1 `5 W+ e                currG[id] -= greenInterval;9 b3 K, D4 e2 F- L$ ^1 M% |
" x2 H7 n5 Y' b8 Y0 F. L! g
                currB[id] -= blueInterval;% N& l; a  ?* t

* B' Q0 t$ u: Q! m                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);, Z8 n9 {) a! z/ C9 r# _
* j$ ]1 ^! s: F5 n5 e3 R
                if(--count[id] == 0)
+ ?5 Q0 g0 y7 F& D4 p4 G9 \" U
9 w3 J( `0 _+ a% ^$ T% `* E                {3 o! F6 |& t% C$ D

# o3 \2 ^1 E& p; {% i( p; f                        fadeOut[id] = true;
7 O* n; `, C2 z- l9 I+ l: R8 F3 k: m6 b2 e) g  w* N
                }0 O: U( h) r5 w) @3 ~

! J6 s& A8 f% O, K; J: u; \        }) p/ E3 F" z5 V$ u8 f
9 D' u6 z" k: J; o
        if(continuous[id] == true)
7 J1 K4 l! [" z6 ~8 \+ ?- H7 }7 h+ S# ^; m/ U) |5 c) S
        {
  [$ N/ w; \- Q0 ]
7 |9 v0 w; S: S- Q' n                document.getElementById(id).style.color = newColour[id];                ) ?! \/ V( B. g1 ^6 `8 k/ [3 H( g. a! E( n
  ]! A, J# C9 z: B4 E1 B
        }- [' R* U, B& e+ {# O
  r$ q$ A! Y+ a' O# B- ]" F
        else
& t: A, x, \) X. r
, ~( g7 j& \3 R        {4 C# \+ P! v/ S+ d6 ?; y- i
  l3 A# X3 m! Y8 g
                document.getElementById(id).style.color = hoverColour;! I% f3 n5 ^( v: H( G
" H+ d/ j8 w5 W7 [' d& y  N
        }
+ N; R# {1 _0 x7 d. {6 q1 y8 X# L" {
        clearTimeout(tID[id]);1 Q! c/ E8 D3 g5 |
  @2 \/ l( k: [6 _9 ~
        tID[id]=setTimeout('startFade(' + id + ')', rate);
  Q8 M1 N3 m1 A# _5 f* p" b0 s' |: ]6 U; C: q5 k; I6 T
}5 `- z( X! r, c0 x4 K  ?6 H# e

4 _6 c" }+ L8 m1 Bfunction continueFade(id)
7 z- ~3 q9 M1 ~8 s7 B& X% g
6 S0 m! h- h, C. d6 m( l{8 }6 |( g8 @8 H( c" Y$ C0 q& a

6 v* u1 \( X9 l4 p5 \" I" ^. k        continuous[id] = true;- Q5 z9 B! ^  P( W! \6 y0 }: `
$ P1 L, c' S. T$ e2 v
}$ k# U! b4 E1 O2 G
. O# ~1 B0 [+ e. \' J' Z: u
function stopFade(id)$ O- E6 F5 p' N4 v) g

2 [" P) `9 u/ }{  ?+ P! l. }, r: K1 H- |+ ^7 F

2 Y" |) i, ]3 c9 ~8 u. n        continuous[id] = false;
+ w8 R' i( E7 E& \
  k4 ], p9 Q* D7 S& C}& m2 T, F/ b  N5 S  d
- G5 Q( L" [3 y9 [2 b
function StartTimers()8 k0 k& X" t2 P9 P0 E
+ {" q* C  T2 Q2 \
{        //set up an initial set of timers to start the shimmering effect
4 K+ g0 J8 v2 ^2 |, K+ s2 ^# u! t! _" b$ G7 y3 k
        for(id=0; id<numLinks; id++)0 u% j  {3 J- y: z3 ?
& N0 C; {9 p8 Z5 ~0 Y
        {. y3 L; P" b( t1 k1 X8 E) A
$ q: x  f0 E' P8 X
                t=setTimeout('startFade(' + id + ')', id*100);4 X! Z5 S* G. s2 x2 {/ O
: z; z2 D* u, `( `' L) g% y
        }$ k" g& i- e0 c
# q- A9 A) a) ~7 F5 y3 w
}6 C0 |3 X: c3 k4 q7 @' x0 F( I

/ O9 i6 ~; m. a& w# w! }2 l//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour'). ?$ u* Z, i/ b  [$ _$ X

4 V) }+ r; O. L' N8 hinitLinks('#FF0000', 6, '#FFCC77');
# x3 Z2 c* t3 ^' v, D* v, ~: [' ?" u* H8 J9 @) l; y) w
//-->4 _/ _* ?) ~. x

' c' _' f2 @! s# m* A</script>
8 k, Z* m3 b, J5 Y<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元; k1 m" z. h8 c% d- X$ \
</a>  s  G: g, C- W1 I2 M) E  [  c4 H! X
<br>
) s5 i5 G) ]; ]& y1 s9 O* G- K$ t<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>4 ~4 z( l1 ~8 z% C% }& M9 w
<br>" a! ~$ D1 B$ |6 a8 S/ @* U) ]5 q  y2 i
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>: K, C. C; y: M' H$ o4 f
<br>       
+ ^0 P# o- i/ X' c: _6 {' ~$ g<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>$ c5 o1 c. |7 h4 V8 }2 s' L. Q( z: d
<br>
1 x+ a* U, e7 y6 c* l<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>9 N* X! ~" G& ?8 ]6 Y0 U& }
<br>9 J2 B* e* u8 t# k5 o' \
<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>
; \' M; ~# I) l& c7 k* p<script language="javascript" type="text/javascript">
" z  T$ z1 ~/ T9 H. d+ g+ Z) R5 T<!--& [7 o& t& U- _6 C. A. U
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering! _: {9 R/ y1 {& N
//-->$ ~; S7 m; B+ i# z5 E8 }
</script>