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

zw2004

<script language="javascript" type="text/javascript">& i# H4 q- V. Y! X8 R6 }' a
<!--
$ d8 n( E: [# H5 y% T4 h// convert a single digit (0 - 16) into hex* t- s- R$ `; `+ ~! ~' f
function enHex(aDigit)
. v8 k* _& ]* z. B4 C{( p9 U3 _) y- G0 S  [
    return("0123456789ABCDEF".substring(aDigit, aDigit+1))
! s; Z9 @" \: b! Y: k}2 w0 Y* x- N! Y- K. U1 T
// convert a hex digit into decimal
- z; P! u7 t) p( G4 {function deHex(aDigit): w, W- K. h$ e8 \' o; Y
{
( G6 h0 W$ h+ y; z' z. P    return("0123456789ABCDEF".indexOf(aDigit))& a# C" z8 b4 ~- F( n
}# {0 d6 t7 B8 H- S. Z
6 U2 ^3 }4 A% \
// Convert a 24bit number to hex/ b) ]5 k  U, H% s- C
function toHex(n)1 E( k8 j7 A' w: J( X
{6 Z2 E% c  A, f# o) x
    return (enHex((0xf00000 & n) >> 20) +
6 |$ d8 |4 q) d, D            enHex((0x0f0000 & n) >> 16) +7 o7 V0 a! {3 L, i( s2 j
            enHex((0x00f000 & n) >> 12) +
3 p: E2 Q' H. ~: Z9 r' B2 b. F            enHex((0x000f00 & n) >>  8) +% r' T7 R' C1 [; n
            enHex((0x0000f0 & n) >>  4) +
, t/ b, {* C1 X- o# _6 w! [2 \) N            enHex((0x00000f & n) >>  0))
$ }  o5 U  t7 {" p! H}% a! N: N7 \; f
// Convert a six character hex to decimal
& G# J7 T2 F8 a, Dfunction toDecimal(hexNum)
3 m+ j8 n4 f5 h+ k' u{. X5 X( f8 n9 G/ ?2 J1 G' ~) G) S
           var tmp = ""+hexNum.toUpperCase()
; ]: e2 Y" n. h0 j    while (tmp.length < 6) tmp = "0"+tmp0 `& U4 f# }" Y' |2 v( o4 v. x
           return ((deHex(tmp.substring(0,1)) << 20) +
7 p  p% Y% P+ t$ x8 U                   (deHex(tmp.substring(1,2)) << 16) +
' ]! J/ ?; @7 x            (deHex(tmp.substring(2,3)) << 12) +# T8 J: N: Y; h
            (deHex(tmp.substring(3,4)) << 8) +' T; F$ I$ b; v( ~/ X
            (deHex(tmp.substring(4,5)) << 4) +
1 g8 S; ^: R! V: u$ f/ l/ l9 W                   (deHex(tmp.substring(5,6))))4 y: ?1 w) F, O- `, J4 f
}2 C# W$ T. O% R; [2 ?5 \
///////////////////Shimmering Links/////////////////////( Y; g, b' C1 r: z$ D2 G
//global variables9 o1 ?4 c! ]1 R
var hoverColour5 p1 t# g2 @- |; F# h; Y' |8 y
var numLinks;
) X! z% L# a0 F" w5 C+ H& v2 A2 jvar rate;
; w+ l* C1 s' m4 b( {4 uvar numFadeLevels;
  P5 Q% V. ^& z* {( wvar bgR;
# C. U7 G1 J2 I3 G, wvar bgG;- c  ^$ T6 u+ Z. n" X+ c& \
var bgB;
# E8 T: _# |! s* G% i# _' Tvar currR;( e: j# {8 Z7 B3 Y. @
var currG;
2 `7 N7 W& q) T2 P7 Mvar currB;/ s; H4 t4 t% E! L
var count;( w$ \5 Y8 _* e, j) B
var fadeOut;
: u" {$ w! P) i0 @0 bvar continuous;6 R: y& }' Y) V3 y8 Q! R
var newColour;
# Q! d" Y/ m& k' ~- ^var tID;  B3 ~- d! v1 e2 W* J6 D; n
var redInterval;
* E0 L% ?# d, ~9 Evar greenInterval;2 b! u; S8 `" v$ W0 y( D
var blueInterval;
/ }0 p% `% Q6 o+ c' Lfunction initLinks(mouseOverColour, numberOfLinks, fadeOutColour)7 K7 o& U9 x+ j$ k2 r1 K5 ^
{
6 X' E" N+ \4 g# Z' H) N6 h        hoverColour = mouseOverColour;
6 E: {1 v$ }+ V5 C' f        numLinks = numberOfLinks;* m: W8 Y. q4 s$ T3 f. S) A
        rate = 1;& [3 k2 {+ e+ C  i
        numFadeLevels = 30;
  t) N7 r; z. M2 ^2 S7 o! P        function initArray(theArray, length, val)
; ]- y5 Z$ d) `+ S% x( c        {; a$ J9 g- _+ n3 N; O$ X
                for(i=0;i<length;i++)3 p& S  s$ G9 U! k
                {
' I* h6 m2 ]2 r5 Z  p                        theArray = val;7 R7 V; U) l( @. I: r; [
                }  T/ b# {& h( H) N/ `
        }
0 x/ I& V8 n( N: e" m: t  y0 t        bgR = '0000' + fadeOutColour.substring(1,3)
+ I) L! u6 U0 X' a3 j        bgG = '0000' + fadeOutColour.substring(3,5)
* ^. m$ U9 T& ]& Y9 D        bgB = '0000' + fadeOutColour.substring(5,7)$ v; G) V" h: g, E
        currR = new Array(numLinks);. T: ~/ v" y7 K' i8 u
        currG = new Array(numLinks);2 Y9 l: e! p0 c3 l9 u4 n- i
        currB = new Array(numLinks);2 b0 i8 V5 `0 h% r
        count = new Array(numLinks);2 \# d( |" z7 |1 x( @* g; _
        fadeOut = new Array(numLinks);+ z% l8 d1 ^4 R$ Q& g) p
        continuous = new Array(numLinks);
7 V8 Z8 J. a" U; L* b4 O4 r        newColour = new Array(numLinks);, B7 g. V) ^' L( _! V6 R" P( W
        tID = new Array(numLinks);
% [2 [4 Z4 [! l0 y" \        redInterval = toDecimal(bgR) / numFadeLevels;% [4 C/ b, R  Y  \8 F4 i, `
        greenInterval = toDecimal(bgG) / numFadeLevels;5 s$ E. P% ~2 [) G5 }, q" o; l0 x
        blueInterval = toDecimal(bgB) / numFadeLevels;
0 n1 }3 {2 h+ B# B        initArray(currR,numLinks,0);
( e: q6 O( P$ R; K7 u! h        initArray(currG,numLinks,0);) f3 h5 Q% _4 H$ p/ ^3 \% }7 _7 [) e
        initArray(currB,numLinks,0);7 ]. k6 u) F3 f/ S( _0 u6 R/ k
        initArray(count,numLinks,0);
. W; Q# l% ]: t0 O7 Y0 i; F        initArray(fadeOut,numLinks,true);
7 ?) i% H$ G% L3 K        initArray(continuous,numLinks,true);6 T7 m* A9 K# f! c0 F0 Z
}        ! R8 o% ^  w3 b% }
function startFade(id)4 X$ X1 O0 ], P% l  }
{
# q+ c1 x0 j3 s0 q! l4 s        if(fadeOut[id] == true)- p' J4 g: z2 H. O' c& W  ?
        { /*move colour towards background colour (increment)*/
+ L6 C0 `5 |6 ?. F; U" x5 s                currR[id] += redInterval;
5 r/ y2 k( f7 c3 D1 ^9 e' v% q                currG[id] += greenInterval;* s& V& F( @6 J  W; J
                currB[id] += blueInterval;
$ h+ ~8 ]# @* c- ]$ Z8 W( b                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);( }; t3 {' t8 t+ A9 y: v
                if(++count[id] == numFadeLevels)
! f2 R, V3 B' K                {
0 T- c5 d  n2 V$ F/ `* F0 v& l                        fadeOut[id] = false;: P6 m5 N' W' ~# V; e4 O/ V( M
                }  ^, E: u3 l, {, I
        }
3 u6 I0 j3 B) m; D+ d6 A! z        else
9 C. ?( @% ?& l' }/ t        {, o! Z; i& Y7 I. H" @4 V
                currR[id] -= redInterval;" s: b+ s5 V% A

, S% o% T8 O- G  s                currG[id] -= greenInterval;5 N  J/ z9 x  v( v( v$ k
2 i- G3 c8 c% L4 s* l" U
                currB[id] -= blueInterval;0 t, _- @7 h) B: o

2 [1 {2 k  N$ \. o7 ^3 F: S                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
3 @( a, [6 j: U0 o8 t7 M
5 E8 y) z4 [" j- b% g" X                if(--count[id] == 0)
! I. E! E9 z6 T( m! a
8 D$ a- J$ `* c+ R) |1 w- P$ w- @                {6 N2 m: c; u/ U& D  Y9 P
1 D9 W0 z5 x2 h
                        fadeOut[id] = true;
6 T! b$ w! U- d( b3 B& \
+ @8 D; b0 k" D  m5 x! b( U                }
; ?  L( C8 C- O4 N& v# t- N; V3 ?7 F1 q2 h7 {
        }0 Q3 i' S# Z- p4 |& R: I  ]& f/ q

, S' F" |; x  v9 Q0 D        if(continuous[id] == true)3 ^7 ~! _2 K$ P9 c$ M- y: B
' x1 J# n# ^$ k) w3 K
        {$ e; ]& o$ C* f; s- Q) Q' x

, X0 |( Y+ N9 ]( f4 r+ G                document.getElementById(id).style.color = newColour[id];               
7 C, F+ w. D* V; t0 }( U- B6 {6 i: K  b( I) Z2 q  {
        }
! o" N  ^% {1 e2 n5 G1 ?4 M9 I3 r4 J# H4 K# z' g
        else3 o! F% J4 {' @. d) i2 O

) A! z2 Y% m  s2 z6 h        {
: F* X  {8 X; ?3 w; I4 H* B" C5 `  W: T1 B) v- P  L0 ?3 N7 }
                document.getElementById(id).style.color = hoverColour;' \0 R: u: f' b5 o( I3 X
: U# @2 l! C/ b( i' A, b5 L& t
        }4 m% t  E, ]6 ?* l( t
( ?- P9 j9 U/ b! `+ r' @% L1 N$ L
        clearTimeout(tID[id]);2 G) a) ^3 p9 o$ J4 B

5 X! A+ X7 }" |  O        tID[id]=setTimeout('startFade(' + id + ')', rate);
2 T( i$ n7 I2 d0 C$ g0 L
6 h' ^+ [% Q- X/ G' z9 `* W}4 B: E$ n* s5 O) O2 \' j
8 ?. l( j+ L6 ~+ a9 \6 ^, G8 ?
function continueFade(id)
/ ~- W6 y: ^4 x, c* \  V
- y. D! @  V0 @( A  h{* h8 q! z/ R7 a. W& G

# ?+ u# V* t7 Z2 B2 h7 l        continuous[id] = true;! f! k  O3 T7 y& ]" o! b' r9 [; ]
% T; O) _: n; P2 |6 O$ S; L; Z6 ~. [
}
, Y1 ~3 t& c1 ]3 l9 k  `/ n5 y& U4 k0 S; @5 d- e
function stopFade(id)
7 [' _2 A" b+ @- X/ ?# v0 S. e2 B" L7 U
{' \1 _6 q: m$ ^" [
( q5 h( ^, M9 K
        continuous[id] = false;% Y- W' H- i2 ^4 i  k8 h
! n, P& O# A7 i0 g  X
}
& u5 X3 U5 N5 J+ o; O+ W4 H9 F5 Q8 g8 X! t8 t4 W* C! x
function StartTimers(). [+ ~2 w, Y' D% Y$ I3 @, D& L

1 G4 N6 v0 a) T6 r{        //set up an initial set of timers to start the shimmering effect$ {, \, [! r! D

, ~: m" u4 D. z" s; @" M' _6 u+ ^        for(id=0; id<numLinks; id++)
; `* |1 |- W! k* d% }( j# \8 q! P; d# G* ?7 v
        {" l  ~) u+ i" N: p* P
" x  ?, p" R3 E- p* O2 r1 k
                t=setTimeout('startFade(' + id + ')', id*100);
" x$ [. r( U) m) n
4 G2 e- r; r( |7 m        }
2 c0 F* T6 U/ Z# X$ d8 Q# Z- _/ s6 Z0 f
}
* F5 F8 ^  L+ q* L8 c  [! r/ x1 z& @& ]6 j  v) Y# m& a2 ~% W
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
" q& b( V1 e9 b9 I$ J0 W; l/ K
% ^# S; a7 c& PinitLinks('#FF0000', 6, '#FFCC77');
9 S/ c; B$ X' d' W  {1 w6 r$ o! H; X$ ]6 s7 b. F% f
//-->8 R2 X- W' C/ G8 Q' H

) c2 w! L$ V1 V5 o. p) C3 X8 U</script>
; `+ N" W8 r8 P0 [4 `<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元
& {- R  _1 J7 j9 \</a>
3 ?0 l% P- \( z& v* d1 [( K<br>
; Z  I# h& }8 @: N; i+ @) d<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>
( O8 g2 c8 H5 E+ J; r' k, Y  x<br>
3 D5 o4 t* W3 t' b<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>) m) w$ C* q7 }, @6 B: ]: A: f, V
<br>       
* f1 Z4 `, D5 d7 [4 k) r<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
) V" i& ^* I6 g6 ?; o  L<br>* k2 Z; P: n3 }
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
# ~$ U) I: K' l% [+ G<br>
) D9 v3 `5 J) \- P$ z6 ^& S<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>
1 J+ F- p9 y6 o" ]; \<script language="javascript" type="text/javascript">
+ t/ [4 Z$ d# ~9 m7 t* m; B<!--: X) p! l5 e  t4 N0 @
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering$ Y6 d- C( v% H( F
//-->( b" Z) T: S% S- s3 E
</script>