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

zw2004

<script language="javascript" type="text/javascript">5 P4 n+ P. S! ~- K. Y
<!--
& @& \/ W0 R) H$ l/ t( m/ }7 r- P// convert a single digit (0 - 16) into hex- i; T0 }5 H7 @8 R% q
function enHex(aDigit)* ?; B* k3 J- ]
{5 L2 o  P( e% ?# y& T+ t) \
    return("0123456789ABCDEF".substring(aDigit, aDigit+1))
& P9 G) }; q1 x# n4 }7 E8 s( R}4 [+ J$ F" y  ^; b$ o6 T3 S4 W5 O
// convert a hex digit into decimal
* e% k* d/ X# _, s+ Tfunction deHex(aDigit)
3 ?5 I: Z7 f! Y( j3 l) X{
) E6 F" y0 U; t7 g; v    return("0123456789ABCDEF".indexOf(aDigit))  [. \  c' ~( R1 v# l0 P
}9 ]" @7 Q8 R+ e. T0 Z$ I9 S$ ^
0 U& {6 f3 j+ K/ l# }6 N) a, h
// Convert a 24bit number to hex
  v4 K" n# Q9 t3 @) Y5 N% N. Cfunction toHex(n)2 {7 g: R7 K+ U/ N5 o9 h
{7 s- G- T1 p" S& {
    return (enHex((0xf00000 & n) >> 20) +
/ j* c& K, T4 w& u9 x) U            enHex((0x0f0000 & n) >> 16) +1 E% p$ O& m( |- S7 v$ _5 T
            enHex((0x00f000 & n) >> 12) +$ X- I5 I. F1 y7 y& y( w/ E
            enHex((0x000f00 & n) >>  8) +& I) J2 F8 c4 O4 J
            enHex((0x0000f0 & n) >>  4) +
6 R% A4 ~! Z# _$ r6 a. \, E5 n            enHex((0x00000f & n) >>  0))
$ P+ o8 m3 u4 L- b8 F}- }, R- D: }9 R8 B0 B
// Convert a six character hex to decimal: @( r. J0 O8 o* \1 I- Z5 E
function toDecimal(hexNum)0 q0 y5 w; E( O6 Z' K
{2 L+ {( \* m0 d% \. A+ Y" K
           var tmp = ""+hexNum.toUpperCase()
% ?7 \/ J2 A2 Q/ d8 k    while (tmp.length < 6) tmp = "0"+tmp( U4 K: d( @% s9 ~. o
           return ((deHex(tmp.substring(0,1)) << 20) +
$ I: @) E& z$ A$ n- z' m0 _* [                   (deHex(tmp.substring(1,2)) << 16) +
; f) `& W' [- Y: U$ c0 p% q& B            (deHex(tmp.substring(2,3)) << 12) +
6 T9 s4 \9 S- A  x- c3 k            (deHex(tmp.substring(3,4)) << 8) +
$ ~* R* q+ t2 W            (deHex(tmp.substring(4,5)) << 4) +% C& a* ~" j5 n" f' O6 c6 I  F
                   (deHex(tmp.substring(5,6))))% |2 a* w  p& |# s  j* g5 D
}
2 x0 @- A" V. Q- `& b6 q) ^2 V///////////////////Shimmering Links/////////////////////
9 z" S: [9 B% [" c2 E//global variables
) S5 b6 @3 \$ evar hoverColour. N5 {# k! C" |9 Z  E* o9 U! y
var numLinks;4 E) M4 E+ z( ]) V6 O
var rate;4 p( @0 k/ V$ D) N3 o8 ?& x
var numFadeLevels;
3 R$ }" i$ ]- a1 L: hvar bgR;
. b0 p( Y7 ^0 z5 evar bgG;4 P- _9 i$ K, V: e
var bgB;/ ?8 S: i! z9 y  h
var currR;. x. {4 i4 y) n* Y4 x3 u/ w
var currG;6 k2 l- c; C& u" |3 ]9 o8 w
var currB;( Y9 G  ?' `$ C" L$ b; a  m$ l
var count;7 h5 z0 F0 q! v8 J$ Z
var fadeOut;
) k: I( h6 }. m5 Q6 {8 _/ z9 Hvar continuous;
! ?( Z! w# V2 r: Wvar newColour;
* M5 \7 G/ A8 N$ R1 j" D6 uvar tID;, F% _3 J: F* G. n
var redInterval;9 E* U7 R6 A. V! L; a- V) A8 z
var greenInterval;/ ~3 P: M# l2 ?. Q8 b" f+ O+ R6 |" \
var blueInterval;
" c2 ^- C% i: wfunction initLinks(mouseOverColour, numberOfLinks, fadeOutColour)- `# e9 j& M6 B
{2 K! {5 H3 p9 \, p
        hoverColour = mouseOverColour;
0 E$ z! `. p% b  [0 i( u4 l- ]        numLinks = numberOfLinks;
0 g7 @0 |( O  l  d* ]9 \! x        rate = 1;
0 F8 H7 `6 A# }6 o  y2 t0 h( ^9 v; }        numFadeLevels = 30;
5 D, n& C& s7 x6 c& T/ j        function initArray(theArray, length, val)/ N' e$ J& m" J2 F0 T
        {0 a& x  Y' y2 y% ~, o7 D; `
                for(i=0;i<length;i++)& f2 ~  V8 V6 Y' P) g
                {
# h: K; D- n( T6 t, i$ B2 v                        theArray = val;
' }  O8 {; Y8 |/ ]                }& S" s  g6 o/ k, u- G! T( {6 {' j
        }& y0 ?8 V& X$ w  h% w( x8 |
        bgR = '0000' + fadeOutColour.substring(1,3)2 T7 E& e( f6 @
        bgG = '0000' + fadeOutColour.substring(3,5)
% P& ~" P& J- w( Y        bgB = '0000' + fadeOutColour.substring(5,7)8 M/ t% H5 R- W; _* }
        currR = new Array(numLinks);+ D" {9 H/ `3 x( E8 ]+ U- g
        currG = new Array(numLinks);
6 T/ d) l" |  |: L        currB = new Array(numLinks);
* V4 o% Q- H0 V: p4 }* u" B        count = new Array(numLinks);( [1 h8 E4 C5 Y! W0 T( k' M
        fadeOut = new Array(numLinks);
3 h3 G# K5 c8 n0 o0 R1 b8 t        continuous = new Array(numLinks);
) s: K. f, Y: Y9 ]$ a        newColour = new Array(numLinks);
' _0 m2 O6 L* |/ ^6 o  l' q& n4 n2 M        tID = new Array(numLinks);' k; |  n3 j' z5 g
        redInterval = toDecimal(bgR) / numFadeLevels;/ _2 ?9 Y5 i/ L! i& y( {7 j
        greenInterval = toDecimal(bgG) / numFadeLevels;
4 L$ ^* G( x% V5 ~5 D! i6 e        blueInterval = toDecimal(bgB) / numFadeLevels;' X  C+ f# g1 P; d3 \
        initArray(currR,numLinks,0);9 r! i# e: W5 M( ?7 b+ R$ C( K
        initArray(currG,numLinks,0);8 d* Z7 a! t% V: q# C* ]
        initArray(currB,numLinks,0);6 j9 Q5 G, Z- @+ a
        initArray(count,numLinks,0);( n5 A/ [, M6 c; i
        initArray(fadeOut,numLinks,true);
4 ^; K" O3 |3 G% F9 n6 N        initArray(continuous,numLinks,true);$ d7 H  S: W4 `! K$ P' H
}        ! Y3 ^# Z; d  ~% t' }% {' ]' `
function startFade(id)
. b3 s9 |$ H1 M( Y2 E8 e7 a6 `{
! {6 v' M* w3 S7 s; x/ u        if(fadeOut[id] == true)
) d9 P% w+ Z- Q2 Q* `: Q        { /*move colour towards background colour (increment)*/
# X6 d6 E% v" K1 S, X                currR[id] += redInterval;2 K% f) U, _2 Z
                currG[id] += greenInterval;
! ?+ x1 T" r, c, n: R( k6 i                currB[id] += blueInterval;. ~; t& C6 \' n7 X) h6 [' Q' D* |" n
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
0 d% G; P. T  A                if(++count[id] == numFadeLevels)' l. E$ N! O1 A( f% V
                {: a) y3 N0 I/ k! X
                        fadeOut[id] = false;
" s9 W$ V+ j' R1 r4 n4 E3 M                }
: N3 |0 G0 x# X7 {/ i        }
8 W8 H( I8 o. n  o7 y4 O% Z0 V        else3 E: @. K- n; v( E3 h; T7 X1 K/ d
        {
8 f7 G2 s7 j% O# M1 L3 C1 b$ j2 q                currR[id] -= redInterval;
2 q' R( O4 Q! {* \) a: p* h* k' {5 Z5 G& [6 P# U6 l
                currG[id] -= greenInterval;4 P  k: \8 e% b" L) S% ?& g/ G1 V

. r3 S7 s& j1 e2 M% V  y                currB[id] -= blueInterval;% k" h; N; x! z+ v9 S

! f* K& W  v  o, ]                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
, q2 X) T1 r7 K3 z
" N/ l2 b1 |- d8 ]3 @, j8 k                if(--count[id] == 0)" V1 h: |: H4 U+ _. Z

# l% s8 e9 z! N) ~: o" p5 g# w                {" J3 }) s  _+ A( y# k

$ w$ r1 \& H8 t# G( J' [                        fadeOut[id] = true;# B$ Y6 v! F) m4 ^7 _+ ]& w- e

1 r+ M/ v* ?$ {7 @' v1 F# z$ i                }7 J& o6 S; A4 X9 Y' r# E* b

( L% U0 t, S6 I; `! ^4 Y8 N        }4 y! P8 M8 V1 B0 E; j4 l

/ k9 X- ~  v% F* h! C        if(continuous[id] == true)
4 u- R2 t  W* ~; S3 u) \; o2 b1 r
% d- n% t* D, ~! Y+ [/ }, [        {, |2 G# }0 r) V" W0 ?7 t
* S1 u4 ~2 b' U/ N5 z4 n
                document.getElementById(id).style.color = newColour[id];               
! L4 c5 _* L" Z" ~) j0 d. O2 W! B* D* I/ F( ?) W7 V+ _
        }+ e* Q. T9 I6 c$ t% ^% c7 u5 G
& G% T; V' D' r( s
        else' y9 f4 l9 f# H

) N( y& J% k  ]. N0 p        {
, Q' R! }3 [( V* i9 h5 k+ G  y6 C6 E# f' s/ G, w* @: N5 Y: O
                document.getElementById(id).style.color = hoverColour;) o3 S4 `7 U- v( E- P

* w7 a6 ?6 R, v, h- g+ ^" T        }! T1 H, w" D, h4 h- n8 _" C1 W
/ v6 a' F! i: o+ w8 O
        clearTimeout(tID[id]);
1 Z; c" Q/ G0 C& U: t1 v9 r/ V  x
        tID[id]=setTimeout('startFade(' + id + ')', rate);  q- _1 t+ E* a9 Y/ f9 x7 y5 t4 D
" c' i; J/ [  K& t
}
) l  z) N7 F% S9 }0 g1 |" s: c+ y9 a* }* A' k0 X
function continueFade(id)% o9 k7 I9 G- k+ W
2 G( ~: l0 t$ K
{4 N& P9 n0 [" c' {+ w" C5 b, E
1 K8 e0 C" p4 `& s7 K' z; |
        continuous[id] = true;2 t- |; p" W3 C$ p0 U

. f+ X5 r( d* u# q. V}" f! U: K+ O1 v
) M1 I8 ~, C( j, v' o! G7 ~- R
function stopFade(id)
$ h+ u1 A' I5 ]: B# y
' ~! ?" d: y5 T8 G( `- b{
6 s# B0 j4 e; J4 M5 h; M" q. o3 `/ ?- L5 D
        continuous[id] = false;3 c& L/ }* h- [1 c

2 ?# _9 P7 e$ D, P4 Y  z; G; q}" x: ?4 P# a. q7 c2 |9 O
% O' |( M6 R+ h1 z) I
function StartTimers()) Z; Q9 o, K# V# e0 K% Y

* U/ I" C, r, }{        //set up an initial set of timers to start the shimmering effect& \8 ?7 o" ]4 i2 a/ x, U
2 _7 }* r4 `3 ]8 y' n
        for(id=0; id<numLinks; id++)/ _: ~2 l3 u+ u- l. _
1 I$ J  V3 f$ Y1 M
        {6 W; H! h' z* ~5 d6 K, K) a/ K
: Y, _' b; A9 O- j: d
                t=setTimeout('startFade(' + id + ')', id*100);: f& O5 r# a; n: l' E# J1 H: `

2 `; ~2 @$ ]- Q  ]# B# Y, D' e        }
; p% o( W4 z) r5 |' b5 W
# M3 w- \. [' Q# [5 |}
8 D& G! b$ }& G, n% P
+ p9 I) ^+ }' e0 W! ]' w4 @//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')2 V5 k- R4 B: D9 J

2 k8 {2 R5 j/ C2 T9 |1 M" d" e0 \initLinks('#FF0000', 6, '#FFCC77');
1 v* S' A3 v6 R0 G, h, A& w# G. x+ C3 f( ]
//-->) X4 u# U2 V/ A' _! V/ T, I+ f( k2 q
# C8 e* S( a( {/ r, [' ^
</script>
& O9 g2 w# e$ S3 Q" [% f9 a7 J* S- g<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元: Z- s' S0 J( C
</a>" c8 G+ ^9 [6 N0 T! H5 x4 Y
<br>
2 r, v! j4 Z1 H<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>
, H3 X, x& g: v1 r: e3 v9 P<br>
( C) ~0 `, y4 x4 d% r2 \3 `<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
' V5 v6 s/ ?$ s+ Q# J. q8 m1 j1 E& u4 y<br>        5 r. ]6 C$ p; \; n# ^% ]
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>1 ?. V8 ]6 F" m
<br>2 _& s$ h! D$ `0 {/ j  d) o% F
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>  _2 N3 O6 ^1 p) j. P7 A0 h2 S9 K3 P
<br>
$ p9 H9 R! G" h7 P2 W% z0 U7 o. g9 B<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>* k0 K# O+ p5 p& Y
<script language="javascript" type="text/javascript">) X; X/ G7 P+ e) [( ?
<!--
# }7 R2 G( d! S7 o1 H8 rsetTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering. [( @7 e; y) N, m. C2 Y' P8 ~; E5 h
//-->
) f" w+ i& d% h5 d5 {</script>