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

zw2004

<script language="javascript" type="text/javascript">
& v% s" d2 w( @" R: K6 W8 w: S3 f! _4 Y/ O<!--& i! Q" A- Z% |8 `- K4 x2 N7 v
// convert a single digit (0 - 16) into hex
) u4 c0 n6 y4 z8 i. U4 @: y, Yfunction enHex(aDigit)
5 A4 @6 N: I6 L{- }8 l, y  I, d; I: O. b
    return("0123456789ABCDEF".substring(aDigit, aDigit+1))
- ?" c8 `1 Y. C& G. z9 c}; s6 P2 h+ V1 f7 y8 v
// convert a hex digit into decimal4 a  G& `8 y: W9 s. m
function deHex(aDigit)) Q: C8 m! m. O3 H# T% H
{# b( t* m8 j$ x9 F; n
    return("0123456789ABCDEF".indexOf(aDigit))
) s5 t5 |* k; d; O}( ]- L5 C$ p  x  }
* [5 R$ Z% N% o9 p% x: h
// Convert a 24bit number to hex- ^% L' }: W2 b6 w' Q3 L
function toHex(n)
: N0 f) i1 h# u4 G" T- u$ g' [+ G{: ], {8 Z, J, [# k& y( \
    return (enHex((0xf00000 & n) >> 20) +4 i  g4 P1 x# x1 C/ _
            enHex((0x0f0000 & n) >> 16) +
- r% f0 W  z" I4 g9 m            enHex((0x00f000 & n) >> 12) +! b$ Y0 R) m$ N+ @
            enHex((0x000f00 & n) >>  8) +
# t" ^; m% D. R, [* B1 ~            enHex((0x0000f0 & n) >>  4) +5 `8 [# f- a' x
            enHex((0x00000f & n) >>  0))9 _" G# \& l$ [$ l8 \+ l0 e
}5 b9 D/ x& Y- o, ^5 J/ a6 {
// Convert a six character hex to decimal
- g* u% Y% t! ?function toDecimal(hexNum)( ]* K! q0 k) _. x8 h; o0 O, j- L
{9 T$ R: |6 _0 O4 q7 m
           var tmp = ""+hexNum.toUpperCase()! G8 x5 {8 M1 V6 c" N# h
    while (tmp.length < 6) tmp = "0"+tmp) s8 S2 R) K- T- _- N+ ]; f
           return ((deHex(tmp.substring(0,1)) << 20) +
8 }2 V5 y, ?: E+ n1 K                   (deHex(tmp.substring(1,2)) << 16) + 7 Q5 q" Y" B, G. j$ J3 l- {, z3 w
            (deHex(tmp.substring(2,3)) << 12) +) K) ~3 @) L% ~- T% y' t
            (deHex(tmp.substring(3,4)) << 8) +
8 i% C; l5 t# w# `3 @' I; M# m            (deHex(tmp.substring(4,5)) << 4) +/ `1 a$ J( a1 H. [" X0 J
                   (deHex(tmp.substring(5,6))))
, e8 T) _4 [" N; |: u* c/ I. k}
  b0 h) c( |, j" h4 A. L5 ~. W///////////////////Shimmering Links/////////////////////
9 m$ N/ f- [- w" a2 \7 p//global variables& p2 C6 p7 E' S" N
var hoverColour
/ r! i. l$ m4 P# [var numLinks;
  j6 `$ b6 A$ {( d  @: ovar rate;
/ R5 Z, H1 P2 \% Dvar numFadeLevels;
) O5 ?# c  o. U! }7 t& Qvar bgR;
. U5 f2 ~9 U% O& T, p5 Zvar bgG;
$ ~2 W% C( d" o3 nvar bgB;
% y4 Y6 g- c3 ?. Y3 @* H4 a! uvar currR;5 J& P0 s; u3 s% w$ a; l: q- E5 w
var currG;
; z" S. O; K3 X0 H! y0 |- n) svar currB;2 U: |  M: o: v& a5 M
var count;
6 _( d6 t/ h; S/ Z; ^var fadeOut;# n1 H& f4 e1 H5 L  C8 ]. @/ p; l
var continuous;! m, L: [/ v+ A6 Y$ `# `$ r
var newColour;7 M; V/ p! e9 L# m/ ]# n5 ]
var tID;
- I8 _+ a: Z  A% w! q/ Fvar redInterval;/ o; \! k: V+ W  G3 {, p9 o
var greenInterval;0 n5 s( \7 ^8 }% X
var blueInterval;
0 m: D% F3 p( D+ W4 b0 Cfunction initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
' i# N0 b# J# i& c/ `/ ^- R{, d5 s: G, n  |& J4 k0 H
        hoverColour = mouseOverColour;
! S5 R1 F/ M  a! E$ y& l7 w+ t' ]        numLinks = numberOfLinks;
% j3 N: h1 G* p+ S- @% m7 ^* {5 S) }4 R2 Q        rate = 1;# b0 p: m3 F4 O- y) t3 W! k4 y
        numFadeLevels = 30;' N+ x/ P: [. `4 B- k
        function initArray(theArray, length, val)' v+ s& z+ ^2 E& m2 ~6 [
        {
$ H3 ~' r# {0 ?1 E                for(i=0;i<length;i++)
3 y" m: p7 ^5 ^: o; r                {* r6 r. }6 P$ Y' F5 s3 o: r
                        theArray = val;
7 V/ V& c( s# m0 h* f% @% S                }/ q! _- Q" _; J/ G- o
        }  n: w$ ~0 g0 }9 x/ b
        bgR = '0000' + fadeOutColour.substring(1,3)  b& \9 u0 ^( @4 Y5 d# X3 ]; t
        bgG = '0000' + fadeOutColour.substring(3,5)  x& u* v, K& U. j5 w
        bgB = '0000' + fadeOutColour.substring(5,7)+ K4 m; K( r" S3 Y+ l. H' x) }
        currR = new Array(numLinks);
' t. A) h9 j7 K0 e* j. \        currG = new Array(numLinks);; G! K! w2 F3 G' f
        currB = new Array(numLinks);. |" C3 k3 |: t5 r4 X/ I% e
        count = new Array(numLinks);8 t3 ^: y" y( P3 n& l. S, f0 O, |
        fadeOut = new Array(numLinks);
! r; v# @# |+ j; e$ m8 X        continuous = new Array(numLinks);9 w0 [, i. c4 X% r7 w5 q
        newColour = new Array(numLinks);
3 E3 v6 c  N9 ?2 K4 ?6 @2 e0 W        tID = new Array(numLinks);6 |3 i$ [1 b& f0 V* B! v) c$ p
        redInterval = toDecimal(bgR) / numFadeLevels;
* F' ^2 @( {% `$ o5 l0 S        greenInterval = toDecimal(bgG) / numFadeLevels;
+ N6 q: ^& T  I6 W1 @/ h  t( p* i        blueInterval = toDecimal(bgB) / numFadeLevels;
( V9 {5 h0 Q8 {; c        initArray(currR,numLinks,0);
% Y+ e' B# U! C4 ]. E        initArray(currG,numLinks,0);
' j- u4 v3 ^1 p3 p        initArray(currB,numLinks,0);
! Z5 x, ]* B3 s. M* u" r$ s4 l        initArray(count,numLinks,0);! `: P! }0 n" @: e0 w" w9 I" [
        initArray(fadeOut,numLinks,true);3 y! J4 r+ W4 U3 L, b
        initArray(continuous,numLinks,true);4 l6 S) h3 c6 u
}        # [/ {2 \. z1 h5 c- A7 `
function startFade(id)  t8 ~- y/ E) W* j
{$ `$ e7 x: N- a
        if(fadeOut[id] == true)
3 ~9 h' s1 o5 F4 C0 X        { /*move colour towards background colour (increment)*/( x1 n3 Y" b* e! L
                currR[id] += redInterval;
  l/ V9 s9 Q' F0 U, ]2 V                currG[id] += greenInterval;% D$ a% t3 N4 A
                currB[id] += blueInterval;
+ ]) F* H  z& l0 F                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);; _. I: T1 R/ w4 Y6 K5 F$ u# |
                if(++count[id] == numFadeLevels)
* j" i6 |8 [! x/ C6 [                {
4 Y4 A5 j  t  @- d1 b: @: K                        fadeOut[id] = false;
5 T0 O5 z" O- K* F- N3 D5 _: r                }; d, a- g5 [" S
        }" b- ?- A" @6 O3 d
        else
$ ~. X* P5 ]1 `* H: L+ }        {4 n- Z0 Z% |! p9 x9 `. U4 I
                currR[id] -= redInterval;
6 |) r7 P0 h/ C/ n5 P. ^+ _2 [; e, R7 Y( z
                currG[id] -= greenInterval;6 Y* _) h; w+ d7 I

1 Z2 g' Y1 y0 P/ E1 N1 o' o6 b4 ~                currB[id] -= blueInterval;
6 V9 d* b* W3 A4 d+ F- f% Q7 s7 ^+ c) w; J# s
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
' M9 m/ {9 }9 ]8 i2 }! m( a! w" W7 V6 W: P2 S
                if(--count[id] == 0)
) C* a) O: y% o9 r; V
; d1 v+ A) ^4 e( O                {6 A: ]5 C# r1 h& b. a4 P

0 Y1 R$ i, {( X0 a                        fadeOut[id] = true;
1 \* n$ Q4 F) `! m, l8 C% Z) n0 d+ I5 _  a, `- q' M) H
                }! v3 W0 s" T, B# g5 w+ Q
* _7 R, H+ `0 ^% ]* C
        }* L% z5 F, O1 Y4 V
5 o9 M5 W0 B  f
        if(continuous[id] == true)& v$ P5 A* e' T8 F: ^* p
8 _. Z) I$ R5 f1 J
        {
/ s% z, c& @7 \5 @8 E
+ h( J: ]6 ?! f; }5 ]4 b                document.getElementById(id).style.color = newColour[id];                " ?& w  F; y& i4 t
6 T( i" e8 _" Y8 ]6 \  V& z* {8 v
        }7 ^4 s- l3 w# l  P' {; }( `

+ }0 ~5 P" M2 G( r1 U        else# m9 u; V& b' S5 R0 W2 S2 k/ |
' t9 ?6 A+ ]: q  h6 `" Y
        {, c1 J$ \; j- `/ E# R$ O
8 K# W/ p5 T1 F2 `2 z( `7 ?
                document.getElementById(id).style.color = hoverColour;) H# L* q6 A9 L: e
/ D# c2 A) Z0 b0 }1 V3 q; n
        }3 x$ n, I# u" ?7 n* r
7 y: ~5 W9 L* c
        clearTimeout(tID[id]);
8 Y! A: a* W5 y. b1 W4 A) i1 ~  [% u2 L# i6 E3 z3 ?
        tID[id]=setTimeout('startFade(' + id + ')', rate);% Q- g9 H; y6 o4 y# N8 k

% N, N+ G6 y8 N+ R}8 a! \$ \- Q9 @. K' H/ ]7 x8 {% s

: l8 R8 J1 x! C6 S, I  mfunction continueFade(id)
6 p/ n. M% k. E# j3 c1 @! c6 E6 v
4 P. L# X6 ^$ _! ^{4 \% p$ g0 i6 r. f" L$ j

% v; \3 t4 ?. J! i, L/ U9 H$ t$ }8 `        continuous[id] = true;3 `! D4 R* l& `, ^9 J1 x4 d5 b* d

& P( a6 E! e/ r9 D& ^( g}
3 e8 ?% j* E! o- ?
. r7 ]' T6 I; f& z3 o; |function stopFade(id)" X8 h8 E' _* P

, w- {* ?+ R) n  |" [3 m{
* }; w! n1 U+ j( {5 Q
9 X' _/ }, E6 V# W        continuous[id] = false;/ L7 [: F6 o8 C2 O

0 M6 T7 U- N, U* D! Y}4 q. m) ]/ [. B' s; v( `0 n

2 x( Y/ e2 P! m# o% {( a" ifunction StartTimers()
# a2 |, \; r- v8 U9 e& S( ~3 u* w7 X3 ^" j" `4 ?9 n
{        //set up an initial set of timers to start the shimmering effect1 D2 M: l2 m: U( f. D, ~: w/ q
% T, R  w& g( @/ J# ~
        for(id=0; id<numLinks; id++)
1 t7 i( g3 o* j) {9 j3 _8 k+ Z+ d- {& s( o! f! Y; p& B
        {
8 R+ J' S2 b9 ]' i& v; P% h: N) z( e  z+ F8 _
                t=setTimeout('startFade(' + id + ')', id*100);
7 a* ?1 F5 e8 X. i* w/ O- m  _5 Y. x( s. v4 Z  h' i1 w
        }+ ]" ?& Q( Q# C1 T

+ Z- U1 \7 _$ _) }7 E7 K3 p1 g. G}2 j' ]0 Q2 ~5 T' ~
: K8 {0 F. H8 `' _  G$ g- C* F
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
  v5 K( Q' d. P$ g& n1 V3 W5 @2 |% K- Z3 e/ W8 v$ |
initLinks('#FF0000', 6, '#FFCC77');7 W& d; r$ a5 f% h

4 y4 Z, Y' M: V! q' G//-->
1 j+ C: U6 _4 P+ e) g3 [$ a# C5 G; f* j. P; \4 z2 z- t" {' D
</script>
/ d$ X( D: N0 K1 r<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元
" \3 L: N/ I4 E- C% Y8 N</a>
0 o. x  L% f( H% a7 q3 {<br>
6 _( |* N3 s& C) J, n<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>2 O* ]. H! C6 {" p4 L2 e" D- P
<br>! z8 S/ l0 a4 T6 b" i3 a
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>( w5 g8 s1 S! Q7 m7 Q% I
<br>        2 ^7 y  M' x3 b' N  i
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>, _7 Z8 A; t- i. }; R! Q. D8 n
<br>
  K( _: Z1 ~' u" g<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
  H- m4 J' }0 f<br>
# {8 i, E/ E8 q& a9 x1 m<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>
+ @. {; X% r6 p<script language="javascript" type="text/javascript">1 a3 j6 Y3 ~# x% V6 u( P7 ^/ s
<!--" `$ ]+ m# o4 X4 r, _
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
. ~/ G) S8 k' `- ~8 u//-->
7 O# z' B4 {1 p; A/ S- F</script>