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

zw2004

<script language="javascript" type="text/javascript">( s6 V; w4 P5 C& \: R
<!--3 }9 t9 ~& }2 q* \
// convert a single digit (0 - 16) into hex
' F# s# O! C% e/ y! p6 l4 _+ L3 Mfunction enHex(aDigit)
* U0 `0 f# F* w8 l! ?- ?. [1 E{
9 J# l- y* }! c: H2 @    return("0123456789ABCDEF".substring(aDigit, aDigit+1))
$ o% p' J) F4 M" c3 H3 c& L}2 @: C/ N. l- f% T# ?' T
// convert a hex digit into decimal
" P$ M9 L3 S) g5 k/ `function deHex(aDigit)
+ F6 q- e4 B# |9 D( P{
* h6 S0 ~! ]* r& s7 H    return("0123456789ABCDEF".indexOf(aDigit))" l- L2 m  F; b+ @. {/ o
}3 S& j! o: Z) {8 S  K* l6 U

3 k+ z) ^/ o* ^& a2 l/ `7 j" h3 o% e$ {// Convert a 24bit number to hex
3 f3 W. y6 r2 ?$ ]. H! W1 dfunction toHex(n)$ N$ X( v1 y1 [8 G# O
{
4 ]' I, A. v5 N% I$ E    return (enHex((0xf00000 & n) >> 20) +& m7 E; k: `' C4 ?# [% `6 I
            enHex((0x0f0000 & n) >> 16) +
* z1 @! J, D( T; C( O+ G8 `            enHex((0x00f000 & n) >> 12) +6 P5 J* e+ S+ J9 [* E6 S) O+ D
            enHex((0x000f00 & n) >>  8) +
: c6 v2 k2 ~6 z. P/ `            enHex((0x0000f0 & n) >>  4) +4 K! Q+ ^5 ]+ R& O, P
            enHex((0x00000f & n) >>  0))
* V  N* N0 P8 T# N; f) \% N3 ~}1 ~. P! x0 ^, x" {, D6 Q& ~
// Convert a six character hex to decimal
! e3 e1 S! @4 nfunction toDecimal(hexNum)
" o+ [2 ]8 _7 Z0 d9 ?* @{0 t/ g8 y  n" f. o
           var tmp = ""+hexNum.toUpperCase()* c# B: n% }+ I! T% [) x
    while (tmp.length < 6) tmp = "0"+tmp3 s! k' \. c* O
           return ((deHex(tmp.substring(0,1)) << 20) +, ^/ \! B4 E) |# K4 N
                   (deHex(tmp.substring(1,2)) << 16) + ) e6 V* C, g4 S) u1 v# N. h! `+ M
            (deHex(tmp.substring(2,3)) << 12) +
! C% L, \- d- n; n- K1 n6 O  H            (deHex(tmp.substring(3,4)) << 8) +# q( i6 b! J8 B! a  H
            (deHex(tmp.substring(4,5)) << 4) +
/ x  A8 r( m7 d3 z# a* M                   (deHex(tmp.substring(5,6))))
7 R; u& T6 r) a* U. H}
9 T6 V2 P) x6 ^! `% _) ^- C///////////////////Shimmering Links/////////////////////( f) V. x- f! Y" s2 {9 A( m) p
//global variables
# c5 c  }. F+ b, Qvar hoverColour
% g* X( q; `& n, _var numLinks;
! z: M' l* U) G/ H1 a/ D' c$ _( e/ Zvar rate;
8 O0 k( ~4 [/ \9 `' `- dvar numFadeLevels;
9 i" d% m" o; J1 {( vvar bgR;
; [( M' H# r. dvar bgG;$ {$ w' {+ D* F5 @- }& g
var bgB;
' x/ Q/ h. u6 E1 \+ Jvar currR;
* E5 U- M6 o$ J  r( @var currG;
7 Z* |  o9 A; H/ X- G. b6 Jvar currB;
( Z! ^' n9 i* m4 @9 y( v" `: t! ovar count;
- f3 H% a( x5 ~var fadeOut;
; H9 m- o7 G- p+ L( r* v2 Bvar continuous;6 s) N" s( J( i' k( I" Q$ j
var newColour;
9 t5 O3 F7 o$ Bvar tID;4 ?. U) v/ x9 [2 \: |) F9 f
var redInterval;8 O" ~( F" @7 u; Z
var greenInterval;
1 B" `% \$ T% s5 qvar blueInterval;( `+ \% d( }% G; D
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)3 m9 w1 H# s" t, x+ ]* U! x
{3 S1 ~/ p- p) k8 ?% ~0 O. P. e
        hoverColour = mouseOverColour;; l# m/ m8 @& C- a7 T/ H, g
        numLinks = numberOfLinks;# m$ }/ `) _1 ?+ s% X
        rate = 1;
, k# K) F, x# Z& W' G0 ]5 n) M        numFadeLevels = 30;, F: R+ X6 L% l% g* |6 b8 }
        function initArray(theArray, length, val)
5 h/ b' n9 M) P8 ~4 x0 }8 w        {
+ V4 z; }9 n+ I$ N6 E: @: @. {                for(i=0;i<length;i++)
  i4 W, _& q9 u* p% g: d                {/ D1 ^: B1 S2 J0 p3 a. ]. D
                        theArray = val;
$ R" v' c. T6 ?& r                }- Z) x$ _6 `/ G. r, T0 z+ P/ l
        }1 {: V& L8 ?& Z3 E  d3 o8 U
        bgR = '0000' + fadeOutColour.substring(1,3)" M& |: L- }& }1 K7 ?8 H1 q& [
        bgG = '0000' + fadeOutColour.substring(3,5)  F1 x/ v% Q/ {" E, f
        bgB = '0000' + fadeOutColour.substring(5,7)! s9 d4 E" z1 L+ w! N& ]/ q
        currR = new Array(numLinks);" D+ }; C' m. |! h, X. N% x
        currG = new Array(numLinks);1 |9 O9 w% M9 o& Y2 k& c8 j1 _
        currB = new Array(numLinks);. Q) M8 B' c, y4 O, D
        count = new Array(numLinks);! O/ N& B4 S0 F1 C
        fadeOut = new Array(numLinks);( I7 [4 [  r9 A5 Z5 b7 E4 K  h2 ?
        continuous = new Array(numLinks);
; M4 o* e- |+ ]2 {. u& W3 @0 P) K        newColour = new Array(numLinks);
7 K; Z( f0 M& r! o% o        tID = new Array(numLinks);0 S: q0 n( L0 a, o/ \9 O
        redInterval = toDecimal(bgR) / numFadeLevels;
$ Z* i3 H5 E  J" Q9 z. ^        greenInterval = toDecimal(bgG) / numFadeLevels;
8 V- k) A0 w+ e9 G) M% e        blueInterval = toDecimal(bgB) / numFadeLevels;2 h2 n. [0 k! x! ~
        initArray(currR,numLinks,0);/ u! x! S: T. _& o5 g
        initArray(currG,numLinks,0);
3 `7 b+ \0 r8 u: h' k+ b        initArray(currB,numLinks,0);# F, c. v+ o6 x
        initArray(count,numLinks,0);
9 ~+ p# x4 R  O, o( y* G        initArray(fadeOut,numLinks,true);
6 K2 S$ |& Y8 I( E! H" ~        initArray(continuous,numLinks,true);
5 n# a/ M( v5 @, _/ A}       
. }# Y8 J( _# V8 S0 A9 B9 @% P4 f( `# Efunction startFade(id)* [, A' z3 a* D) g
{3 D2 k7 Q: i+ T8 Y  s
        if(fadeOut[id] == true)
+ t7 [% s- |. z        { /*move colour towards background colour (increment)*/
6 V' V8 w1 D! F                currR[id] += redInterval;
8 Y$ z7 l+ e! O2 H; X7 q                currG[id] += greenInterval;
# H" I( L* E9 i1 c: ?7 z+ R                currB[id] += blueInterval;
. A! d$ v2 k9 a' X/ A2 h% X                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
: n  e) U4 q/ z; C4 r6 o9 D. o                if(++count[id] == numFadeLevels)+ o* _6 G  M2 Q" J& |' p3 t) W
                {/ a2 w) r; O. f4 F+ X. R* }
                        fadeOut[id] = false;  g+ y! q3 S  n3 N8 A
                }, s  ?* m, V# r. Y" q0 k
        }
/ k8 w0 j! M8 n: H        else/ @$ f; [% @% b( k1 e
        {
- s1 r% g" ^( O2 M                currR[id] -= redInterval;1 p3 J/ u# k- z6 ^0 h5 e
9 c3 P1 G& ]9 _! a/ G9 U
                currG[id] -= greenInterval;/ o- i, n9 z% p4 `% J

0 _/ T3 K7 N0 x2 [  ?                currB[id] -= blueInterval;; x, W+ g* F7 ?$ ~5 }! b* v
8 t2 J/ ?  F6 P, I- c( m$ X
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);3 g/ D# r: u+ c

. w* p5 X6 v4 `' H* w$ Z" e                if(--count[id] == 0)
1 C- l7 \, \4 @" Z
5 b* M# _: `* \0 {/ N8 a& Y                {
( L. r$ W4 X5 n* H' W
( ]- \% Z# g" a  A/ t                        fadeOut[id] = true;. m+ P1 U* [# Y) ^4 L

6 e. U  D# y9 i/ A% M                }
# [. Q" L" c" h/ G5 A# a9 t
9 p1 j, M' T% F3 W2 p3 s. u, b8 h9 |        }% L  k: t8 J1 E

4 K# _, f- Q( i        if(continuous[id] == true)7 J3 J% N# O- T- S1 z2 j
7 O. c: s. Q7 h8 x* n, R
        {- E1 g3 q1 g- ^" _: ~- |8 T9 H+ w

) O" i8 S* \" `6 U0 q* D, @" f' A                document.getElementById(id).style.color = newColour[id];                * x) ^9 X0 r/ s4 X+ h) L; [; E3 v6 A$ {

! r2 \$ z" v2 v# j" |' j        }  {' S; f8 Q( E4 A

. `% M+ J0 y4 N5 V  J9 C        else3 T/ j) |! ^9 Z+ `
% ?, R! O7 z) @0 z7 P5 K+ \2 h7 ^
        {9 M$ M! b+ X6 y6 p' C" F, {: [5 o

, q) L0 o6 Z3 |$ s, ]                document.getElementById(id).style.color = hoverColour;  j' V# w. Q9 U+ w9 @8 `) e
3 A! d$ ~; ]8 t5 h% G/ g  |1 f
        }
/ X1 J2 t' r" ?
) g- A8 A# }$ m9 f: C4 p; }        clearTimeout(tID[id]);; k5 |3 T1 ^9 \5 N7 T& B& Y2 d( t
+ S- }4 X: S& I. w# J9 e* U
        tID[id]=setTimeout('startFade(' + id + ')', rate);/ U" O$ z6 _: y) g; G

) n/ q5 G& G4 B}  z! C: n, y1 ], `5 h% W- ?
" [( ~( s0 X8 F7 @4 N
function continueFade(id)0 `. h: h# b9 U
9 y) z- F9 Z/ M/ x9 j
{
$ D- l* D, y; c4 N8 ]% Y
0 O- _: N! t4 N2 }        continuous[id] = true;' T" ]" g* s. A% N2 R5 r

7 Y3 _0 q) Z! G0 o: y* r$ z}
. y3 k5 h+ o. i/ p) T! J/ ]# q, T) e, }7 x: `( W( Y$ ^
function stopFade(id)
; _. q& h5 ^* I' N) z% n
7 a: M9 x* `4 c8 B0 v/ L2 i{9 L* u; {" O% _3 p
8 k. u+ q& R& T/ U
        continuous[id] = false;
% p0 C, g5 Z' \1 V' q- H% \8 R+ ~0 }  X+ n; N% Y
}
; y# ?& ~$ h+ a" g( g# j
* [$ D7 h. b$ R/ Bfunction StartTimers()
( l  O2 G6 B+ P$ w
0 }& B1 y7 l' O, Q$ J! g+ ^- @: H{        //set up an initial set of timers to start the shimmering effect
1 O# I! n/ E& M& ]5 O2 m% U. T9 i$ {! B+ g
        for(id=0; id<numLinks; id++)+ P& T7 m* |& P& F8 Z

3 B3 B$ t' i* I. \: x* ~+ ]5 [        {* @3 _2 b: t0 C4 n2 m. [7 F$ ~
% Z  g- S/ T2 B3 T$ C5 m, u- M
                t=setTimeout('startFade(' + id + ')', id*100);
) D, m8 G' p7 n& J) Y- w0 d0 J8 Q/ E( @
        }
6 v2 W* {* H/ D/ F2 `1 ~* C5 O1 }
5 w! H9 Z3 `/ k" H. ^: Y2 O* J1 A}2 z# b& y7 b# B0 `3 _

7 T( q  W2 o/ E: k' a7 R//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')* Z& N0 D5 x' \8 b' R# i
) Q, L) f+ X" @/ ]/ X9 @( U
initLinks('#FF0000', 6, '#FFCC77');
  D" E1 {  \( o) t" l
0 F; A9 s5 }% U% C//--># P7 C* M; M; V* S; c! y0 g4 i6 j
; b- S- {& T7 z" X0 b" C
</script>
, s4 Y3 X( N: r* ^! [  W<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元
' N! Z- i  p/ |</a>
$ [5 X- G, R& K) G3 ^<br>/ v1 B! l: E% @( ]2 h
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>
, g3 {& ^" K) x% F4 j5 N<br>
9 x' b1 Z5 F& m8 b7 |8 `. U<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>2 `/ T1 l$ y1 y' k9 V
<br>        9 e, e8 d+ _, Y3 k+ f, ?- h, k$ _4 O, l
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
, |* ~' o5 M9 g, `<br>
& ~2 r0 D) Q& Q6 P+ j  h0 l<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>7 K& N* c% s: E3 r& C) F% u
<br>
' c: k" @6 H* I3 c) g+ M2 }, V<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a># {$ z% C. x2 p# `
<script language="javascript" type="text/javascript">' Z$ e- \) n$ H! j8 w
<!--' C/ ~$ M2 V' d2 ]: \) f
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
4 J2 g6 {" }% a6 V4 z//-->
2 o  w: Z; q/ m& n0 D</script>