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

zw2004

<script language="javascript" type="text/javascript">
2 p, Q. s7 G( b4 c! J+ u2 L) B8 m<!--8 O; g) y7 ]( x7 A" o
// convert a single digit (0 - 16) into hex; V4 @, G5 p* Q  c
function enHex(aDigit)
8 r- ]5 ^) h$ C0 a" w6 p{7 S2 u' i6 N$ a) x; y2 w8 ?
    return("0123456789ABCDEF".substring(aDigit, aDigit+1))
8 c( Z, A2 N( W}. ?: C! g% I! ]% ^1 r' H+ O
// convert a hex digit into decimal
* j) d) q; Y( o* f$ T6 @* Yfunction deHex(aDigit)
: R( U- [; e: [  Q- n, U{
* q- ]. f& r, t- @. v; x6 b    return("0123456789ABCDEF".indexOf(aDigit))
  w8 y2 N% E; W- L/ K- D' a}3 c& o9 U7 Q( d2 A2 d7 |

) M5 w0 G+ I1 u// Convert a 24bit number to hex4 ]* |" ^" l5 p- K. a" _0 t$ ^$ @
function toHex(n)$ F( b9 a8 ^9 ?) k2 Q
{' E8 B* g9 n8 V( D9 @0 Z+ I
    return (enHex((0xf00000 & n) >> 20) +- p; w$ v6 z* U" P
            enHex((0x0f0000 & n) >> 16) +
# l$ G; T$ Q* k6 _; d            enHex((0x00f000 & n) >> 12) +
- D, A  S$ L: u* ]: e            enHex((0x000f00 & n) >>  8) +8 A( Z5 Y) d2 |/ a
            enHex((0x0000f0 & n) >>  4) +
2 X; ]( l, x. P, ?6 ~$ k            enHex((0x00000f & n) >>  0))
: H* n3 [" b' o5 U& W0 F}
# y: l9 h# Q( S7 j& j# M// Convert a six character hex to decimal) N, W5 I! z: v# w4 ~# ~* J" Z
function toDecimal(hexNum)
4 }& h* g" I" H7 L: h{) c# h1 d) X6 f0 A- e1 a
           var tmp = ""+hexNum.toUpperCase()
) q7 X% r- n( d) A3 H    while (tmp.length < 6) tmp = "0"+tmp$ F* _1 a' q% p, U. E+ r0 Y% A# i
           return ((deHex(tmp.substring(0,1)) << 20) +2 ]8 U9 @; ]5 O1 W
                   (deHex(tmp.substring(1,2)) << 16) +
% u8 T3 d, K" t" E" J1 n            (deHex(tmp.substring(2,3)) << 12) +4 ~2 q7 m3 S9 y! t9 U; K: J
            (deHex(tmp.substring(3,4)) << 8) +
* c- H9 w0 L, P$ D            (deHex(tmp.substring(4,5)) << 4) +
5 F+ _8 I( U* v  o+ A" [6 [# ~9 h                   (deHex(tmp.substring(5,6))))
0 D4 m* p+ i- d8 `4 X+ O6 `}
  |7 q8 S% c, E  L///////////////////Shimmering Links////////////////////// D/ _9 I$ Y4 y% l
//global variables0 D  t4 X) z* N' ^: K; H
var hoverColour
. j& X( |# Q: ~. Z9 x. `2 n# ]var numLinks;
3 A, U6 I, N5 ~$ s$ l& U2 a/ Cvar rate;" b5 X3 ~& e2 i% `& K, t7 a- R# o
var numFadeLevels;: F& {. Y2 }8 X4 a" @+ w8 }6 w
var bgR;
8 K/ b3 \7 Z6 L- c" Fvar bgG;6 Q+ w0 j! V  \' Z7 b
var bgB;8 U5 Q+ }% v, t
var currR;( s" O' u5 a, L
var currG;
8 s  G+ r6 a. ]# lvar currB;: l# k0 L$ j1 F3 C+ S7 p1 _
var count;- D9 _. g! O3 l$ J) f  p; D, [
var fadeOut;. Y4 r% p3 l- P+ h. A( ]; l
var continuous;1 T8 l6 t/ L! E; o
var newColour;4 J2 c# B* P/ U8 S1 }& P
var tID;
% Q; ^8 K( _/ G0 S- ~8 \% y( w4 {var redInterval;
% [4 q, J% u2 k. }# N8 Avar greenInterval;( L) Y, S+ q9 V" x
var blueInterval;% u7 B% Z! o7 L7 m+ }
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
$ Y# u  Y' Y3 U. S8 B! h, ]{
: c) g. W6 _" S% w) e        hoverColour = mouseOverColour;# c& j( A4 D1 {8 F
        numLinks = numberOfLinks;
9 `5 u( y" {  c2 U7 ]) D2 c9 Y        rate = 1;; b, F( {3 M- d$ ?  b
        numFadeLevels = 30;
8 q3 t: X9 V  U* U$ c0 L        function initArray(theArray, length, val); m( J, L  N! Q# e( F  f2 U( d
        {
% K" o0 h8 Z- L- M6 @, ]                for(i=0;i<length;i++)
7 l1 S/ }8 m, M9 R" ?                {
+ P; l2 ^4 |) x2 b; b, c3 D                        theArray = val;) A+ W. C0 }' e& c9 E. l. ^
                }+ @6 i; ]; q5 e2 w5 O* t
        }- F+ V9 O+ y! ^; f+ o
        bgR = '0000' + fadeOutColour.substring(1,3)
9 P2 k% C# ^$ v        bgG = '0000' + fadeOutColour.substring(3,5)( C2 T3 E0 t( Z/ W2 W; c
        bgB = '0000' + fadeOutColour.substring(5,7)
$ _+ R( ^/ s1 {" |+ [        currR = new Array(numLinks);# Q+ H7 T1 }' P% v& i/ Y
        currG = new Array(numLinks);
: f# p+ [# J5 j' s        currB = new Array(numLinks);6 n* u! P# h9 e! g( g
        count = new Array(numLinks);1 i. H1 \% r9 M
        fadeOut = new Array(numLinks);
# \# l2 d! v; G% j7 c6 R4 F7 Q        continuous = new Array(numLinks);
4 n5 b$ C/ U  Z* r        newColour = new Array(numLinks);
, T( {# a# G- i0 H  {$ R        tID = new Array(numLinks);
( t5 q, ]  M( K# y        redInterval = toDecimal(bgR) / numFadeLevels;/ T: G- J! |1 I4 W
        greenInterval = toDecimal(bgG) / numFadeLevels;
: S0 p+ `6 V0 u; ?        blueInterval = toDecimal(bgB) / numFadeLevels;7 M, {- i1 B# b2 h7 n
        initArray(currR,numLinks,0);: Y: p) f) p+ \1 ^6 A& {: h
        initArray(currG,numLinks,0);+ O# z/ n# j$ e5 d" e0 ^
        initArray(currB,numLinks,0);
; i) g$ V8 T8 v+ k( S: U        initArray(count,numLinks,0);
) }: V# w1 N* H7 W        initArray(fadeOut,numLinks,true);6 `$ Z8 f3 {  n1 H" z/ [
        initArray(continuous,numLinks,true);+ }+ \% t9 O- M! M
}        : }* I* x' B' v9 Q0 ?
function startFade(id)' w3 S5 [4 P% D% Y5 O1 W% Z% P
{7 C( _# e  H# i, o% ~% k- F4 b
        if(fadeOut[id] == true)% q4 s! d" d; L
        { /*move colour towards background colour (increment)*/
! ^6 u: T% C( ?8 W5 v                currR[id] += redInterval;' |1 t# q: ]8 Z# L; p
                currG[id] += greenInterval;/ \( y5 ~5 ?: E2 q  H' K$ ^" j0 ~! b6 y
                currB[id] += blueInterval;
: g' ?% o; }1 B0 c( H# Y4 V                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
& E5 z  L) ]7 K5 }: t7 z# m& L% V5 b                if(++count[id] == numFadeLevels)
' `% Y8 G( ]' T7 C7 R. h. [                {2 r9 j* v% v. _" C$ P! s& J  m8 {
                        fadeOut[id] = false;0 g- Y+ Z4 Q) I! E; }3 w& G8 c+ Y
                }
0 t: u% N6 K5 @% z+ ?" P, d        }
7 b: E1 _: s* V! `        else
: C2 b. y9 p! D        {8 J  s+ m7 o! q4 P
                currR[id] -= redInterval;
& V& K1 t1 [# q2 @' E$ j+ @3 v, s; {) \& r: z$ ^+ w
                currG[id] -= greenInterval;* ?. C  }! n! V+ u; O

+ F8 R6 n# Q. y9 K                currB[id] -= blueInterval;
  N" W3 M4 Q& N. [( p0 b4 T: F; l/ e9 ?2 B
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
' u; m: v% Y( u+ }' f8 \/ V. A2 P  Z4 Y/ \0 V) X
                if(--count[id] == 0)1 h8 ]1 x8 O: E+ b& D4 v
+ ]( p" O" C4 V7 l
                {8 m* m9 W  ]+ y* O) m& H
- y, R3 q4 V$ T
                        fadeOut[id] = true;
. L8 n4 `" n0 [! a+ P- I
, h+ r. U# ^8 M1 p/ H                }
2 Y8 g0 D0 D( x2 D; [  }: K# P: P- X1 K
        }& O# W+ O& a3 W& k. N8 E
: _7 |) ^1 x, T
        if(continuous[id] == true)7 v  u1 I7 @- D+ u

9 }& X% i0 I8 h! K9 ^6 }8 }; G        {1 g6 M5 Y# T2 m5 w* ~. @7 m$ J
) Q2 l. K! p' }
                document.getElementById(id).style.color = newColour[id];                5 j! i( {& W; y2 o  f- z
+ {  U) s+ W+ d7 o& w: x. G
        }4 C; J# m- D: \" z4 T, _
% Y; k1 ?* A) e0 h+ h' F
        else" ?, y. X5 b( z0 }
7 r1 o+ e( @- _
        {
* \+ x  n7 U) r/ }3 M7 f  h% p: }5 }( {; V. g7 O7 U) K  S3 f: I+ g
                document.getElementById(id).style.color = hoverColour;
6 x- }) A  o* c# A% ]/ R0 X$ X+ C' Z" t$ K3 x8 o2 D
        }
) e8 C$ Q6 r# c, D1 d3 K. `+ P8 m  W' z% D/ z( z
        clearTimeout(tID[id]);6 a. I! a; X  a- P4 S- f4 h9 N
5 d1 }0 ]2 z" x# O* P
        tID[id]=setTimeout('startFade(' + id + ')', rate);9 h3 ^1 M! [4 Q% s

/ U  S" W+ p' \2 l0 }# Z}3 E5 N( _' d# u4 z- B+ R9 \7 M( Q
8 x3 @2 `1 c- B1 A/ N2 ^7 \
function continueFade(id)) P" ~5 n/ o  Q4 J( \
7 f5 t5 w) h7 |; c: v
{1 O! _& l; r  h, Z
- y$ ]% A2 P2 w  Y7 }9 ?5 v
        continuous[id] = true;
5 i4 v9 A5 E/ N5 S
" u* Z3 o( ?+ I# D. {}5 W* {( F. b  o2 ^  z* U

, V4 M. M. F' Q3 b5 Lfunction stopFade(id)! m& V/ Q3 J- O; P5 d

# O( \2 N+ z* }5 ?  \{( s& t  U# d/ H0 \- c3 N

/ O2 p+ P0 z3 Y5 x" b        continuous[id] = false;
- m$ c. E' J6 I6 d, ^( M. M% ?9 C6 b2 X9 [9 ?
}' U: x& Y) t' |( E

' Q0 e0 r8 h: ^! n9 Z) }function StartTimers()
; J' J& T  b0 {( w
$ p4 s8 t2 d& Z$ ]$ Q{        //set up an initial set of timers to start the shimmering effect
* U  L& U0 P3 I6 [. A2 b4 f0 v1 A0 c- @* l+ j- f. [* {; m0 u
        for(id=0; id<numLinks; id++)) y4 h: v4 ?. ?

! {' Y4 x6 Z) \" @. [8 c7 T( j3 l        {
+ J+ D! r& J% j  T; ^4 T
- h8 Z+ W( K4 E                t=setTimeout('startFade(' + id + ')', id*100);: }: @; k; i# Y0 U9 y8 y$ ?
3 y( ]1 r% W: o) B
        }
1 w6 c; L! N; \  E, k+ {# x8 G5 x& |) g, H* f+ C
}
0 u2 m- M, ^2 |8 D! R# N! O9 ^4 e) H
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')% _6 l+ P5 A7 S5 v3 ^$ U

" d. y3 m! U8 E# ~" G0 E2 C# ]; J6 pinitLinks('#FF0000', 6, '#FFCC77');
; {; V( G, f- q' G
2 ~5 w- y  I  `, Q2 d//-->
7 l+ _6 R9 x% L- @
* t; z6 y2 l' _6 t, Z$ p</script>+ G, K' \1 w* v* I; n5 m$ a" `% K* _5 y
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元
( I5 [2 e' C- e; B& y</a>
# y" |- s& a. @0 N( i! l9 e<br>
0 K0 I2 y6 ^5 N0 t% l% U0 E<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>
( f: m/ C2 c5 r, s( ]7 i+ E" M2 T<br>+ n- K$ h8 B* k+ q. k( E- T
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>+ {. ?' j+ V6 D$ B8 Q, L) I( a
<br>       
; \! D3 U% C% o. k<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>/ ?1 h( d* E$ p2 R1 G$ T
<br>& d# J4 c( `; z5 j* t5 D: Z
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
% [6 Y2 M: s. B( k<br>
& H2 g# T3 u% B/ \8 R. A8 Z$ `0 `<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>
* B. ?5 J; O; k3 u5 l0 }<script language="javascript" type="text/javascript">7 m5 u/ Z4 D: A3 u( T
<!--$ k! U! W7 M! z/ d, `
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering5 o, y: @: R  v* H4 L+ U
//-->
) Y1 E9 Q: b$ c0 P</script>