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

zw2004

<script language="javascript" type="text/javascript">3 Y, g, S- h: v5 O
<!--  D9 i6 g  u( D4 m3 M) L
// convert a single digit (0 - 16) into hex
3 x' d+ }  z/ S! p% k5 T/ {function enHex(aDigit)
& E) Z0 F5 [7 A2 S7 e$ ?% Y{$ l7 n' d' b% F" N, a/ [
    return("0123456789ABCDEF".substring(aDigit, aDigit+1))
+ Q' A+ }6 J* ~- h/ S+ M! |}2 ?3 S9 Q; I+ I- p3 V' E
// convert a hex digit into decimal0 C, j4 d% n8 M: y( H
function deHex(aDigit)  V0 A+ t% O1 v* Z% W# \
{0 B" }2 a- D4 `3 ~+ I
    return("0123456789ABCDEF".indexOf(aDigit))0 L: y. G, `" D- u  u% F: r5 g# k
}$ g! x1 t1 |- D3 C6 b3 m& H; B
# T3 R8 C+ o" B+ ?  ?, i2 O
// Convert a 24bit number to hex
5 l. O- o+ F5 K" qfunction toHex(n)
0 z6 g: }. h0 @' k$ m7 n{
9 x0 G' G3 c- j$ w    return (enHex((0xf00000 & n) >> 20) +( x9 s2 P+ Y% q8 q- ^- D& ?
            enHex((0x0f0000 & n) >> 16) +
0 w( T$ ?1 n: J0 m            enHex((0x00f000 & n) >> 12) +9 I- e' Z9 y9 c/ }- Q* s# ^
            enHex((0x000f00 & n) >>  8) +
& i7 T1 N5 f" r            enHex((0x0000f0 & n) >>  4) +
; u2 Q+ c/ @( L$ f1 v. t            enHex((0x00000f & n) >>  0))& u7 E- m! T* {# G
}0 i& b7 k1 t7 O- f; c
// Convert a six character hex to decimal
, @; R* q* K! ~function toDecimal(hexNum)
0 w3 M( V2 u" e# x  e9 ^# j{
! K6 e2 B; F  W/ X  R           var tmp = ""+hexNum.toUpperCase()
8 H! E4 z" v  e8 d4 c1 ?4 v    while (tmp.length < 6) tmp = "0"+tmp
7 n+ J4 Z& u+ T. O* b, K           return ((deHex(tmp.substring(0,1)) << 20) +
( A' b8 Y1 F9 b  @# c                   (deHex(tmp.substring(1,2)) << 16) + 9 h7 a9 R" q% w8 a# l* i. P
            (deHex(tmp.substring(2,3)) << 12) +
, L- p5 z6 [; `- T            (deHex(tmp.substring(3,4)) << 8) +- C3 g" T2 ~$ l% f
            (deHex(tmp.substring(4,5)) << 4) +
1 u$ K& {* u1 m$ {5 C* t                   (deHex(tmp.substring(5,6)))). T0 a* E$ G% b' H
}1 y# Q5 f8 k3 l9 M1 @: C5 o
///////////////////Shimmering Links/////////////////////2 D1 ^9 {; i, I4 `; `! [! X: O
//global variables
% h4 S/ {  m, i6 Z! uvar hoverColour' r7 r) ]- I" H7 y6 r0 L/ a1 J
var numLinks;" S% y5 `' W8 n3 V/ p' l7 @
var rate;
9 M& e6 P+ t5 i6 D, c! G9 @; `" z  o" zvar numFadeLevels;" u2 d6 F7 v) ?* ]  H9 _
var bgR;
# Y% n" ]! c) ?; Pvar bgG;; ]( X* C$ ?% I4 n9 t3 V! k5 s4 `
var bgB;7 X# J$ C4 H) f# [
var currR;
1 Z! `" `6 ]2 s# B, x% y' _  xvar currG;
0 y7 K% w5 l- k5 k8 L0 gvar currB;
  a  P9 ]" j! o  Xvar count;0 w5 x, C( W$ X3 c. g
var fadeOut;
9 I1 r& K$ z, l5 r) k7 Cvar continuous;$ O- z. O/ G( i5 m
var newColour;- E2 V- Z1 Y5 c/ T3 X
var tID;7 Q2 I. p$ H* i5 O
var redInterval;; t$ F8 ]5 Z+ T6 I$ B) e( y' m& M
var greenInterval;/ @* e. N- W6 h  M
var blueInterval;
3 S5 h2 C& N- r. Y1 F& S+ Dfunction initLinks(mouseOverColour, numberOfLinks, fadeOutColour)7 v8 |: m) H( B/ p7 b6 D
{) x1 Y, C$ c1 ~+ D. [1 }0 S
        hoverColour = mouseOverColour;
0 d# L  n: [9 |, i# L) G        numLinks = numberOfLinks;& [5 P& e) q! Z( a2 [
        rate = 1;3 ^5 u$ g& o' s4 B) R
        numFadeLevels = 30;
# X  c0 m7 B* B3 o: k5 h9 Y: l' k        function initArray(theArray, length, val)) X0 i5 Y' n$ v( Q* ?: R8 k5 U
        {: f" H5 T( H3 W# ]/ A
                for(i=0;i<length;i++)
2 m$ @, {3 O+ f                {
; S5 O: G$ R: a                        theArray = val;
+ q  i& _) y) c9 P                }
! S  w- P# Z+ G/ Y        }( v4 u$ Q1 {- l8 l$ o1 ^+ Y
        bgR = '0000' + fadeOutColour.substring(1,3)
2 Z& L3 P9 D7 m3 ~  ^. q) u        bgG = '0000' + fadeOutColour.substring(3,5)
; Y: J: H2 y! ?/ R/ c. [2 ~        bgB = '0000' + fadeOutColour.substring(5,7)2 _6 a; b+ I5 h, p
        currR = new Array(numLinks);
- J9 t$ A, X6 I. ~. I        currG = new Array(numLinks);# C- Y/ T. N* n; Y( G9 J7 b- j
        currB = new Array(numLinks);
8 r5 F1 P: o+ I        count = new Array(numLinks);% X  [8 P5 Q; T
        fadeOut = new Array(numLinks);* k8 Y: V7 L4 Y5 ^2 Q3 G, T
        continuous = new Array(numLinks);, W, c; z; g! o( z
        newColour = new Array(numLinks);
5 {4 K) m! |" ]3 E- s) B: @        tID = new Array(numLinks);
8 W. E! w) t. f! x0 s+ g        redInterval = toDecimal(bgR) / numFadeLevels;; t8 _( k: T- ^- R' Z
        greenInterval = toDecimal(bgG) / numFadeLevels;
7 [5 v( C3 \4 `( |& v4 j7 X9 _- q        blueInterval = toDecimal(bgB) / numFadeLevels;
  S  v  e/ [9 g2 C3 E( o5 Y5 o+ v        initArray(currR,numLinks,0);
, R, d! H  o( u/ L        initArray(currG,numLinks,0);
8 X9 i' z2 X/ m- X( S        initArray(currB,numLinks,0);. F  A: U  B2 i4 Q5 D+ Q; v0 m
        initArray(count,numLinks,0);8 k" m; y- @7 O
        initArray(fadeOut,numLinks,true);
9 v3 j' R9 V! c, Z0 s        initArray(continuous,numLinks,true);" D4 q- R1 J2 Y9 v
}        . s/ {8 Q/ j0 Y4 f3 M" A4 j* N6 }
function startFade(id)
7 k8 K* N8 l0 W2 W: s{2 S  F- @! M- z
        if(fadeOut[id] == true)+ o* M( m  Y: p
        { /*move colour towards background colour (increment)*/: r# R  o4 s! z0 ^9 o2 f
                currR[id] += redInterval;
1 z4 [% S9 C" ?; k5 r5 G* [                currG[id] += greenInterval;
4 g! r* [* B. h* P* A( A                currB[id] += blueInterval;
0 `/ K5 K4 x; H                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
4 Y" X: ^& h* R; ]7 K! g                if(++count[id] == numFadeLevels)
  R& }) [) B9 G7 W                {& q# k" Q1 J$ Z. u9 X
                        fadeOut[id] = false;
! w8 K: q2 e- p" H; m! ~, B                }3 p# T* B6 V  l
        }8 i; q8 X1 X) j$ \4 d7 R
        else
  ~, o8 m1 \( \' y; _( n        {; L8 X8 J& c' |: X
                currR[id] -= redInterval;) [. u5 t/ t, s2 u
: O, j: D/ j& f, n% n
                currG[id] -= greenInterval;
7 D& d3 R, B6 @, s" c8 D
9 F3 k# s0 T1 q* w' W8 ^( I                currB[id] -= blueInterval;# {$ G3 ^" l3 c4 z/ b
$ q1 r5 R1 j, u0 j: ^5 K
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
8 j- ?$ J# l3 V& ?- i0 V! `2 A: H6 N
# m# ]2 C$ c/ i, ~* X2 Y                if(--count[id] == 0)4 ~/ @: }' W1 K. a

5 o9 ^/ t$ e9 n                {
/ ^) r5 Y8 M2 Z) `
6 |3 G! x  N2 C; c# \                        fadeOut[id] = true;
: I7 J& {0 S. K: b; G. }
: q  ]4 F& _1 p! N                }% M; c" o; J) {1 R5 _0 v
! z, s' [. |2 M+ Z
        }( @' K9 R( y7 X/ K
5 S9 ], O$ O. \: V8 _( {; h- i
        if(continuous[id] == true)* X4 g4 {% ?/ K+ Y
! C/ V$ d2 H) ^8 F
        {
. m' I; u2 L- o1 g) d3 h* R+ `, Y6 U$ N' h& A* Q/ _! z
                document.getElementById(id).style.color = newColour[id];               
% X/ g9 [% ?+ u" f
( k, A4 ~# R0 K8 J        }8 m1 u0 p( `# z1 e2 ]5 q" r. C1 I
7 ^/ M1 n7 t# F' E# m  P# s% Z
        else
/ ~" j, l  Z' x8 M) _- N. {" t
) L+ K3 h) ~! s9 w3 N        {
" l  m2 G9 P) c3 R. O7 a' z$ h+ J/ G. C, V% ?0 `8 S
                document.getElementById(id).style.color = hoverColour;: S4 ~! @. u/ o  I8 m' m1 x! v

- A. }" c5 j9 m" e  d2 W        }; B3 F7 p5 o# s; E+ Q+ ^( m+ X

) d4 {" }- @8 A) ?9 I        clearTimeout(tID[id]);
  j6 w/ n& k& p1 y; l( x; P
) H& J. n0 Y& |, {3 Z% g        tID[id]=setTimeout('startFade(' + id + ')', rate);
, V6 U) ?- _8 t: Z2 o7 w( B
6 ^( M6 v* V1 [7 y& j}1 o- F$ }2 E; d0 N
* T% \) ~, Q0 B: C3 j
function continueFade(id)$ a: y- W! t  ^/ g. [
7 S5 U3 D# N/ |4 d1 N  i
{( t- B5 A. u* X- I6 T3 R3 n5 X
, {0 `) E  W1 c$ Q
        continuous[id] = true;
# ~% }" n" J/ M
: A6 Z, z; g3 s$ v6 s2 R}
& M) D. `& O6 u5 w! _5 D9 I7 a" d7 R
function stopFade(id)
2 b. R& F( j- t$ r' s# e7 N  d2 F+ w# ^! X
{& Q7 K/ j9 ?# S
  A) }* U$ ]8 j" `/ R( D
        continuous[id] = false;4 b2 O- P* X2 ~' b2 S
+ N2 z8 b9 M8 d: U  D
}' a2 E/ Z8 A5 l, }& ^  R
! g4 O6 z& q. P: @
function StartTimers()
9 C4 H8 p+ i' |+ z+ Y) _
) F/ P: Y% B2 f! O2 B5 q- k! t# K; V' Q{        //set up an initial set of timers to start the shimmering effect, C5 \, u6 k2 M! O" U7 {0 I
4 ^) C( k  t. g( @
        for(id=0; id<numLinks; id++)+ t9 J4 ?$ K4 N+ {) p4 {
( g( ?+ T: ]2 p  o$ R, I& [
        {
( v# B- b0 Y' w$ v
: E# Y4 u4 L: y0 D1 x                t=setTimeout('startFade(' + id + ')', id*100);6 J! Z: p1 d: d

! H6 j9 b: [* A- @( n* ~/ ?. V        }% ]) S  C5 {4 H( C8 N1 f& p# E

4 U8 e8 s2 b$ Q4 [$ a3 |}
' f$ x; I* m7 n6 _( [& N3 a  F& [* W0 f  }& F+ U) P  \8 Y, g
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
0 j+ C% T# V4 i' |- U/ q( e& \0 c' t! b4 [! n7 |0 p1 c, u
initLinks('#FF0000', 6, '#FFCC77');. b" _. X2 R- P! a4 w
2 R+ K% U1 t0 y' I) M0 Y& s
//-->
  g3 }" N1 D9 O- D- X9 b- K$ i, l- ~& B  Q; C
</script>
& ]1 e1 s9 }' |# Z" i<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元9 @% l! A, g  b% w, A
</a>
, L$ f* j- d) d& }# ~$ g8 Z, y<br>
% X$ ?( F1 U3 X* d+ {) d8 V<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>' u( g: J; J. e: U# e4 H
<br>6 }; p5 S6 `. ?% c9 X7 c
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>9 P2 K7 B  q4 C9 K6 H
<br>       
. u- I+ C9 |! f$ ^<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>; B& C( `2 \5 K* M& u% |2 z
<br>
* Z2 R' p) ^/ ^# D  b<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>  ?% s# u5 o9 r$ Q4 F
<br>
1 k' K4 h6 l( @, a8 R, l3 F<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>1 \6 R2 h3 t0 T  \+ T; i1 U
<script language="javascript" type="text/javascript">5 Y+ h. m2 e) y; O* F
<!--
& z+ a5 q: C! x* V, {3 QsetTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering2 H, K8 r% s3 s% z( E* K; M
//-->2 S' X3 P+ V7 F( h0 _+ C' a  m
</script>