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

zw2004

<script language="javascript" type="text/javascript">6 |" i6 [/ y0 F1 V
<!--
+ ]% A$ B& D1 D- r4 U8 k8 S// convert a single digit (0 - 16) into hex) x0 s6 _# Y+ E
function enHex(aDigit)8 C* d5 S/ @' k* n
{. j6 X6 c2 X  A/ Z4 ?# h9 `+ Q5 Y7 X
    return("0123456789ABCDEF".substring(aDigit, aDigit+1))
- O$ ?1 }- N3 u9 C4 |& V! R6 A3 L}
$ r+ `; [( S  i- X6 B6 S6 g// convert a hex digit into decimal3 p1 z' V( _0 C5 t% c; O' ^
function deHex(aDigit)# M  m& w( q2 U6 g9 X; j
{+ J  [, C  \5 Z; c
    return("0123456789ABCDEF".indexOf(aDigit)); ]' i) s) g6 l" L* O0 ~* Q
}( ~  }4 A, y; W! ]7 X1 {" c

- d+ ?% R6 W  _- f( a! a// Convert a 24bit number to hex( }: I: R( ]9 l5 c7 ?" r
function toHex(n)
1 [: l8 {3 Z( C. s. l( i; Y{
1 u$ y3 ^1 y; g( @, N    return (enHex((0xf00000 & n) >> 20) +
4 i8 X+ q) a9 C9 Q            enHex((0x0f0000 & n) >> 16) +
8 U! b1 D; O4 Q, _* c            enHex((0x00f000 & n) >> 12) +9 t* O+ Y+ p# D
            enHex((0x000f00 & n) >>  8) +7 ^- p0 U$ ~5 q$ s6 y' D
            enHex((0x0000f0 & n) >>  4) +
9 d& X6 T1 [% u+ y7 ^* l- n            enHex((0x00000f & n) >>  0))" [1 u6 q! c$ j" v! O0 R) D* b
}1 }* E/ F* n( I. _& D# {8 Z
// Convert a six character hex to decimal
% p8 t# e" A$ V) D7 y& e2 I% k4 rfunction toDecimal(hexNum)6 x% e, Q+ I3 R6 X
{1 I5 o% b6 I/ }
           var tmp = ""+hexNum.toUpperCase(); ^9 y+ S% P0 T; l
    while (tmp.length < 6) tmp = "0"+tmp
/ G, h+ D# ~1 X" D1 h% r           return ((deHex(tmp.substring(0,1)) << 20) +
* S8 [' |( K/ M! S                   (deHex(tmp.substring(1,2)) << 16) +
! j' W: y) n; t) Q# |            (deHex(tmp.substring(2,3)) << 12) +
, n, o+ `3 k0 A- w            (deHex(tmp.substring(3,4)) << 8) +
: J+ M5 P2 v7 D" K            (deHex(tmp.substring(4,5)) << 4) +8 f  U, B$ T3 W" w) I) P% F1 \
                   (deHex(tmp.substring(5,6)))), P9 N9 T. f6 x5 ?; l8 q
}8 C! d6 P) D& O' f. S; m
///////////////////Shimmering Links/////////////////////; y" n% \# ?/ \0 N6 [
//global variables
$ ]1 C; m. D# v# k4 \" f$ wvar hoverColour
% D, W8 x/ S6 p3 V* kvar numLinks;
) G3 v2 E! E+ t' u7 r: Tvar rate;. k# k8 a3 \$ z! i" U/ ?) C. f
var numFadeLevels;( X. |7 s" H8 K3 }3 E6 F. a, |) M
var bgR;
  E/ R9 W/ Y( r- a$ q6 Mvar bgG;% k$ u; V; F7 u/ o0 h. J8 y( ^. O
var bgB;7 {2 h( E- Q7 W
var currR;& V7 l, a: s% }$ l
var currG;
+ {8 y& E, w; ]7 Dvar currB;5 @1 v) l0 E7 R4 g9 H
var count;
2 M4 k% }  [8 W2 {5 |var fadeOut;
; }" s2 B* }: Tvar continuous;$ u5 h; w7 H" R( e9 U8 [6 G
var newColour;
0 o" ?; L% s( Y2 [* t7 g1 y& qvar tID;
: ]7 P, y- D) Tvar redInterval;0 G' S, u. X9 ]
var greenInterval;
8 o0 F" n# y' V6 gvar blueInterval;+ [6 }1 B* q" r' n
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
3 `4 k4 }; ?. D( d: `! G7 Z{
" n" k" b% L" J2 c3 M( b        hoverColour = mouseOverColour;
3 t; V. K9 y2 k0 A% K        numLinks = numberOfLinks;
9 [$ Y7 q5 x( D6 a- w/ ]0 R. O4 `        rate = 1;
$ g9 s$ R  u  a3 g: L        numFadeLevels = 30;
8 Q$ _! X! Q% f: b% E2 q  Z/ E        function initArray(theArray, length, val)& z9 T8 k& m* `6 N8 Z. o" P# W
        {
! z0 g9 {" W" b- }                for(i=0;i<length;i++)( l: T3 r$ e7 R- M
                {# `" {! H4 @8 z) X; h+ x
                        theArray = val;
( B2 C- Q5 ?) I+ M                }$ a/ G  A: _* D4 j' e
        }1 z& j& `% ]- e/ N" e! P
        bgR = '0000' + fadeOutColour.substring(1,3)
- R- c' m+ D" g: v3 K: V2 n        bgG = '0000' + fadeOutColour.substring(3,5)
9 v, s$ z1 G& F0 x1 S5 g: X        bgB = '0000' + fadeOutColour.substring(5,7)
8 `# p& R8 e7 Y% l        currR = new Array(numLinks);, A' I7 x) P% B. `
        currG = new Array(numLinks);
3 `# x" ^: @6 ?3 S9 e, t        currB = new Array(numLinks);
2 w8 G/ k* A" s" x' L6 v* n        count = new Array(numLinks);
9 C" a; t8 g3 H4 M5 W        fadeOut = new Array(numLinks);6 v' `! c% u( }
        continuous = new Array(numLinks);
7 C$ }$ u: h; s0 v' e. u9 n2 u        newColour = new Array(numLinks);
% H% N8 d( u3 R& f" e" E        tID = new Array(numLinks);$ w* _9 }: q/ z; o  @$ O
        redInterval = toDecimal(bgR) / numFadeLevels;  `  Z7 _+ ~: ~
        greenInterval = toDecimal(bgG) / numFadeLevels;
9 Y' O$ {5 a% _: x7 t+ f        blueInterval = toDecimal(bgB) / numFadeLevels;
; S% y( Z4 O$ H! ~9 r8 P! ^        initArray(currR,numLinks,0);
' m0 f! F/ z# S- ]        initArray(currG,numLinks,0);$ ?  o- R  ~* _
        initArray(currB,numLinks,0);
4 p& i7 t( C  e, f8 [2 |        initArray(count,numLinks,0);9 b1 e4 z! D4 W
        initArray(fadeOut,numLinks,true);
' W1 Y5 y: K% G$ F$ U" s        initArray(continuous,numLinks,true);( a0 u* C' S$ m2 T4 T* R
}        ; R* m* U# r  w# p6 }. S
function startFade(id)
$ w9 z! J4 X* e{8 ~1 z( n' ?# n
        if(fadeOut[id] == true)
0 U( ~) V% G1 z9 s4 \- |        { /*move colour towards background colour (increment)*/
/ A4 Q$ }, I8 N0 A6 C                currR[id] += redInterval;, j' d( B4 Q! v! l
                currG[id] += greenInterval;7 f7 N& ~$ z/ {' k( Q, b
                currB[id] += blueInterval;6 C4 h) S8 y5 O- P& y" w! X4 j8 x& |
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);& L- F. J: W3 P$ D* W$ Y8 E0 B+ V- z
                if(++count[id] == numFadeLevels); O9 ]1 _/ _/ s2 W' C# g3 N) R& [) M
                {
# x. v2 z; ~9 ?1 P                        fadeOut[id] = false;7 Q! M9 T1 [, l4 @% l7 U2 ^
                }7 B( E: A  h8 G# p1 g
        }5 K) p- ?% ?5 v6 W: P, C: D! T
        else$ S6 H( e1 T9 V" V+ u% H- a+ H
        {
7 c0 w7 I7 l% z/ N& d& R1 o1 H                currR[id] -= redInterval;! g( L5 p) {8 A% m# d

  t) w% r1 y1 b                currG[id] -= greenInterval;3 v& q4 s# t( t& W
5 S# E& P$ b3 `) Q9 E# o
                currB[id] -= blueInterval;
0 n1 L+ _# y6 u' G
# p& t; J: c( C4 c' C  ~$ ?                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
- @. [8 c- B  S) C1 o4 h
5 m8 E, x) f! {/ u, }- k" p                if(--count[id] == 0)
! F) i+ O: [7 A* U' r* H& b0 I) q8 H. X* r( R  T- h
                {2 w8 E& L  Q! j: x5 d( r
, W  w7 Q; L+ X1 F
                        fadeOut[id] = true;
0 _& [* a, b: x$ M6 j
  C4 V. K" Z% Y                }! S  ~; x+ M9 y, \" X" H3 Z/ b, U1 R! B
6 d" I" L0 c+ z* w+ \! E, L
        }$ ~2 ^+ `% e. O5 H+ F
7 j7 O" w! Q0 e* w
        if(continuous[id] == true)
( \4 Y1 ]8 \& z; e3 K) d1 e
9 d  }9 O  q% }9 V( @% S( h        {
" m* S; h. ]. g4 V# N# M
. ]2 I. A, ^  p' c6 c                document.getElementById(id).style.color = newColour[id];                9 o1 q" E0 F! J, i  d" j' j: q0 ~

6 N2 M. s* z  l7 U! c/ J        }
1 ?3 H& @+ o8 R! {% t* `4 c5 n
6 N0 ?2 w' S2 p5 x        else
! C: @8 `1 b" y2 k$ m# K
, g! }& q6 A& T7 r8 {- L% ?        {7 j+ P) v* ^9 [# Y! w2 z" a
& F. |* H+ A' D( i" d
                document.getElementById(id).style.color = hoverColour;
! l: D  `  h4 G/ F& r; t. c
' n% D* A% p3 Z" f( P# @        }
* A- g3 E9 K9 k3 L
- `' Y, [1 l% J        clearTimeout(tID[id]);2 W- D2 s7 p# ]4 C; s
( Y9 u0 O* J  a
        tID[id]=setTimeout('startFade(' + id + ')', rate);
/ y+ c  b' u1 [1 f) U
+ P0 t; _: \# O2 i8 K}
& I$ m/ z7 l! L, ], F
4 ~  m7 R. r7 ^function continueFade(id)
3 t) T6 ~* a1 {/ z) `1 r3 u! J' o5 D8 x' y
{
, y- ^+ D1 y+ C" P5 d3 K- @+ h
! X9 y! a3 W- R% N9 N, O        continuous[id] = true;
. ]. l9 I7 F- X1 Q
* }! c, o' p8 @- S}2 C$ L; k1 ~% o0 y6 I( S

8 D7 ^$ v% n& N0 n) z, C6 Gfunction stopFade(id)
; o5 v7 n4 B' U/ B% ], ?; J+ S1 P( K' z% I1 Q0 L  r! K
{$ x; d( W- t( s! W+ U. L
: Z, ?/ G- y$ p$ }' D
        continuous[id] = false;& H. n+ b  W$ o$ n

6 y! }- v  @9 M  |* ^& ~1 [}
' V1 \5 [4 P# \0 v+ r9 R  w$ u5 m! [0 \; g$ g# e- {
function StartTimers()0 u" E2 o8 x& B

2 ]' F, t" S  M5 d{        //set up an initial set of timers to start the shimmering effect
$ X; L% P, p# W2 s7 g) s7 q' N4 M7 C
6 l1 d/ V: J* s        for(id=0; id<numLinks; id++)6 ]6 c& t5 Y0 q

* K+ p) R* ]$ p) V        {
& {# @4 |3 a* Z% o9 m3 W1 B* j) A: @" M) W
                t=setTimeout('startFade(' + id + ')', id*100);
& S1 x8 {% n, `/ |/ m  F; s& J+ O. Z, l, C" R  r! y% e( V8 ]- u) `
        }
* Z+ b% ]. f2 t1 `" ^
5 U; X: C7 z+ G& A}
- e, a7 Z# `' a" s! p! h5 J, M& {9 E) w- P" U1 b) Y
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
6 `7 @* j# y3 T$ p  X6 n. j% X; I- t( G" x
initLinks('#FF0000', 6, '#FFCC77');
0 ^# U, G7 T3 a1 U2 v
$ L) G! s4 [5 x# y, L+ f  C//-->2 D6 y8 _6 U' ?* E% a8 K+ K0 _

' P, t, @: f) s  \6 z' N</script>
" D- Y* ^6 ]. W" {/ y  T9 r<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元" p) ]; y2 m) _4 J4 F$ C
</a>
, P$ F5 a3 {$ A( g8 U, o<br>1 S( X( I7 u2 F/ @5 ]2 b
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>
+ V3 y8 j' P" @4 A( v5 Y. ^<br>
) m) I9 A6 v) d2 b8 ^+ ^) u<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
$ ^& q) J# a# m+ N5 s/ B' s<br>        ) w# G. J1 {/ t- A
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>  N* m! x  K8 E1 u' s' p0 N
<br>
" ]& M  M% c2 A$ A4 ^<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
9 B/ R0 m1 y( _1 E% G7 E<br>
9 P( t0 Z$ g4 E+ h" u" B<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>
, A% T5 v, [( w  R<script language="javascript" type="text/javascript">& P: {5 Q7 ?( M: w, k" P
<!--1 w+ @, s2 M$ {! E
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
+ K. j2 x  I3 d//-->" @+ U9 e' A" o* E, a7 S
</script>