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

zw2004

<script language="javascript" type="text/javascript">/ ~: K; E/ Y% g
<!--. t& @  }5 {2 z# Y
// convert a single digit (0 - 16) into hex# J, q7 T( Z3 P7 r
function enHex(aDigit)& \, P) |) \; K) R0 f
{
6 N0 c' Q* E' \: k    return("0123456789ABCDEF".substring(aDigit, aDigit+1))
# |: D1 `% W  y; m/ r}" E, }) u4 Z. B- s6 N2 L, \; Q
// convert a hex digit into decimal
9 D/ S+ ~! {$ Vfunction deHex(aDigit)
8 R, H2 M( n8 h6 e0 b6 ^% N{! u5 h& Y, v) w/ F/ k
    return("0123456789ABCDEF".indexOf(aDigit))
6 ^3 I, y" ~: ^5 S4 F! ^% d" H5 ^- N/ ]}8 Y- _& n6 q& X1 u  Z5 w7 w
* w3 H* q% l* R+ d7 l
// Convert a 24bit number to hex% a6 S  h: i- |' d3 \; e) ?
function toHex(n)- ~7 d2 M' o- `$ s: p/ J
{
  F! D2 e9 w! f4 m    return (enHex((0xf00000 & n) >> 20) +4 d" ?1 P* F- }- u
            enHex((0x0f0000 & n) >> 16) +- N! F' `: _3 f# @
            enHex((0x00f000 & n) >> 12) +& }, Q" x8 ?0 P" `) F6 }
            enHex((0x000f00 & n) >>  8) +
& ^( V( k: T5 D' A# K  Q            enHex((0x0000f0 & n) >>  4) +. W3 _# }+ p+ C
            enHex((0x00000f & n) >>  0))
% {' U; s. G9 Q% `$ C6 I}
" M9 ]5 \& `8 u4 U, ~4 H// Convert a six character hex to decimal
  b; s) o, F& j/ J/ N# p9 Dfunction toDecimal(hexNum)1 c, K) `. k0 d+ c# b- Q, B
{
$ D7 s, e7 f' F5 L( X2 y           var tmp = ""+hexNum.toUpperCase()0 I( e8 ]/ R# }9 E3 n
    while (tmp.length < 6) tmp = "0"+tmp0 Q4 `5 y4 l& q/ F( @5 I) K/ G
           return ((deHex(tmp.substring(0,1)) << 20) +9 I' B, D6 |, \2 E; Q; y$ i
                   (deHex(tmp.substring(1,2)) << 16) +
) H1 m* H; n' E9 n+ b            (deHex(tmp.substring(2,3)) << 12) +
1 i& S% p6 P8 v2 J6 e$ r* e            (deHex(tmp.substring(3,4)) << 8) +
8 X( p/ ^2 ?7 M/ d            (deHex(tmp.substring(4,5)) << 4) +0 }9 H2 Z, U4 \. u1 [9 K9 a# _
                   (deHex(tmp.substring(5,6))))
; M6 _1 @  m* d$ v$ V: a8 S: h}
/ W8 P( R4 y+ n0 O///////////////////Shimmering Links/////////////////////
% M1 W7 V7 a, h8 R5 h+ z9 z& i1 Y  l//global variables" C; l. A& }# N7 G& Q6 H
var hoverColour
9 T/ [7 x! V1 Nvar numLinks;
" l1 q3 C5 S0 lvar rate;: ~7 E( k- i& [- K* J% r
var numFadeLevels;# P: ^* p( R+ w" P
var bgR;
6 e+ J) Q& O% @( a( k5 q/ ivar bgG;
. S& ?: s. n- M+ G) \" ?var bgB;( g6 |: j2 \. }# j# o
var currR;0 Y$ J' b8 R3 v  ~% b+ y! y$ m5 U
var currG;
/ Y. Q! w: U6 S/ Wvar currB;
3 e$ A: [6 F" f- o, ]8 o7 Wvar count;
/ J$ M$ w5 v, ]* N% Kvar fadeOut;
0 y9 Y! Z' B# y6 f9 Ovar continuous;
4 R! h/ V6 `8 u% d( u6 O; O+ @* yvar newColour;, z5 X7 Y5 d) `  p! n3 T$ v
var tID;& W# @" d5 w) Q. k  Q' Y
var redInterval;0 e8 O) Q: h0 P$ t8 O! U
var greenInterval;3 q7 o+ p" O5 T# k
var blueInterval;* t/ d; G4 H' H* c  ?0 n4 _
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
, O9 K0 ?7 k2 z# I4 q{: ~1 Q. S1 f' l5 z/ g
        hoverColour = mouseOverColour;
- }. |# ~2 W  k+ z0 r( G        numLinks = numberOfLinks;
1 d5 p/ g! @' f; a; b+ S1 o6 b- t        rate = 1;
# z& Z: ~! f$ n  P        numFadeLevels = 30;
& E. L0 s% R! r        function initArray(theArray, length, val)
( [+ y2 i* m6 z0 j7 r$ L. H* G' j        {
$ T# ?1 X) m3 x5 L                for(i=0;i<length;i++)$ b( L9 z" W3 e$ [# p: d$ o! N
                {  n' I' z( g4 v4 @% Z
                        theArray = val;
5 X% C, @. s$ z; f( ?. u1 n                }/ Q. I0 d* P7 L& R
        }/ h" V, t0 x  F' n# b
        bgR = '0000' + fadeOutColour.substring(1,3)
5 O- b; \4 M( D5 }$ S; A        bgG = '0000' + fadeOutColour.substring(3,5)8 J  Q$ I* ]2 R! ]' y
        bgB = '0000' + fadeOutColour.substring(5,7)
% f. K  ]/ b( l: @        currR = new Array(numLinks);
% z, v5 `) j% u1 ^0 v# z        currG = new Array(numLinks);# q; D- Y+ v& n7 \$ `
        currB = new Array(numLinks);' I0 k1 H, c& N
        count = new Array(numLinks);
9 g. t; w* M6 W; ]        fadeOut = new Array(numLinks);
& i+ U% g. X$ K* P$ T; x7 W        continuous = new Array(numLinks);
$ M/ N8 d; |( w3 w: l        newColour = new Array(numLinks);8 c. B4 ]& S# x& W9 S; I2 Y* t& B
        tID = new Array(numLinks);# k& `4 r/ ]' M7 c- I
        redInterval = toDecimal(bgR) / numFadeLevels;
" x, p2 t  R. n9 r/ O        greenInterval = toDecimal(bgG) / numFadeLevels;
$ H* _5 Q& T6 @$ C        blueInterval = toDecimal(bgB) / numFadeLevels;) E& J5 ]) s9 Z. d# W( [; q. C
        initArray(currR,numLinks,0);
5 u( l7 [5 {& C5 E$ i        initArray(currG,numLinks,0);2 f1 r" `3 P( u
        initArray(currB,numLinks,0);0 U/ h' M) [7 I, }
        initArray(count,numLinks,0);, U, q/ x: k& \* E
        initArray(fadeOut,numLinks,true);
1 J" |0 O% S; p6 }. C1 O        initArray(continuous,numLinks,true);5 n2 G: U& S3 e. Y0 N5 W
}       
) [9 Z$ d  p  N9 T* _* ofunction startFade(id)
  A: ?# U2 w7 A0 q4 I7 ?{5 \1 E) s9 O7 _* h! W0 p2 i
        if(fadeOut[id] == true)
' A$ U, J" k" k+ u* m, H        { /*move colour towards background colour (increment)*/; X  h+ Q3 V; a, v* K# J8 y  x
                currR[id] += redInterval;
% N) g; Q' y2 x2 O/ J                currG[id] += greenInterval;) m0 c) I1 [5 p& T# a
                currB[id] += blueInterval;
$ y. y8 x* `& F8 r9 L                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
- _7 F. g( t" ^2 w+ R& ^) ?                if(++count[id] == numFadeLevels)
) k; I8 R2 @$ Q5 A1 E0 O                {
- F. A  \3 U1 R: ~3 G                        fadeOut[id] = false;
9 J7 @3 |# C' U. j# N  {                }
: \# `, n2 w8 r" E8 R        }
  m* y0 \/ W8 b! X6 O2 I        else; P  ~; U% E  v' t, z2 C+ [
        {0 ~) g! \# a/ g) d' f. X% x% b! P
                currR[id] -= redInterval;
. w/ x% @2 }' y) L' S1 h; F' G- t! d, I, }2 m, i5 Y2 m
                currG[id] -= greenInterval;6 B0 m7 |; C% Z2 O+ C+ Y' o
6 f) N7 r* ]4 ?6 N
                currB[id] -= blueInterval;
$ Z, ?! a' p' R! a8 ~  v( T9 G7 i7 p  j8 B" a) E
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
8 \5 v2 j* i/ y8 I" x5 Q7 I( E# g9 Y7 ~1 c3 v
                if(--count[id] == 0)) ^, }/ N& ]7 R1 ~" Y7 c3 X

* |; @6 M9 L2 R2 n: c1 N* d+ d+ B                {
1 ~3 w$ q" W, G8 e& G- X  v2 W, f$ O; \0 Q5 H/ @; X4 E
                        fadeOut[id] = true;4 z4 t  o- c/ G* v
8 G0 h. |8 j3 E9 s8 [
                }
6 `) A! _7 f- ?, J5 k5 S4 |+ b1 r# E/ l# D
        }
* L8 t' |! x" H% C
7 q: o" V6 y& f  `* `        if(continuous[id] == true)
) G9 x$ Y8 s5 F, {% t! C) b( \- ]% ?. W( X5 g
        {
6 M$ Q# ^, x: M
* p  J- Z* i7 }                document.getElementById(id).style.color = newColour[id];                  A$ r- s* T: f( h8 f% D

6 C/ K7 T) s8 _4 E7 S! _' q, }        }
! ?3 m; i1 v2 M8 g. s' w$ e+ Y. l7 a
        else7 R/ t# x" i1 y; J, E
, n& d( M7 W5 D/ e* {* v6 ]
        {
  @% d3 R2 F3 G/ w- b1 r  G- k8 b; v& C4 F9 F7 C. q( _
                document.getElementById(id).style.color = hoverColour;# Q! Y4 T, P1 B  E
- W' w/ z5 U* [4 A$ ?6 S3 v. |* }
        }
5 D8 U" |2 N7 m4 M5 v8 [9 c
2 ~8 ~! f+ e1 i+ N! V        clearTimeout(tID[id]);
# j4 Y( ?. F8 C' i" U1 q+ o# q. Z3 o) ~
        tID[id]=setTimeout('startFade(' + id + ')', rate);
, M; V2 a0 d. G; y
1 C5 f, x% z( f2 X$ @" H6 @' U}
- Z8 H. ?$ v, H; D& h% a6 ^) i
" h9 z: \- T$ X. o1 R# V& i# |function continueFade(id); V; v! U7 J5 P3 e. H& B, B

/ Y* v3 J4 u3 X8 w6 Z+ ]/ o{
& R2 z/ m% J5 D  R( `, ]3 ]3 p+ K* v
( Z+ Z% N4 B; V5 D$ |' Y4 y8 X        continuous[id] = true;
+ b! L. q: l. v" @6 P7 X3 ~
: U( i1 e4 f, @, `' E}
3 H4 B7 l  Z8 R0 }  c. J( @) P
, q' \, l2 Y: P8 n- Kfunction stopFade(id)8 Z* q6 |; F+ H' Y
; E. v8 h/ `2 s/ P) i0 J7 v
{; U# q; w6 W# w% H! p( ^

( b5 w6 q. a. P' e6 o        continuous[id] = false;* R% @. P. I' F3 q$ F
- F. e- ~% P* z) m
}9 e  C: W: y! ~/ n0 C2 m" b
/ g$ r# q2 A. G' s, w) G. ^
function StartTimers()
" u& E! }, n; P* }# o
5 r5 f! _  e0 X" T2 W" H( O, D' L{        //set up an initial set of timers to start the shimmering effect
/ W9 q8 `4 I+ O. A$ E: f
4 Z0 y# D- R* H3 }  j2 p        for(id=0; id<numLinks; id++)
2 B1 B& Q( I' U$ [& D7 U; o( o
) K& X. v. u, r0 ^1 H& j3 Y6 d5 N) G9 A        {
% g: Z. w  M/ I( d# y% X) b. e% p9 v
                t=setTimeout('startFade(' + id + ')', id*100);3 N* i3 ^( G8 e* W. K$ C1 m

' B' u0 x1 g3 N        }! n: m3 t( {4 \2 j. ]4 e
1 _# E5 y  ~) ?8 v, c
}4 t. W" }( _6 y
' S0 d! m/ @( U
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
6 Y6 l& \% ?6 s6 ?# W  Z% ?
+ W% n1 A$ g( ~2 c, g: UinitLinks('#FF0000', 6, '#FFCC77');4 Q* J) J+ |% E4 U9 p7 ]
, L7 ]1 |" e+ L! N2 H$ U) I: z( M
//-->+ E" R# u( W% g, n+ \1 S1 B

4 z5 ]& N- v+ @1 \6 Q</script>
; d. @7 y6 U6 v% _( T<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元
& _, m: y. q/ D; ]/ }& S</a>
7 S4 b' U1 S- }<br>
: P: Z& B- V; }- w; N6 n<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a># ?5 y5 f2 q7 Y4 D; @; c' s
<br>
" b$ x4 @3 p. @+ Z0 Q" @: U3 z<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
+ K2 C  m" I0 q- e& C! D! Q<br>        , S3 h! D/ m* [1 P. U/ d
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
7 \2 h- _( [5 p<br>5 K& g  K* X! P5 V
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>" r( F! u5 D0 T; G
<br>: \/ R- ^  S. J$ g" A
<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>
8 a! V+ J, J; H& y9 q<script language="javascript" type="text/javascript">: i& g" K! D* G6 Q) R% o
<!--, M1 _; q* U3 B+ `# D+ ^. w
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering+ Q; |6 [; [8 O4 u* Z( z# j
//--># J+ G" m! o$ f1 l( F3 Q
</script>