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

zw2004

<script language="javascript" type="text/javascript">, Y8 z/ e9 q: ?0 \* k
<!--2 v9 X( ]0 c6 y3 H- d
// convert a single digit (0 - 16) into hex8 c5 }. t! O  z7 ]+ G3 ^
function enHex(aDigit)
! L' O5 T% B" _/ Q' t0 p{
) e4 B3 N5 |, l: u. ~2 `    return("0123456789ABCDEF".substring(aDigit, aDigit+1))
) I* A, h+ t: ^" o' N0 N; Z" g9 n" H}
/ I4 T/ Y  C+ Y7 f( z// convert a hex digit into decimal
9 A3 C  {. v( |1 rfunction deHex(aDigit)
/ u' W1 |2 @. C4 p, |8 Q{1 F# D& ^/ x7 s+ K  a0 A
    return("0123456789ABCDEF".indexOf(aDigit)); R2 i* M0 {- p6 K' s3 G
}7 t' a$ I; {) F% X
( }# P  t) G. S
// Convert a 24bit number to hex
2 w. @# P1 |; u; q0 A2 Rfunction toHex(n)
- ^7 K2 C3 _6 A2 }( @{& ]# Q8 U7 K# ^( M) O3 W8 h& x  [1 c
    return (enHex((0xf00000 & n) >> 20) +' {. A, Q  |3 u) g
            enHex((0x0f0000 & n) >> 16) +
6 b# |8 H* P' M& C0 [' j3 d6 f            enHex((0x00f000 & n) >> 12) +
; v! K* w% Y: `+ B3 X            enHex((0x000f00 & n) >>  8) +; u! G( p, h$ W8 Y
            enHex((0x0000f0 & n) >>  4) +9 z% N2 o8 m) d4 p1 Y
            enHex((0x00000f & n) >>  0)). q# A* A% I6 x+ _# j' r: e9 D6 _
}7 N7 i& S! [% y1 ?% n
// Convert a six character hex to decimal; o9 X% A1 A0 e8 |5 I5 Y
function toDecimal(hexNum): Z# F( b3 z8 q! _8 k. {
{7 y0 B7 b* S' b3 ~, ?9 V; g
           var tmp = ""+hexNum.toUpperCase()6 r) I" C4 C9 L" m% z! b3 l0 ^
    while (tmp.length < 6) tmp = "0"+tmp8 q0 C) H4 E; U. i$ M+ }7 @
           return ((deHex(tmp.substring(0,1)) << 20) +
8 d* i  N" D# O7 x# ]                   (deHex(tmp.substring(1,2)) << 16) +
' R6 E3 o# P) q1 }* [7 ~            (deHex(tmp.substring(2,3)) << 12) +
% f; X7 Z0 S" n1 D' P5 S2 c            (deHex(tmp.substring(3,4)) << 8) +' P. Q5 X6 ]0 i. ^& x7 N
            (deHex(tmp.substring(4,5)) << 4) +. ~" E/ h0 d  ~. ]) ^2 D9 }+ G
                   (deHex(tmp.substring(5,6))))  E# n( v8 r; ~" M  Y
}
4 g4 h% c2 }* g5 h* @, H///////////////////Shimmering Links/////////////////////
; x- c: m: j) N+ E7 K" h//global variables
. z0 |; S) M' n! ?. r" _var hoverColour. F0 d9 `, H. ^" x
var numLinks;0 e: h! Y2 T$ ?  k( o4 y, f% ^. S
var rate;9 a6 R. M5 r6 o! I
var numFadeLevels;
- ?  I2 g7 o, v! N1 Qvar bgR;; d, l& q3 s" z( R1 H4 w1 f
var bgG;4 f& A6 ?, U* P* e; c. c0 ^) d
var bgB;
* ?6 h$ B. b+ L/ V5 gvar currR;
  }( M6 T" R6 Y0 t7 U( svar currG;
4 q6 r3 U1 L2 ?var currB;; u& d9 o9 ^! I! o% }( b
var count;- N1 Y; W8 ?: z4 _; F: u! k
var fadeOut;
1 w: u  O, j6 K% f: Q6 |- I6 s- dvar continuous;
# L6 n' G. _/ l  Bvar newColour;
3 t0 x/ \. z$ }% U+ yvar tID;
+ F+ h2 `& A) |! H2 u0 }1 P7 fvar redInterval;$ z$ ^/ N: d+ x" N
var greenInterval;
% h2 M% O$ e: t8 D9 Cvar blueInterval;/ p/ t+ e2 v$ f/ h" o; \1 ?5 x5 ]0 Z8 ?' g1 l
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
6 z/ q% k+ x, o% O{: I% I: X* b8 Z' @
        hoverColour = mouseOverColour;5 O" W* y- Z5 ]$ t" z  m; @0 }! e
        numLinks = numberOfLinks;0 z3 P' Q) [1 u( \7 ^9 n' }8 z
        rate = 1;
( C7 Z0 y/ W) N1 b        numFadeLevels = 30;
* ]+ x7 f$ D" L, ^) J+ d        function initArray(theArray, length, val)+ ^! y, y% p& n3 f
        {! \; x0 e' h& E- A0 }8 j
                for(i=0;i<length;i++)
0 R- E% s* Y: }6 u                {; d4 b0 T8 I0 V
                        theArray = val;
- u  u4 |2 k9 I& S) p4 G3 R                }  u" ~4 |8 `4 X/ A, c: |
        }
; q2 T$ j9 |. N        bgR = '0000' + fadeOutColour.substring(1,3)9 U. u) g7 ~6 h/ r+ ~
        bgG = '0000' + fadeOutColour.substring(3,5)
/ t, S& S6 z% Z- M2 A1 T        bgB = '0000' + fadeOutColour.substring(5,7)
, k, P( Y# D: X1 f) r+ o        currR = new Array(numLinks);
: B* e+ F) F* `0 H! Y. t2 K        currG = new Array(numLinks);& a% K, B; y; E7 Z
        currB = new Array(numLinks);+ W7 E# T6 p1 A1 w# `/ ~4 n
        count = new Array(numLinks);: {3 ^0 k3 f  [9 s/ S# d0 T
        fadeOut = new Array(numLinks);
1 T3 H8 _: y; i' H) i: Y- y8 e7 i  D        continuous = new Array(numLinks);
' T# _7 i( l" r8 d. b* @: V+ p3 j- ^6 ~: M        newColour = new Array(numLinks);
: y4 o& P9 p  h: m        tID = new Array(numLinks);
' p6 H5 }( _8 P( Z2 N, U        redInterval = toDecimal(bgR) / numFadeLevels;- l! f1 L' h* G" V7 g5 G: }% s2 Z% I
        greenInterval = toDecimal(bgG) / numFadeLevels;$ j; q& p# O  X" T. ~* Z
        blueInterval = toDecimal(bgB) / numFadeLevels;* Z, |& \* {9 i
        initArray(currR,numLinks,0);
& c6 ^/ F0 ~4 F& v        initArray(currG,numLinks,0);; r* q7 }& y1 D0 b0 l3 ^
        initArray(currB,numLinks,0);
: R5 s6 L, t" y        initArray(count,numLinks,0);
( Q) N# K- z% ]5 U- e1 Z% h# ]- e& L, e        initArray(fadeOut,numLinks,true);" ~1 k: n$ }2 ]* N) Y8 ]7 ~1 T
        initArray(continuous,numLinks,true);/ q  Y" @+ G. U
}       
3 T% v+ n, G  r- R( w' r. C  Ifunction startFade(id)
; a- m& R% n- V1 Q+ V, {) a+ k{% @" `' S5 d, F9 s6 S  R; W9 a- _
        if(fadeOut[id] == true)
4 ^+ j- y' k/ a9 f        { /*move colour towards background colour (increment)*/" [& G/ i, e! T; I$ x
                currR[id] += redInterval;& x# N7 r4 B3 a3 }; Y4 o
                currG[id] += greenInterval;9 u7 Y4 e1 x& x, {
                currB[id] += blueInterval;* R" s; k7 n: F
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
  U0 G& O7 {( Y- F                if(++count[id] == numFadeLevels)
4 D: _9 P* H/ P2 [3 {2 w& ]                {# |6 a" x+ F) R
                        fadeOut[id] = false;3 R' _; d, X% s! P/ Q
                }
, |# e! ]* n$ ?: g        }  k! n. M. f  K" X7 J+ o8 t
        else
( X1 a+ Q" x5 @, `6 x% @        {
# Z1 N! m  N" g8 h" b, F1 N                currR[id] -= redInterval;
5 y2 G3 N/ m, ?* W& c  E1 D
1 v$ @3 h& Q& }) E' @( D. J                currG[id] -= greenInterval;2 ?2 _: e; p$ v5 Y* L: u1 e* x$ O

0 b) X. q3 T: ^                currB[id] -= blueInterval;
$ y$ u' m; |# b% t
# T  d. d. a! O8 G; q$ v: X                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);6 g6 ]; A0 B5 S. m9 t2 V3 Z* k& N3 g6 m
  A7 J4 D8 j, N# P3 x
                if(--count[id] == 0); {7 u2 z2 K. Q* K; w

6 A4 Y8 P* R$ C                {
% E# f. z  p7 J0 l5 Y- i
8 c( [- k( K3 Z7 ^8 {7 P& Y  q                        fadeOut[id] = true;
8 G+ ~) I+ ^, F6 t. ]8 h, b' D- O* o7 R
                }
6 D& e: ^, Z7 |8 [3 r) R0 p0 f
& w. B4 Y8 Z$ c$ S+ w$ Q9 }0 D        }
/ I4 Q: u% ^- ]! d$ ?5 u* ]( b+ W; z" B" `* `
        if(continuous[id] == true)) M; \: G5 L4 O- K  x3 u& n+ J
5 L& q! y; N5 Z( s5 n% J# f
        {
: J7 n/ w+ v2 r# \. ^0 D
: J0 S# \1 t2 ]9 J' ]1 |                document.getElementById(id).style.color = newColour[id];               
9 @7 W# v' Q, p" l& }& r6 n- L
+ k, b5 u3 f3 `& e        }
% o: w+ S, u" E8 L: A$ G3 n8 `! }" F1 z5 x* ]5 R: {- _8 A3 E/ }  M
        else- K0 K: a, U' d  h+ d( ^
% W: M7 l. N/ S4 {8 m
        {
3 u+ Y/ `# c8 w3 {- w! C* M6 s" c3 g9 |) W7 _
                document.getElementById(id).style.color = hoverColour;
+ ^0 _; n: i. h8 W8 N6 r* R. h  e  G  _, y0 x" [! X3 S
        }9 X# a  }% x2 K3 |

' V( K" `% `9 T+ X# b! Y6 e: e        clearTimeout(tID[id]);
& @9 y# l' v- b1 n: q$ w7 A0 E; a% w& C( d$ M
        tID[id]=setTimeout('startFade(' + id + ')', rate);
  {4 ~$ W( P/ g; K* B$ H+ Q7 Z) M( O7 c, s% S
}3 c2 }: V$ g9 [

" L1 r7 Z' Y  Ifunction continueFade(id)
; Q& ?& ]* z8 b, X/ s4 y( P0 c6 [0 [: s- l) b
{2 l# q/ `/ K. \( G' r' H

7 I6 k3 T- f2 P5 _" d3 q        continuous[id] = true;
- a! j" P; C; k7 S" v# t9 N' w. A% w8 X8 E
}
$ p" |  K# t( w! J* {0 S+ F/ d  o$ _( [, _, G2 z
function stopFade(id)
9 o' o/ |' J/ X7 m( q% }' H. i. U8 L9 q! i8 l  j+ h& x
{0 V0 s4 g- j* j+ H
2 ~# H3 j+ R2 s  ]& W9 R
        continuous[id] = false;/ C' a3 {5 h& Y( ^

% T5 ]6 q: G5 b7 K2 l# Y. b! y1 i}/ O' C" A: O  x0 W; N

8 x, K: C8 a0 K' D9 F2 Vfunction StartTimers()% H  X6 j  H9 s! h) B" q+ p8 w

- n8 r& A9 T1 d- o& f{        //set up an initial set of timers to start the shimmering effect
0 P# C$ |7 f( c, S3 c( n' J2 I8 e, o3 z7 e& W6 Q  y3 O
        for(id=0; id<numLinks; id++)
" e$ d2 Q& ^" K, h1 h/ b* i9 p
# h/ p4 A. p9 \/ J9 a" O        {& a9 t$ @' Q" _2 v4 K/ b2 \9 B6 }

1 c& ?% b. e7 n! H" O9 ~, `                t=setTimeout('startFade(' + id + ')', id*100);
4 y8 j) G* x: T1 v4 z
$ Y1 V5 `0 u) u7 G+ |        }" |3 p& X& Q3 ?, T4 ]4 B9 K; j
" K1 u* A0 X- [: r$ ~. u# l
}
2 G; \+ a# b( M( |9 k5 V
, Q% C5 A1 }6 D' P# z0 f//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
1 j7 X) i$ F/ d) i' i8 ], H/ Z* _' k. ^; H7 y# z! U2 q
initLinks('#FF0000', 6, '#FFCC77');
! U. ^2 A3 r  g! R
; A4 J9 k0 D6 D//-->" \4 q3 S/ x$ D" C! v& U! p. o
4 C8 D/ F: O/ I1 c7 l
</script>
9 w! i- S" Q* V<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元
3 J# P7 i7 o$ V7 j) y</a>) W, a+ T( C- P$ l
<br>- l/ A+ e& i3 Y7 I' E% j) X
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>9 I& ?! U( M" Z/ O- J  W
<br>
" B2 c! S# C; c) Q# C% F<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>2 S$ \( O8 C7 i1 ^' s& Y2 H+ u
<br>        . ?# l: x- t; b* N* |' c5 |- P) w& q
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
0 f4 R6 b& O# b6 i<br>
) Y6 z% }- ?' w3 h" x6 F, _& e# W<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>6 U: g( a: ?( W' z6 l1 |9 z& e
<br>
6 S! Q" o8 X7 D5 O# G) ^8 j- @+ \; z<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>2 F) f: o( B% ^* q8 [9 t- H5 E
<script language="javascript" type="text/javascript">- l  I5 |" C+ ~7 v- [" \: Q+ I
<!--
6 d$ f( z9 Z. u7 MsetTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering$ Y. Z/ d: g$ F/ C% c1 `
//-->
0 I) S& D. R! E1 R+ @3 R( U' s5 ~</script>