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

zw2004

<script language="javascript" type="text/javascript">$ x! V3 H( T  Y; J
<!--  U7 Y0 d5 a; `* n6 f- |$ p
// convert a single digit (0 - 16) into hex
, u, U- `, t. S  Z( ]function enHex(aDigit)
( r1 V# N: q9 j{
4 r, r+ h. F" h0 u    return("0123456789ABCDEF".substring(aDigit, aDigit+1))& `% e# t8 e' T$ z% _7 m* T  ]
}1 x& v. {5 w' A3 o, l( ?
// convert a hex digit into decimal
4 M6 P& x2 h" n# D7 e0 E1 lfunction deHex(aDigit)
' S& w% ]/ B3 @$ @- v3 V7 D{3 H2 P) F6 L) k
    return("0123456789ABCDEF".indexOf(aDigit)), z, Q* p; K. W0 y4 N3 S, g: Q
}  j0 ]+ g2 `3 f& d* u$ G3 G, E

  ?1 p% h! @2 |+ O- f// Convert a 24bit number to hex
$ V  K/ K! i9 v* a% {function toHex(n)! M4 X7 {0 A$ i: }# R
{
, S; z0 ~' ~8 s    return (enHex((0xf00000 & n) >> 20) +
6 R. Y' m. g$ B3 c& Y8 P            enHex((0x0f0000 & n) >> 16) +* C! Z/ L2 D( u1 c
            enHex((0x00f000 & n) >> 12) +) l, w  E# ^* {+ [. n
            enHex((0x000f00 & n) >>  8) +
; d4 f& F/ C: k5 z1 S! ?2 @2 g            enHex((0x0000f0 & n) >>  4) +8 z- t% U9 M& ]! A2 p& b
            enHex((0x00000f & n) >>  0))9 W5 l/ i6 x  y6 c. L
}# I0 b, a, T* ^1 _+ C2 |
// Convert a six character hex to decimal$ S7 C+ u. h' }+ `1 p4 D
function toDecimal(hexNum)
1 p4 r, o# S% F: d+ d% W{
* h3 A1 y/ j; w3 m+ m! y6 r           var tmp = ""+hexNum.toUpperCase()
& \9 m: T$ G1 c. C( _/ F- z    while (tmp.length < 6) tmp = "0"+tmp
0 z: d& n6 i2 s! h. ?           return ((deHex(tmp.substring(0,1)) << 20) +
$ p* g; N% |; Z- o! b4 w& J                   (deHex(tmp.substring(1,2)) << 16) + ' P. ]% w3 M3 S, I2 w* I. D
            (deHex(tmp.substring(2,3)) << 12) +: S2 ^+ ^& ~" ]  M/ R3 l
            (deHex(tmp.substring(3,4)) << 8) +
  {0 ~2 ]# u% ^7 o- R7 x            (deHex(tmp.substring(4,5)) << 4) +" m. D4 Y0 @9 o4 k% C
                   (deHex(tmp.substring(5,6))))/ a' c; P. T, R: h9 {* E5 H$ P
}% U+ V+ Q4 I! F4 _! Z) H- Z+ I* a
///////////////////Shimmering Links/////////////////////
  e3 N2 y% E$ ^( f* i4 K4 ~* b//global variables
/ `9 P6 O7 Z; `0 w, e2 ]5 mvar hoverColour3 V* _5 f. K7 ]: q- @1 q+ ~
var numLinks;6 _+ w& V! h9 f" ?
var rate;6 H$ \* K$ h; {5 W( w
var numFadeLevels;4 N! V# |% I$ S4 N" C" @
var bgR;
) ]3 M# J5 @; Rvar bgG;
( D" m% p" _8 L2 D! g; kvar bgB;- b8 ~; l9 V) o! A# N3 ^, V1 O
var currR;
1 a/ B" H+ I% J* [( D: @var currG;$ s7 M. a& z* G. k0 b) O
var currB;
: M9 z& l* v* p! L, c' _+ F" [, }var count;& [4 p# G3 d* v1 d
var fadeOut;
- R1 ?2 g9 S8 ?5 b& |* ovar continuous;
* K: X) v* n2 rvar newColour;# I. i6 q$ E1 G
var tID;
' J! n2 E/ z% Ovar redInterval;
0 m6 Z2 g% `4 m5 U. n/ @var greenInterval;' F% \$ v) G" M$ w
var blueInterval;& \, }1 I4 X7 k
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
7 I+ \: j( J$ t" y  W2 |& w{5 w2 ^2 z' c2 }- E
        hoverColour = mouseOverColour;8 e# B' `3 \1 p( g) G
        numLinks = numberOfLinks;
3 d" W+ Y, J4 k0 C: a; P        rate = 1;
# H7 s- C/ p+ q; ?' c; P0 Q( h' S        numFadeLevels = 30;! D! R! S1 j% C1 G; ]" n4 h& g
        function initArray(theArray, length, val)' z+ @' u- T, R1 m
        {
0 {7 Z, R7 G% z( C                for(i=0;i<length;i++)- v* j6 M9 ]! r2 }6 ]# M7 w$ j! c
                {- ?* _" |2 O4 ?4 q2 G' |1 B
                        theArray = val;/ W. d1 I, K8 ?6 D/ L6 l
                }
4 W) J% t5 R5 H( d0 l0 _  C3 S        }* c) j! f) V9 H6 O6 _, k; I8 }
        bgR = '0000' + fadeOutColour.substring(1,3)0 f; Y! i6 |& H0 R% ^# t4 e% R
        bgG = '0000' + fadeOutColour.substring(3,5)! B6 ~% |7 y  T/ P0 e
        bgB = '0000' + fadeOutColour.substring(5,7)3 G5 @: \% e. }9 A
        currR = new Array(numLinks);8 e! a/ x* c1 c8 }
        currG = new Array(numLinks);
1 H% X$ F% o- m. q  e        currB = new Array(numLinks);
$ W1 ?7 l9 O; y# @' F  f9 L7 C        count = new Array(numLinks);3 A" q0 I/ T( H; c
        fadeOut = new Array(numLinks);) B: O6 {, D! S9 `% V, Z
        continuous = new Array(numLinks);" e; S& A5 h8 y1 \
        newColour = new Array(numLinks);9 E- T# O" z& t9 v, X' n  D
        tID = new Array(numLinks);
9 \+ ?& W5 ]) N. [) I1 V+ N. `        redInterval = toDecimal(bgR) / numFadeLevels;
# \9 p8 }# z" c6 a        greenInterval = toDecimal(bgG) / numFadeLevels;  a, Z4 P( v0 z, {, p; D! m( q
        blueInterval = toDecimal(bgB) / numFadeLevels;+ K* W$ V) p+ L/ W7 _' n7 R
        initArray(currR,numLinks,0);
0 `6 Y) L" h2 r        initArray(currG,numLinks,0);
* m8 I( g: V; T! L3 {5 W        initArray(currB,numLinks,0);
, j+ y5 p5 X' e% y# B        initArray(count,numLinks,0);
& F2 y$ H8 e, `  ]        initArray(fadeOut,numLinks,true);
# N0 a+ ]- i6 }+ q        initArray(continuous,numLinks,true);1 S2 u  F0 e8 {
}        ( ~, R! s1 b& h& j9 v
function startFade(id)% n4 a7 ~8 d/ B. q* w2 a
{
' Q( @2 e, m3 o/ }        if(fadeOut[id] == true)
) \; v$ N; e& i: \# A        { /*move colour towards background colour (increment)*/
+ q" c3 H- Y2 k' k. ?/ P8 q. W* a                currR[id] += redInterval;
* X4 c, T* ~4 G1 K                currG[id] += greenInterval;+ J$ Q0 W  B- C( _; \
                currB[id] += blueInterval;
9 t0 U/ C& z5 N1 T  b                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);$ @, H( g: p/ Y7 x
                if(++count[id] == numFadeLevels)+ @/ n1 I2 ?4 ]; Q! W* e
                {
9 Z/ ]* i+ |* h. N                        fadeOut[id] = false;+ U' R1 l7 Z  w% B* r' x; T
                }2 a- M. W  m! Q% q
        }
# E! z3 v' Q  I+ H2 z, b9 B        else8 n9 z8 r' |9 Q% Z- d
        {2 l  U4 s+ v. W8 c) d+ s5 R& E( {
                currR[id] -= redInterval;
/ n! {2 a* a2 m! i1 q2 V. t6 r1 w  ]" [! ?$ O4 N' Y
                currG[id] -= greenInterval;/ ?3 e. k; b. a& G
& T% }3 L0 _0 D
                currB[id] -= blueInterval;
$ D2 N& A, t; U5 Z* b
8 B, V& O' ^& g2 ^3 E                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
( Y' m% d/ [4 W  `* u8 Z/ y( p8 j& m2 \7 t9 \! ]$ w
                if(--count[id] == 0)
5 i. d! F1 U- e% G
* g* i7 c/ H/ O1 J, ]                {6 f+ |! n0 A9 f
6 i; C1 \2 a, Z: M, U; w
                        fadeOut[id] = true;
' t+ j% z6 n. T" A5 {  e: F" S- o7 a) R8 ^3 T* g$ v( w
                }
" }/ U8 g+ U- B( q8 q7 f& o& W
5 V* P5 |$ y4 F5 T$ g0 t        }* C( t% [& N5 h+ L5 w0 r5 J9 b$ W
% [# T" `" d3 X5 \
        if(continuous[id] == true)2 V1 g) x4 _4 b* M4 ~2 k
2 K# n& h+ b. k. o/ f
        {
3 e- N! l+ j8 v3 H! }- H3 n! A" s( d  w
                document.getElementById(id).style.color = newColour[id];                ' z7 a5 U3 m9 a! u$ {+ Z
, A$ K' \9 ~7 K9 c; F
        }
5 A2 ^+ p1 V$ A& J+ s8 p
- J# F3 \, O% l: E  O2 x        else
' h2 J% y' m$ {# P1 ^( V4 c$ j( H2 @
        {# I+ y1 _- E4 [5 x3 e" p: b; z/ L* ]
% U+ P- T6 B7 M  ]) ?
                document.getElementById(id).style.color = hoverColour;9 X2 Y- o% v1 x$ V! y7 f6 a3 ?
3 ^  }' l1 E7 s9 c# Z0 O
        }
$ K' _: S: n! t! `/ P2 g0 o! e$ [
2 R$ r) o) I; y# c        clearTimeout(tID[id]);
5 W# Y$ Z) ?  a0 k9 i5 A8 ?7 o8 F1 J- N! E0 W. K* o1 z  ~
        tID[id]=setTimeout('startFade(' + id + ')', rate);3 h8 K0 F0 W# k" F# Q
" t+ G, c4 J) O' a- i7 W
}0 I1 A, M. Z* O5 e+ L5 L1 N1 |

1 c9 K1 U# i" p8 afunction continueFade(id)6 F8 z' G( V* V/ e: s5 ]
8 c8 z) Q9 s% [) i7 O5 v  m" a
{
8 b$ z  a# I6 c& v9 `2 K: ~/ G( X, _5 D# q7 N! [/ a! ?
        continuous[id] = true;
! L+ d* W+ Q3 V* i7 d/ Q2 J; d# x6 p/ B& Y+ @+ n4 c7 }( H% L
}$ m& B4 g/ K) _% ~. [  J4 X/ y

- i. H1 |1 F7 G# N8 a0 W! rfunction stopFade(id)7 e- f5 }% Q7 ^( E! x; I
; @" a' i. s8 p/ x7 q7 q& Q
{
" c+ n( {0 ~% x, k' r1 W
$ U% S- S* O9 g$ V: {        continuous[id] = false;. q% O* ^: x6 [9 t
1 h3 f+ I0 y' X' l
}
" @- E/ m3 Y5 ~) }
3 O- q- p( w- v1 ?" |function StartTimers()
# Q! N. \$ `% u# l% d3 X2 s. A# Z7 ?: e* m1 k3 P
{        //set up an initial set of timers to start the shimmering effect" s8 U. l0 ?  j0 j

# z' ?7 P3 K$ q        for(id=0; id<numLinks; id++)
5 C/ D' `4 r0 `9 b) y
9 G* x8 m! H- K* {" Y8 e! v        {
* o) x2 ]# c5 y4 v; h# O
- b, e1 L+ d0 h: z$ B                t=setTimeout('startFade(' + id + ')', id*100);, E, D- A5 z% ?$ Q
. t$ ]& j2 c) G
        }; e( O5 F( N' t5 W/ m. u5 J
8 j9 C* K( j0 b8 c4 s& ^
}
6 H+ N3 X$ p; m# @! t$ ~  {  E7 K  Q% k2 y! D- g1 O
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
& Z7 Q6 |! F# t3 p
) j: E! ~- R: d! }1 rinitLinks('#FF0000', 6, '#FFCC77');
4 D8 u- Q7 Q: C9 H1 a
4 \" m5 D: W3 t0 Y) B//-->
! f" K- z  I8 q7 @/ ^" Q, q; U! y
, h: e5 h( Z5 [7 ~/ R</script>1 l0 o% [, L  P* L5 k  v" |
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元/ Q9 {/ \. A& {8 V9 u! U
</a>
. [3 x- A$ a$ s4 ]" H<br>+ l/ F: n! U0 c1 P' l' j0 n2 P
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>9 F4 ?$ f$ B! m/ b4 E
<br>& z) E" T* Z- j6 V8 Z; L. }
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
6 O4 q( f  E& P1 G# {+ ?<br>       
  H% g7 \4 e! n8 X4 B<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>* x9 t1 o) W7 U; M+ X
<br>
4 g1 R; V- j4 f* ~$ f<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
3 i6 o# u+ m! t7 X) C) n<br>
1 a3 q; l( A; G; H0 _$ h<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>
2 s% w3 J- K% _4 b/ C; C2 x6 [2 s<script language="javascript" type="text/javascript">
/ L! z- t# o( U4 Z0 ^<!--+ ?+ L! J2 v6 b8 p: ]3 H* N
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering4 W, m$ a) W% |8 i: G! C
//-->
# w$ f0 d( @" g0 K8 j( Y( `2 g</script>