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

zw2004

<script language="javascript" type="text/javascript">% ?% q: o% S1 p+ v5 R
<!--) b9 _9 X/ M% Y9 r) h2 u& E1 _
// convert a single digit (0 - 16) into hex
; E2 ~2 I* J9 ^" H7 y3 Rfunction enHex(aDigit)1 B4 Z% |$ I! z( b
{
! a: n# J+ r( r. f/ ~    return("0123456789ABCDEF".substring(aDigit, aDigit+1))
" C9 Y6 O' R  m8 l: u}1 c. Y4 i. f1 n$ L9 F
// convert a hex digit into decimal
  y4 B; g2 @+ @6 |3 X1 t( Vfunction deHex(aDigit)
; ^$ ~' J1 w( T3 f/ h" U: N{' G) Y* f, M: Q
    return("0123456789ABCDEF".indexOf(aDigit))9 J9 x) z( q9 z- s2 Q- ~
}  ^6 x( l! E% U8 G7 s

/ I9 M( m. M; c1 K. Y+ x// Convert a 24bit number to hex
9 z. B+ h% s. Wfunction toHex(n)1 B% `/ V) o7 y2 L; @
{
, c+ h$ w0 Y( S  K    return (enHex((0xf00000 & n) >> 20) +
% D1 R! E4 F7 K/ O7 V2 {8 B            enHex((0x0f0000 & n) >> 16) +3 S* R. ~7 Y0 s
            enHex((0x00f000 & n) >> 12) +
. h4 K. _3 q4 \  R, e$ h            enHex((0x000f00 & n) >>  8) +; h0 l, W* n; z1 E( b) \
            enHex((0x0000f0 & n) >>  4) +8 p0 \; x: l0 P4 _3 a# e) W& P
            enHex((0x00000f & n) >>  0))
& s, I, g1 k+ ?2 \; L' {}+ x& v" @  h3 \1 {
// Convert a six character hex to decimal
: i! N/ R0 J( I& Qfunction toDecimal(hexNum): @) K# N% m$ F3 M. E; _) C
{: C# \, W' y% U0 G
           var tmp = ""+hexNum.toUpperCase()
% m0 ?; Q9 n; f3 z" {    while (tmp.length < 6) tmp = "0"+tmp
- D5 H4 h; U7 L           return ((deHex(tmp.substring(0,1)) << 20) +2 K3 E9 U5 n' J5 t3 x) ?5 |
                   (deHex(tmp.substring(1,2)) << 16) + 7 G0 {) r6 X& A9 @3 ?
            (deHex(tmp.substring(2,3)) << 12) +
8 n3 J) S7 o) o0 M% w: y* D$ {            (deHex(tmp.substring(3,4)) << 8) +, b8 j. g$ t2 p" _
            (deHex(tmp.substring(4,5)) << 4) +3 o6 W9 x9 f% n) V
                   (deHex(tmp.substring(5,6))))
5 W* V5 C; w& s; H0 j}& y1 z4 L& {4 I0 c5 h5 O! T
///////////////////Shimmering Links/////////////////////
7 @7 M7 y+ A8 g# T8 j, m( r//global variables( n- L- m" c( h0 d/ E8 R, i
var hoverColour& ?6 ~2 ]* A) e/ D
var numLinks;
5 H5 C' f3 d( v" b4 R  ?  svar rate;- Z# m( I# I/ ^' J: y2 a# Z
var numFadeLevels;
; T1 _3 j7 w6 Q  v5 F. e- ?var bgR;3 s  J  i, i) p. U! s* h
var bgG;
' ?$ S" ?: p: P8 o) `var bgB;
* z0 I  r4 l& e- z4 fvar currR;% d5 k) Z) p  N
var currG;% q# i' p* z( G3 f. t; r
var currB;) ^; z, u2 u$ j$ g& ]- S
var count;
$ w5 g5 Q5 S, B/ z; Xvar fadeOut;
9 W' `4 |9 w" o! b2 \var continuous;
. d- g* m( h0 b( {# U3 e5 Avar newColour;9 o; H& _/ v* c
var tID;" B4 [& r8 B/ ^0 O5 m8 h
var redInterval;
# k0 B7 I( T! P* h4 Y8 Dvar greenInterval;
) a( p! F/ l1 _9 tvar blueInterval;7 l: j8 S& o3 M6 [; ]0 h
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
* w6 q8 u3 W+ E6 v$ l: G{$ Q' |2 m; f0 q# ]9 I
        hoverColour = mouseOverColour;: R+ p7 a6 \  E8 P/ ]0 }2 J
        numLinks = numberOfLinks;% Q/ M' L* {( ^9 C; @
        rate = 1;0 S  G$ x. t% m4 E! M" \
        numFadeLevels = 30;4 _3 o- W- V# }4 E; s( t2 a+ H
        function initArray(theArray, length, val), T9 c  F3 ~' N7 P; G2 @5 D
        {3 d& m6 A1 C" P, \) h
                for(i=0;i<length;i++)( ?+ V0 m5 H0 a8 z- c5 C4 W$ F( N
                {
7 n0 x( ?  Y/ {' z7 t                        theArray = val;
/ D& G/ b; C9 H. l- V                }) _# Q4 M" s+ O/ i
        }- B- a( \4 L) d2 J
        bgR = '0000' + fadeOutColour.substring(1,3)' v" _( w7 o6 a9 t
        bgG = '0000' + fadeOutColour.substring(3,5)' O( n- k$ o( J0 I' E1 z# u/ n/ V+ b
        bgB = '0000' + fadeOutColour.substring(5,7)
( K7 J! M# W# T& z+ m        currR = new Array(numLinks);2 j; b3 O6 o6 b# p
        currG = new Array(numLinks);, |* E5 D' c; ?( X+ B& Z. E1 X& x$ `; U
        currB = new Array(numLinks);
; m9 b7 {: d4 W# g# C        count = new Array(numLinks);
6 ~; @0 X8 _# Q5 V, [        fadeOut = new Array(numLinks);0 W, c& p$ y# p$ R) w
        continuous = new Array(numLinks);- N6 a- c& x  z; Y6 G) O
        newColour = new Array(numLinks);
: k+ M# h' N. g+ I        tID = new Array(numLinks);3 t5 \+ o4 A7 Z1 Q9 H5 Y9 f
        redInterval = toDecimal(bgR) / numFadeLevels;+ V, q9 F$ b4 O
        greenInterval = toDecimal(bgG) / numFadeLevels;, m, u0 b3 Y) D# y' }7 ^! ?9 o& {# F* A
        blueInterval = toDecimal(bgB) / numFadeLevels;' _; |' C. F" P
        initArray(currR,numLinks,0);
' \  I; [  @2 }        initArray(currG,numLinks,0);1 ]: y* u" ~# y8 ]9 G
        initArray(currB,numLinks,0);0 N5 z2 F9 k" r2 U  `. x
        initArray(count,numLinks,0);
3 j# g# B$ V2 R4 H7 ?        initArray(fadeOut,numLinks,true);
) q! x0 l( D$ L8 d7 j2 P        initArray(continuous,numLinks,true);
9 y* D3 _( L" _+ z1 B6 m) O. A- i}        2 K) D! j% M! A# J) q
function startFade(id)
, g( _5 d' x& }  T" o* M7 M{' W! A" j9 L! |  P) m
        if(fadeOut[id] == true)
% q  Z! n) C# D5 X2 S7 _        { /*move colour towards background colour (increment)*/  O# r8 c# h" J8 }+ p
                currR[id] += redInterval;
/ }6 ]- e- L4 q( Z                currG[id] += greenInterval;: f, X: n1 R0 V  H: p: }$ o6 t
                currB[id] += blueInterval;
6 n4 j  m$ |$ D7 M: _9 W                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
, E% z* {5 Z' P' D+ `* x                if(++count[id] == numFadeLevels)& {4 o! C4 I8 m% Y
                {
2 Q$ X' ^6 x3 e" S+ u1 i                        fadeOut[id] = false;
9 N3 d% J" G+ q                }' J3 D& V) m. d" i/ Q
        }
6 _5 r0 D9 J: Y( E. t; C4 i1 n        else
: `4 X2 C. x3 h; w: i; P, _        {8 O+ b& {8 m4 t+ y
                currR[id] -= redInterval;
) o6 L2 C$ |3 p
; R1 K- D7 u  X2 J; f1 Y" X0 B                currG[id] -= greenInterval;% N% p8 V3 I+ A/ X% M( Q
. A! i- f" m) Q" E. _: x
                currB[id] -= blueInterval;5 `7 |9 v4 v% i. M! ^4 K
) |( Z3 @( D: K! R, Y
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);% u" M" B0 Z; L" E4 r$ g7 m# `, {

% x7 J& b2 q  N* N: u) {6 g                if(--count[id] == 0)
* u0 F5 k9 P2 p/ V" [1 p) q8 I  M
9 g+ O$ I  m2 C: o& F3 }. M                {
, l3 q% t1 D3 v8 h6 l* k+ W3 Y) e! n# U* J; r
                        fadeOut[id] = true;
% `5 |5 R, x! K6 Y9 Y
! k8 ?' ~# [. k0 \0 Y( b$ p                }
/ O) m4 j) D  N9 W3 \4 u, e4 Q, \
        }1 \7 Q! k$ a) G0 @! w) A. X) l* h

* h& G5 A8 O5 s. N        if(continuous[id] == true)6 b7 q0 h" W, a9 |0 |
9 V$ c: _1 U$ u6 L, I2 u
        {
7 \; h2 a5 o7 a! D7 x. o: j- F
% Y# k# V# Q4 q8 C0 J                document.getElementById(id).style.color = newColour[id];                , l2 N" p/ J5 O7 U: e
% D8 b4 A- Y( [9 w+ _
        }
; {9 d# U- y4 O) U1 T! e* _- k7 I7 C; k) E
        else
" V/ F/ E2 L1 m/ q+ X- I
9 G/ E# e. N6 E: _2 I1 F; X        {$ z7 l/ f& n6 ^8 c
( `. ^) M4 k8 l7 N# e; Z
                document.getElementById(id).style.color = hoverColour;/ h. g4 [. p. z2 r' Q5 I

- x6 v, R$ g8 a' I0 l# _1 ^5 O* p' z        }
* O$ A) i% q/ }! K- _/ u+ T9 E! F7 R' c9 `
        clearTimeout(tID[id]);
7 A* h# e; _1 n  ^; ?! K4 K% J. y; }2 t! O: \6 g/ O
        tID[id]=setTimeout('startFade(' + id + ')', rate);; s* Q! }: X$ Z* x. }

8 J2 l, I/ V+ g6 G( \}
! l; b$ G9 w* w, K& p- Y4 S# t
: h# _: `% T8 }$ O( Cfunction continueFade(id)
% }) ~3 u' \0 m3 I$ _$ d) l/ W' [( C' n- Z
{
1 X8 Y/ @1 K  J: X7 V
, g/ W/ f" Z9 a  n4 ?! V) M        continuous[id] = true;2 a) g# Y. \$ S1 _

4 V  h& F7 _/ u1 m+ j9 J}
$ }1 a6 A! d$ Z; ~  O, C. z% v+ d$ }$ l+ w( T
function stopFade(id); g; F! l% ]( @2 v

. C/ J# I# I. ^% a{
1 \+ ^3 ~# T: X% {8 o' p' I1 j# Y/ D# P( m
        continuous[id] = false;. E, F8 ]& q) V! V# H: C( ~! e

6 S; X+ f0 E) r  F- [: v' G}
6 s$ G( Y, \8 g& K3 |2 y  q  n
  N& x2 m9 x  w" Z3 E" l' Bfunction StartTimers()
- [0 @, D% H" z" B* o" ?6 y% a. k; D6 J- P8 l% G  |1 J% V5 x( C3 S8 M
{        //set up an initial set of timers to start the shimmering effect1 L/ W0 A% K1 C$ K" ?
/ l3 n$ J$ P/ j, M/ N1 Q9 J
        for(id=0; id<numLinks; id++)' y) M7 A* L; d1 `' y
# T4 `, h0 Z( F$ N' D
        {5 z# d5 K" E+ E( P, D, ^

5 F' I4 d# A" \: W                t=setTimeout('startFade(' + id + ')', id*100);
2 t+ R* v. R* G( y; c" @+ X) G5 O% h7 H& Q! s
        }
. p% _! M; D) C8 C
& T* D+ _5 A) l}
! f+ c4 H9 y6 [2 [
/ v0 `; F  B& P/ j( @+ C5 a* N//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
8 F8 w0 u, V1 n$ g" a* R9 c8 m) T
' E+ \" X, h' {$ b/ c/ einitLinks('#FF0000', 6, '#FFCC77');8 v, e" J, T; d* ]0 O0 ?6 K. ~
! [; s6 V* X1 r
//-->
/ U) u/ w% T& ~" Q' z9 @/ F9 \5 T1 k3 S( m: |4 g- @" ^
</script>5 P2 D0 w8 h. a( O/ \" R" O
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元/ [2 x  ?, ~# p) N
</a>
5 ]3 z/ k. I0 Z8 h6 r<br>
; s3 @0 s$ b6 d<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>
% a- c) g* O8 @0 ]<br>* \( b6 l! T) \, M' A/ S( k9 a
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
9 ~8 J1 D8 S% q+ C& ?5 V# ]+ n% A; e& R<br>        $ F  z9 K- R! k8 O: O4 a  u
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>3 S" Z* V4 ~' s
<br>. v5 V* Q. M. y- e! s. }& U. H
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>) W8 l' ~' o# L& o9 L
<br>
0 V3 X: Y) S0 a8 S% f<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>$ j2 H# R  l' W6 c6 r
<script language="javascript" type="text/javascript">
" K4 W0 B1 O5 Z7 {<!--/ p$ D* K$ V& b, w4 N
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering/ c( d* ~- V; L0 G) J
//-->$ b" B( N9 ]- D6 @  U
</script>