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

zw2004

<script language="javascript" type="text/javascript">. e2 [9 H0 a5 [9 n
<!--/ N& ]! A! z$ [
// convert a single digit (0 - 16) into hex. Q+ C. {& f" q5 e$ p
function enHex(aDigit)
' b) p' U/ k3 o{
, c  Y& x0 g6 w" P9 z    return("0123456789ABCDEF".substring(aDigit, aDigit+1)); J; ?& f' m/ r! H2 {
}
; T% A( h- {( \& v3 ^// convert a hex digit into decimal2 @) Q% g1 I# q
function deHex(aDigit); `8 @8 T/ o, w$ Q6 s
{
7 J* Q0 p# \; l# o( N" p4 F6 s* ]    return("0123456789ABCDEF".indexOf(aDigit))
+ G6 k) ^/ }" v+ H1 r9 o}6 s$ W3 J+ n& @& g
  m( C: ^" Y6 ^. h: C5 ~% c
// Convert a 24bit number to hex
. C; x6 r/ `+ x! I- c3 ]' afunction toHex(n)& }) D* X* W8 ~& q! L7 J! O3 J
{( V6 {& m5 ^) z+ I7 E
    return (enHex((0xf00000 & n) >> 20) +
, i" ?0 C, S6 ~            enHex((0x0f0000 & n) >> 16) +
2 n  }! J' q# @+ c+ G            enHex((0x00f000 & n) >> 12) +# Y) ]7 E. J' q0 |" Z/ R1 b
            enHex((0x000f00 & n) >>  8) +
4 c* N1 j0 f& M6 k2 C9 R8 @$ I2 I            enHex((0x0000f0 & n) >>  4) +* j$ ^, a' B) T* P3 B# R$ A
            enHex((0x00000f & n) >>  0))
3 G7 S. h- y# g$ x% K6 h4 b) v}
" B" x8 R; Y3 h/ n5 c// Convert a six character hex to decimal! y( O& L$ H* V1 j5 f
function toDecimal(hexNum)1 W6 o) G. e$ |% q$ ~4 M7 x: e
{7 F4 D4 }+ ~7 _$ q/ }3 ]) Y
           var tmp = ""+hexNum.toUpperCase()
' m3 I2 {6 A! P6 G8 y. o! Q    while (tmp.length < 6) tmp = "0"+tmp
/ E9 T' C2 m+ j& r( \           return ((deHex(tmp.substring(0,1)) << 20) +( D4 \) |9 S1 c9 v8 S
                   (deHex(tmp.substring(1,2)) << 16) + ' I( g5 b0 I0 ~; R
            (deHex(tmp.substring(2,3)) << 12) +
8 N0 C" [- z* I5 t9 g* f5 c! U            (deHex(tmp.substring(3,4)) << 8) +
' D1 o5 b6 R" ?# i, \            (deHex(tmp.substring(4,5)) << 4) +- H" z5 Y. k( w+ o( s! g
                   (deHex(tmp.substring(5,6))))$ ~- t; [! q& P' l' x) r
}
- d; A+ A# N5 g( e8 c, J///////////////////Shimmering Links////////////////////// N, b: h6 v% n5 O
//global variables6 f, c9 X. i, S! D3 _: Z# u
var hoverColour% T2 @5 D- s0 T; F/ s# t" A" s
var numLinks;4 c6 _: i7 s1 c0 u
var rate;
9 i0 q* N4 m; v4 ~. ?var numFadeLevels;# ]: _/ u2 {8 X. M! M$ S, {+ f
var bgR;) k. h9 [; M  `; E# @) T% I6 m
var bgG;
, F- Y/ @( i; Qvar bgB;
$ m4 Z2 |4 i8 j! |6 qvar currR;* _+ O9 I' H9 L" Z
var currG;# }+ ?4 R6 T6 |; [+ H+ m
var currB;3 a& e: [; M$ [% p' D" w
var count;; y; _# h' ~* Q$ F* c" s
var fadeOut;
( n( o9 O) C. d" w  E2 zvar continuous;' ?* _, Z* G: u3 k' A& [, y
var newColour;
4 d  ~0 f& R9 I, svar tID;0 Y. J2 v# z, H2 W8 K
var redInterval;; e8 f. _3 a& z7 ^/ l1 j2 S+ s
var greenInterval;
9 [+ {! J" w. {6 Y; b! [5 B' Uvar blueInterval;6 C. r+ }, x3 Z1 u6 [0 K
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
$ J4 D9 o: Q# C) y{% F; e  c$ Y  V, w) G9 r
        hoverColour = mouseOverColour;1 _4 }  j0 E5 o
        numLinks = numberOfLinks;
, q+ b; r+ p# T3 b, y4 c" }' D        rate = 1;
' k& q: J' `+ v% K8 E* D        numFadeLevels = 30;
5 e+ `+ B6 m2 D8 X6 @. Q$ \        function initArray(theArray, length, val)
% M& N$ N. m/ F, E) s$ {. z        {
7 X/ x2 W. L4 ]* \$ F                for(i=0;i<length;i++)
3 H' r4 p6 J6 X                {) B5 G6 O4 f1 U5 B6 ?" L% g, q2 F
                        theArray = val;
$ |1 W1 t- @' x$ A                }
; }! r$ [* R$ H% m        }1 a9 }& F/ m/ e) l
        bgR = '0000' + fadeOutColour.substring(1,3)
0 V2 \5 ~& B( `" \        bgG = '0000' + fadeOutColour.substring(3,5)
% l8 j$ Z* Q# M, `2 l3 j, s        bgB = '0000' + fadeOutColour.substring(5,7)+ i# I: ]# j" F1 {2 L' D
        currR = new Array(numLinks);
) l/ I5 T, h+ l, i5 y        currG = new Array(numLinks);! b. U4 G+ \) `
        currB = new Array(numLinks);& O  i7 i" Y! t1 d1 a
        count = new Array(numLinks);
. S% X3 C+ ]' E        fadeOut = new Array(numLinks);, c5 y! @+ H7 i6 T4 A4 z6 O5 r
        continuous = new Array(numLinks);7 V; c! _, D" ~/ c- c9 ~: w5 y1 w
        newColour = new Array(numLinks);
4 L: l% _7 ?! n1 z  J: U3 p        tID = new Array(numLinks);2 A4 a" ^( m0 @! o9 G* J# @3 z- C1 t
        redInterval = toDecimal(bgR) / numFadeLevels;
: d3 h0 s6 I( t' j! a' c4 r        greenInterval = toDecimal(bgG) / numFadeLevels;
: p% f0 Z8 b+ b        blueInterval = toDecimal(bgB) / numFadeLevels;
/ L0 h  b6 s' _* ?7 Z        initArray(currR,numLinks,0);
" V# G% @+ }7 w# {. r8 ^: M        initArray(currG,numLinks,0);
( U2 p) `' d. E+ l; L% k( ^        initArray(currB,numLinks,0);
5 K3 n) `/ L2 _( `+ e" i        initArray(count,numLinks,0);! X# D& [$ h/ y
        initArray(fadeOut,numLinks,true);
, O1 [/ o  `/ `6 \7 ^        initArray(continuous,numLinks,true);
9 L. ?' M2 h: z2 o, i$ ~}        9 }# G/ x* B5 m
function startFade(id)8 `* x2 [! ^5 Z1 r
{
( D$ [7 j: n" I6 Q        if(fadeOut[id] == true)
5 r, c0 q$ T5 ^: p+ W. ]        { /*move colour towards background colour (increment)*/; R* D' v2 e4 |7 c9 d& g+ D
                currR[id] += redInterval;
3 c2 m/ f9 z( ]) A3 T) `                currG[id] += greenInterval;
4 O$ M) N# \; g# M1 v6 g& A                currB[id] += blueInterval;
0 F; y' W- [3 ?  M7 o                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);3 p" f5 q: w. \: k7 }
                if(++count[id] == numFadeLevels)1 `. X% n+ z" ?
                {
- n. L& i3 e* A1 x) T; C% o                        fadeOut[id] = false;
' Y0 U2 ^, e9 z1 J                }
( N  W7 c, ?7 [( J" T9 g! J" v5 l        }
2 l- j# D& u$ }% O7 ?, Z6 B        else
( S  S+ Q" J( x) \% z& T        {3 U0 U; J; B- y6 V; Y$ N
                currR[id] -= redInterval;
  E8 S. H4 ]$ e" I8 U  E# e5 ?9 v6 i$ g& R0 n' c
                currG[id] -= greenInterval;
3 T/ g6 D6 B3 R  l9 C, ]0 g
+ n$ u% V& h8 G% k6 I                currB[id] -= blueInterval;
. ~, b+ y+ r0 r) w6 ^$ a
& I7 ^. P8 z: A: e( v+ e                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
2 y4 J4 k  {3 k0 n9 t0 Y9 j
9 q) ?' p! E9 [- X7 g                if(--count[id] == 0)
$ Z4 r1 D( u' I+ ~* Y9 E; S7 h2 ~7 ]2 a
                {
/ J9 p' f; J3 _0 g4 Q  s2 J% U: b1 E* Y7 X' _
                        fadeOut[id] = true;) U8 j9 q9 x& U6 F5 ~

! X/ t+ Y! q$ W5 n' q+ g! p                }
! Q  U' B& C& V& {& Q
) Y* {( c* p  w4 Y2 h$ n( \        }! k/ m/ C% Q8 o/ }
7 w0 X3 r8 [8 y. i
        if(continuous[id] == true)
) H* z- t' x* l8 Z6 e/ H3 N" y7 @5 l$ ?5 I
        {
& \/ }0 ~( c* f: G% E4 U2 L' _' P2 p- R) n) `3 v( D# l
                document.getElementById(id).style.color = newColour[id];                . B' Z6 J) E8 i" C4 e
; k1 @1 y5 [  M7 Q
        }
. n( o3 ~% \7 m9 U- g. E, z
7 w) D. u- Z, N        else
7 F! N3 q0 [1 Y
0 O: [* @* {' v3 v' P        {
4 s) U/ L' ~# ^+ U* M- A/ W; E% d/ @6 b( t5 p" J. M7 N
                document.getElementById(id).style.color = hoverColour;  c' d; W% ?1 @
$ z/ i% c! P+ |3 n, L8 c  l- z
        }3 k: a; D5 [% H; {, f

; P- \4 v, ]! j8 p2 C, [  b        clearTimeout(tID[id]);
, V2 z2 V' B5 Y5 D; H
: |# Y7 }% ?$ E+ f% t3 [% ~$ r        tID[id]=setTimeout('startFade(' + id + ')', rate);
, u2 }+ v- n& R! k6 m8 @( x& ]& H! a' a5 m+ \
}
. {9 c: J/ |9 i
! S  c; C  u4 b7 F* v5 D* xfunction continueFade(id)
: t9 t! x% m! V9 G) J" X
; ~+ r' @; a5 Z; u+ n' z{
3 n  n4 X% B3 R- e& ]  u$ O4 `" I) S+ T+ Z  E; g. D3 D- @
        continuous[id] = true;
: C6 k% ^* Z* \
& V: O3 X% b! E; e}
. A. i+ B  l% C8 M
6 y% U5 b+ A' R( m" e9 E2 s( ^1 ^' mfunction stopFade(id)+ ?5 K# x; L( e
/ f! d. X/ A: Z* \% q: G
{: q4 J: p$ l' p- j+ W- Q/ W- o

% n0 M& j6 Y6 O        continuous[id] = false;7 M: [/ x0 I+ I

# c' r& B* R1 d& M9 @& f}
: U% N  O8 A2 S+ E; t6 v6 u* q
$ k5 q8 [1 E) n  O8 J5 @* o/ hfunction StartTimers()
( E4 b* Y/ E2 Z1 E2 S) m- ]
# N! |! f4 J# F) r1 g. a+ r{        //set up an initial set of timers to start the shimmering effect
8 s+ ]  k; c$ L5 d, _+ z: W+ U
' P& g5 ]% \8 t2 \. b- T8 ~        for(id=0; id<numLinks; id++)
. @1 m2 J# t% f
4 `, o1 i8 [- @+ i  K4 H3 N6 A) S        {4 Z& s& U- A' y$ l" ?2 o
  ~- G: |  U# w  \% P9 w) u
                t=setTimeout('startFade(' + id + ')', id*100);" S$ |- F3 @( M; W, o' y+ [0 {
( R$ C2 E4 T/ u% z0 @0 y
        }
' H6 _% @- ?% H4 z
0 ~6 i! C1 s6 o}  E1 j" v7 g5 n2 y" [( M; ~& r" ^
: {. T# h; G) W; L
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
2 W8 `; u2 k2 d0 O) y. K  r4 Q
' R( u" C$ F6 a; N# E) a$ E0 KinitLinks('#FF0000', 6, '#FFCC77');
# P6 [- A9 c. K4 z& L2 Z2 s& C
; G3 R+ v' N1 f//-->
. E# z" s* |! ?( t$ K$ y% O+ X6 e7 Z$ b
</script>6 c, m8 d6 g( W0 t
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元+ V9 ~% i3 y$ J1 z4 i$ m) l
</a>% o( v, k1 i. z8 J0 P. Z
<br>
8 Q1 x, p5 U4 D0 c- |<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>
) ^* A$ x9 K% s<br>
  V' N7 c) ?! l+ o: M<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
# p8 L$ a" `4 a+ V# i<br>       
- r9 o: @$ |& Z4 m: _<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
: k0 t8 Z) C2 U' A! [9 L8 h4 B! ^<br>, z; B7 g! ^! V+ K% c! C
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
4 d8 R8 N" j( }/ y( {2 F! I/ R<br>
5 @* n7 l5 P) l8 o: E: Y9 u<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>  B9 z0 U7 E: c7 j
<script language="javascript" type="text/javascript">
/ H3 }2 w# @. r7 Q6 A' f<!--& v, o9 B7 D/ M2 C: Y8 f
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
1 Q3 T1 k0 D+ M  B" ~' O//-->* ?& T; x* \0 i& o6 K. M& b
</script>