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

zw2004

<script language="javascript" type="text/javascript">; o  `$ ?% E: u# X& h; d
<!--! G, v' y7 x3 ~$ d
// convert a single digit (0 - 16) into hex
, ^9 J* |0 ^8 ^2 zfunction enHex(aDigit)& |5 u. k- z4 u9 u5 w" X
{
: r; i# h5 W  ^  t    return("0123456789ABCDEF".substring(aDigit, aDigit+1))4 J, x+ V' L$ k" q
}$ V% |% L% Y7 i8 w: q8 u
// convert a hex digit into decimal1 Y+ T* z! l) Y' D1 n8 L
function deHex(aDigit)3 g" F: p  a8 K1 U' h, a+ f( ~
{. F/ b/ y8 B, M
    return("0123456789ABCDEF".indexOf(aDigit))
( R+ Y6 _: o9 r# ?7 C' p  V}
5 j& p1 }1 Q4 R1 J# h$ q9 i9 c3 t2 \. j
// Convert a 24bit number to hex
6 a7 }6 H( m+ ^; n9 I5 gfunction toHex(n)4 ?4 L' `, G4 S& O, I4 O+ h
{
2 L' y+ N- Z( H    return (enHex((0xf00000 & n) >> 20) +5 |  j, {: N, I* f
            enHex((0x0f0000 & n) >> 16) +! E. q. C& B2 p
            enHex((0x00f000 & n) >> 12) +7 K0 u7 l4 j+ E' ?7 t+ O
            enHex((0x000f00 & n) >>  8) +
4 M! l& g, h+ z  k            enHex((0x0000f0 & n) >>  4) +
, A* r* S& D7 H: V" F& E            enHex((0x00000f & n) >>  0))
) b5 w& b" ~$ k( N/ t4 B}
, \( Q- l) U) L// Convert a six character hex to decimal
3 b" ^# H3 r' q% u8 Cfunction toDecimal(hexNum)) Q( v4 x! l: U
{. Q: F- H( c% n6 \1 c
           var tmp = ""+hexNum.toUpperCase()
! X* v- q! E. P8 v  Y2 g) X! o" q    while (tmp.length < 6) tmp = "0"+tmp
9 N. l0 m9 T$ f+ C+ {( t8 m- K           return ((deHex(tmp.substring(0,1)) << 20) +
  @4 Y: |* i# j                   (deHex(tmp.substring(1,2)) << 16) +
% G  L0 C: |9 a6 ]1 k4 f8 \            (deHex(tmp.substring(2,3)) << 12) ++ p8 B3 m  G: F0 ?8 b- ]
            (deHex(tmp.substring(3,4)) << 8) +( w# W+ l6 K' s% m3 T0 V3 P5 \
            (deHex(tmp.substring(4,5)) << 4) +
) S/ S! u4 z* P! k8 u                   (deHex(tmp.substring(5,6))))8 s2 y: o+ f' I. E! l
}5 I( x: b0 l: G
///////////////////Shimmering Links/////////////////////
; ^, X" @1 y' v0 C//global variables* |) Z/ T) ?# J) \
var hoverColour
4 ^5 M2 W1 Z/ E0 s6 mvar numLinks;
/ }7 W: _* k/ m* Q* F) ]var rate;' y4 p' G5 l1 C4 p. c
var numFadeLevels;
$ j; _; C  _5 G* {$ D% E5 z. r1 nvar bgR;
  J/ P) a5 k# Z  E9 l3 i- @var bgG;
6 K! l- v% R! r7 ]* Xvar bgB;  Q" d& g3 S$ b' n; z* E
var currR;
( f; O5 E/ _6 D- ?+ E. vvar currG;4 v8 {" L# K6 K$ k
var currB;
' x  b8 ?: J7 E& C$ I- @var count;7 [+ i& s% Q  O" P$ J
var fadeOut;% n' _" x+ a* E# Y( b
var continuous;
( ]  w6 x& d# }& B: {; V8 Jvar newColour;2 Z! O4 Q9 K+ G/ m
var tID;9 Y, |& k1 ~/ _
var redInterval;' _8 T8 _/ E9 T" c* G
var greenInterval;
# i; o$ p+ v* u9 Qvar blueInterval;& T1 O; J+ W9 B' e/ }. v
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
; R4 E- f0 ?4 ?, m  |9 n" m" K{
" G- r- y1 K0 R$ b, I5 W        hoverColour = mouseOverColour;( P$ P3 l' S% T4 [0 L, P! W; h
        numLinks = numberOfLinks;* x3 d! ]4 T! a) p5 b% n/ q
        rate = 1;$ P% B# F% A' m2 J# {, o/ u
        numFadeLevels = 30;
; w# I5 r( B+ s$ F/ r6 x& O$ K- h        function initArray(theArray, length, val)/ c$ x5 j: L/ q8 ?$ x$ R
        {
* F, Q$ R. c" T0 B6 P1 Y                for(i=0;i<length;i++)4 t0 K0 h  }# r. L$ t8 M4 ?
                {
7 Q* \7 \* j/ W" x5 b# {- u% l                        theArray = val;
2 ]8 k3 y2 G7 v                }6 I0 r6 d$ J  ^0 v
        }
! P' o5 m7 T/ W0 q; {8 ?9 R        bgR = '0000' + fadeOutColour.substring(1,3)
+ _! b& O6 E& v; ^4 O        bgG = '0000' + fadeOutColour.substring(3,5)
2 P+ n3 P" M' d! a        bgB = '0000' + fadeOutColour.substring(5,7)$ W  h: }5 |* ~  R, t1 A
        currR = new Array(numLinks);
0 F- m: y  D) f% B. X: U        currG = new Array(numLinks);4 E  y1 m8 J3 G  E; u7 [
        currB = new Array(numLinks);" k9 X3 s' A7 x; y( e
        count = new Array(numLinks);
! ~6 L/ F( S  \        fadeOut = new Array(numLinks);; \' l* X3 T/ z, e# @: o+ l) g
        continuous = new Array(numLinks);4 _1 c% z7 ?7 b$ p) x8 i
        newColour = new Array(numLinks);+ z3 X8 @# d( t7 p  l0 ?; K
        tID = new Array(numLinks);+ E5 n" A- d/ m# t* k; ^
        redInterval = toDecimal(bgR) / numFadeLevels;6 f6 N! n& W% l0 [9 k0 J5 A, J! j
        greenInterval = toDecimal(bgG) / numFadeLevels;
  n- h" {" R  {) h        blueInterval = toDecimal(bgB) / numFadeLevels;  H$ [6 o( ]) ^& m5 x0 s* X
        initArray(currR,numLinks,0);% l7 c" L1 W& A. J' x8 y4 }
        initArray(currG,numLinks,0);% d6 H3 }- r0 Z  c# ~9 [7 N
        initArray(currB,numLinks,0);
4 q  }3 d9 K. w4 o$ G        initArray(count,numLinks,0);
& P, w! |) C- \6 Y; R8 f        initArray(fadeOut,numLinks,true);
# E. ]  g. Q" f# _6 R7 \6 z        initArray(continuous,numLinks,true);4 ^/ V' M. {) m) ?& |) Q- c
}       
% @9 ?. P& Z& |( `function startFade(id)
$ r( G5 v0 M' F{
- n7 \. p8 U9 l) H" P7 ~: m/ o/ J        if(fadeOut[id] == true)  y+ W8 e! g: E
        { /*move colour towards background colour (increment)*/
$ J3 ]4 t5 ]; x! ?                currR[id] += redInterval;
+ a5 H9 y/ _4 |  W5 I' d* N9 p                currG[id] += greenInterval;; [: X/ `$ V3 Q- C
                currB[id] += blueInterval;
; C! q0 _7 t1 g: }4 B                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
$ H/ @' P% }  |+ J6 V                if(++count[id] == numFadeLevels)6 e8 u+ z' G/ }4 Y# n
                {; K1 O6 ~$ E- A
                        fadeOut[id] = false;2 o! b  {/ h( b3 m
                }  F6 u1 b0 s( X7 @5 C! L
        }& l; h( _2 g- B/ m$ G
        else. e" \* y4 p& y) S
        {
/ \4 U. e. ?+ E0 {                currR[id] -= redInterval;
. `6 [( @9 I, }2 R' i
6 ?) l  w0 u( {0 ?8 v# V                currG[id] -= greenInterval;
0 v2 A5 J# c8 L1 x& i' y* o; O# K- v1 D
                currB[id] -= blueInterval;
2 F, u( ~" s- v+ y8 c) Q& }! j% w( g4 r* ^, [1 T
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
! I. K9 r& s6 j- j! F9 ]8 l: Z2 T) p" _8 N  q8 [
                if(--count[id] == 0)
0 f' E4 \  k' X) q
; i, G) O7 b+ [( Y                {
2 O- k  ?. n8 o
) Z2 d4 U  D( B                        fadeOut[id] = true;
9 H5 n% o) C4 e2 d1 g2 w8 \% x7 y2 B
                }
: l) G0 W6 S: d6 N. H6 I4 Z
( Q$ }. Y7 {! D        }) R6 I# g) _  M; Z
, r2 n0 _1 |# t6 e' X* u, H
        if(continuous[id] == true); r8 ]% |0 D. g8 M
2 ^& S! U7 r5 s% b# V# j
        {
" X/ v9 i. t1 l/ w: ]+ }+ X0 }8 z7 C7 c1 _5 P6 i0 `1 i3 A1 F
                document.getElementById(id).style.color = newColour[id];               
& a7 O5 _6 x7 M3 M2 I+ i5 N6 g& K: W- }; x7 [5 A
        }3 A( ^9 _/ ?# ]$ I+ W& }

; \2 n0 W8 Y$ H: K        else! K; s- o- P( q) R5 Q* ?/ v

; l2 D+ v( ~8 f5 [( q8 d6 S        {
/ \  u# X. H, @9 [9 b% O
* t$ U+ |' n" D4 N% P% l                document.getElementById(id).style.color = hoverColour;) t4 g. h" @, {# E) O
. X2 `3 S, i- p# h# K
        }
+ U7 E5 j* C2 D, S; w' O4 S2 L" A4 s% {( n: C
        clearTimeout(tID[id]);
* A% ~# {- t0 R4 V+ B! Z) y' W* S
6 H3 \( C/ A# x$ W, j) a6 a        tID[id]=setTimeout('startFade(' + id + ')', rate);
* v) f9 j2 O/ b: q5 |6 S' \" a- g# F4 }4 H: Z& q; N
}
2 c- C  L' g& g1 Q
5 R; X" x5 n* f! efunction continueFade(id)
. R" `7 C6 Q2 Q0 ?6 v' p
8 T% I# \8 S! i( _7 U{
5 X& K% h) ]! s5 g4 O7 X
/ \+ B2 N& X7 y4 R* X        continuous[id] = true;
: {4 G! p9 q) [( [5 {/ s4 u' L  ]( J/ V+ o7 u/ J2 ~6 t; l* q9 J
}
/ M0 N9 N9 Z. _2 i+ L& g3 ?  Y9 ]& B+ u( z; H# a2 }
function stopFade(id)
* _- a7 I4 ]* w' T
2 }2 t5 ?: K# S9 m" H{5 J9 ]. _7 _- L" d/ I$ G
8 T! E8 j& ~% O9 z3 y
        continuous[id] = false;
2 K* o; g; Z* @4 B1 k$ M) m3 f' q1 W
2 V7 O; _- {) T( s2 a" `  o}: V/ C* o. y. [& Q6 g1 k! Y8 Y

: `9 K% k% N$ C0 afunction StartTimers(), n# c0 V# k5 m* Y9 r" Z/ h

7 i, g# ?9 V+ m8 [{        //set up an initial set of timers to start the shimmering effect
/ C+ ^+ c" T6 X1 I3 A0 D7 A9 p8 [$ v7 V( v$ N' N  A
        for(id=0; id<numLinks; id++)
' n* g# l1 ]( e- @- u0 o3 y" i% ^2 H. k
        {  }$ \* v$ m  z3 g; j

2 B: _1 I0 d2 W9 C3 l                t=setTimeout('startFade(' + id + ')', id*100);
$ m! j3 U) N6 m% q4 ?/ W+ N4 b* r* v; L; W
        }
1 m# _$ a- ^) u0 e  ?6 m# i5 H2 G: X2 q) ~- F' Y
}
" [% }' |9 a6 O# z+ z* m* v, z1 U: S# R0 [2 A/ U( E, [% K8 H& h
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour'). N# b6 Y" O" T4 o6 ]' b

; K+ v, E3 ?/ jinitLinks('#FF0000', 6, '#FFCC77');
+ G0 v$ W( ^7 Z1 P1 L
6 q& m) P: u0 j( j1 Y. J//-->
% F$ c0 O7 g* P) A! d
% `; f- A/ U0 n</script>
( @, {  d' f, D! a8 n% x<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元6 C3 N: B+ O* g2 t; Z5 c2 E0 a
</a>
* \& K, _0 K& y7 {  ?6 t+ T<br>
; h2 n/ Z8 o/ O# {. |# Z<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>$ K' {" W2 w: J- ?
<br>
0 T  }% ]! h& j1 a5 M6 |. P<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
3 |' }3 ]0 e. S9 o<br>        ! b' t9 `+ A) g9 t
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>, Z8 u# p# y8 H" n4 F1 Z+ r" ~1 V+ N
<br>
. d9 [' j) P/ J# _) z<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>: O% s1 @7 Z% A" M! ~
<br>
3 {, O1 v: F7 V- ?/ |5 S<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>
, h0 o  q! u# l4 O6 [9 t$ Q<script language="javascript" type="text/javascript">
, z2 C9 g: W' k" `+ f6 U1 X! t<!--
0 o2 U  Q- B+ e! z- j6 S, |setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
' v7 g8 B& {) n; Q8 O0 ]8 I# M) t//-->, W2 `: v& |5 i! C
</script>