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

zw2004

<script language="javascript" type="text/javascript">8 d. I  A$ M8 x
<!--' P# L8 t% q# a& r6 D' m
// convert a single digit (0 - 16) into hex" {9 i& d1 r2 B8 c; p" ~( z
function enHex(aDigit)
; D0 b5 V/ m5 w2 [# u{. a4 w# q7 x: w
    return("0123456789ABCDEF".substring(aDigit, aDigit+1))* B6 c8 Z6 M; C* |
}
- R. ]$ g  ^/ x2 W& y6 C// convert a hex digit into decimal% k8 b2 V! i/ u: K: o: s4 _( J
function deHex(aDigit)
# a; z3 i# J! e) `  X6 M' r{
, c  Y: B/ a% N1 V; s0 _* A/ J    return("0123456789ABCDEF".indexOf(aDigit))
1 Y3 l* p: A, L. B! @}9 A. i+ N6 h$ [' V
3 J' f$ n) {1 P$ V% \7 C* u
// Convert a 24bit number to hex
6 v& ^. Y6 z, b2 O7 D7 f& _: B6 {function toHex(n)% T% S! A% B. i/ ]$ F1 v- N
{$ I7 x5 v, X9 Y7 ^6 [% ~$ z" O
    return (enHex((0xf00000 & n) >> 20) +
* a0 _9 W0 }; K8 R            enHex((0x0f0000 & n) >> 16) +
  o/ b( h1 ]. Z4 B2 s6 D0 {: k            enHex((0x00f000 & n) >> 12) +
& n0 _% T' F8 V$ I4 d+ Y! F0 U            enHex((0x000f00 & n) >>  8) +
$ A, Q. J3 ^+ f; A            enHex((0x0000f0 & n) >>  4) +
1 S1 y! A3 t/ z            enHex((0x00000f & n) >>  0))
4 k& @& M+ i7 e" V" Y0 e}4 ^: w2 h: N% S# `' R+ k/ E
// Convert a six character hex to decimal
+ w0 x/ V8 s- h' sfunction toDecimal(hexNum)
$ @+ u+ x# T+ s) [, J$ B! l{
: ?2 _4 k  H3 i1 B           var tmp = ""+hexNum.toUpperCase()0 r+ Q0 O9 @$ G/ T
    while (tmp.length < 6) tmp = "0"+tmp
, ?* ~% r+ d: a7 a1 P& K3 W           return ((deHex(tmp.substring(0,1)) << 20) +! ?. p. t: G$ @
                   (deHex(tmp.substring(1,2)) << 16) + 6 {( m: |) ?! ^" S$ Y
            (deHex(tmp.substring(2,3)) << 12) +
7 `3 K  [4 t3 T- P- N            (deHex(tmp.substring(3,4)) << 8) +- w; o2 J7 n. P/ B+ |& J* X
            (deHex(tmp.substring(4,5)) << 4) +% t! ]9 L4 S% t7 x4 o% h
                   (deHex(tmp.substring(5,6))))
6 y( l6 [7 Y2 H7 S7 n9 g& }}
; a' s1 [# D0 K# X///////////////////Shimmering Links/////////////////////3 U- n+ u$ I- c( b! T( _
//global variables  _' j/ p& @" j/ s) @
var hoverColour! w3 C* h8 i# ~  Q: F" [8 |0 m
var numLinks;* s; C9 I- \$ u" \' u0 X
var rate;
8 y% n. J* f  wvar numFadeLevels;0 X: [  }9 B: U6 Z
var bgR;- O0 T7 u# e! k7 ~  h- Z- L
var bgG;2 }- ^; I4 X/ c
var bgB;
; v; V* x  U& R9 u8 q" t% c" P5 Hvar currR;
6 I% [( N8 |6 L( X% gvar currG;
4 l7 A) d- ^7 y( uvar currB;
9 d  u' ?5 S) C& ~' j8 H1 {var count;
/ m7 N3 v' I' l; J* t+ c3 Qvar fadeOut;( @4 V* f% b( m2 ?  ]$ K5 q& ]7 [  c
var continuous;6 o* `% u+ o  _& e+ b
var newColour;
: g. _$ U  a8 i( I/ vvar tID;: \4 c; {0 y  O# ^
var redInterval;
& N& d+ a2 [$ ?# V% Jvar greenInterval;3 b8 n0 B  }6 \  J& a0 O2 }1 M4 R# r( G
var blueInterval;7 r' M8 U! g$ T$ w8 s
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)- r  k! x1 B. g; G$ T7 `
{
* X# J- `: B% b5 `$ ]. N        hoverColour = mouseOverColour;
" I  w. n6 v( }        numLinks = numberOfLinks;* ?0 L2 r1 O2 A6 }% M
        rate = 1;
4 l* f% B: K, y2 T" g+ @( m* v        numFadeLevels = 30;
# O) m1 W6 t1 o* B: V1 J1 f        function initArray(theArray, length, val)5 s1 @4 H5 e- o
        {  s1 s- Q/ ~5 |+ E; G9 k
                for(i=0;i<length;i++)1 ~. s) \5 O6 x& _5 h
                {
  `) X8 y, m2 M& t                        theArray = val;
8 p2 a$ N7 @) F4 ^7 B% l                }
( m* ?3 u3 p! C7 R. U! ^2 Z. v/ \* Z* b        }
9 k0 s' M7 S6 X" N  ?1 P/ {, L        bgR = '0000' + fadeOutColour.substring(1,3)
8 {2 h: b# q& a        bgG = '0000' + fadeOutColour.substring(3,5)5 P) G( e5 X6 F9 Q
        bgB = '0000' + fadeOutColour.substring(5,7): o% W" `9 g7 G* p* x1 N
        currR = new Array(numLinks);7 u0 {+ J" W% a$ E' x1 h
        currG = new Array(numLinks);8 a/ Q9 s' N- H! D2 }. Q- A
        currB = new Array(numLinks);
7 Z* ~/ i% i1 v+ C# G) I" e6 d1 j        count = new Array(numLinks);  o) F7 I1 g: N: W
        fadeOut = new Array(numLinks);1 u: y& Y7 Y" \% v$ d' u
        continuous = new Array(numLinks);
  k; J6 `. n- R! R        newColour = new Array(numLinks);- S) C' f  w" f4 L2 U; p6 d) N+ s
        tID = new Array(numLinks);
& w7 v2 R" n4 v$ u0 G        redInterval = toDecimal(bgR) / numFadeLevels;  @2 O$ A6 o# H
        greenInterval = toDecimal(bgG) / numFadeLevels;0 r  I: Q1 H" Q! J# C9 a
        blueInterval = toDecimal(bgB) / numFadeLevels;
8 O. Q/ e& I- X+ O        initArray(currR,numLinks,0);
, D0 j! ?# v" Q- d3 {* S4 }        initArray(currG,numLinks,0);2 S* f5 T$ \0 Y/ a
        initArray(currB,numLinks,0);$ Z7 L+ D4 [( e- @+ ~# J$ T. E: t7 n
        initArray(count,numLinks,0);
# f& }# H3 ]) N& ~2 m* C2 B        initArray(fadeOut,numLinks,true);
/ P1 [( t% F4 M) J; W# ?4 E3 y        initArray(continuous,numLinks,true);
0 e% n# c. H- X. E( V}       
& [+ Y+ i% @% `% U4 f; X- Gfunction startFade(id)
# D+ i; t! n9 J& X{
1 H& A( u1 F6 R. V        if(fadeOut[id] == true)
. x4 @) y& z4 L        { /*move colour towards background colour (increment)*/  r# _5 d; ~, F, b
                currR[id] += redInterval;
+ L  c7 }( ]/ c6 o  c" r& F                currG[id] += greenInterval;
9 |$ b) D1 H1 C. c7 r" X                currB[id] += blueInterval;
. F$ p$ u- d% M                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);& x3 e2 `; \. u( m% @1 X3 Q
                if(++count[id] == numFadeLevels)
6 }0 t) E/ n% H* |$ a                {1 [4 j; c" c8 T; ~$ r! w( X' I6 b
                        fadeOut[id] = false;9 j" T4 a* @) w- h- {
                }
" v" q8 K7 I" f8 h        }2 g: ]8 e: l  D5 P) d) r
        else" y4 O6 M# l/ [9 r* I2 [
        {0 }. y, {( v" d) l- |- _
                currR[id] -= redInterval;( F6 E1 e1 S8 F$ {( p, u" Z# e

3 t) x1 V; _. d2 Y% @2 {                currG[id] -= greenInterval;) S* R+ V) r  ~$ ~2 e

& h# |! Y1 Y! N  K" w                currB[id] -= blueInterval;
0 N. j7 M9 c7 p" y9 B/ `$ s2 s9 s; t% w9 j; _4 [6 g0 L# z
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
7 G% i* L1 H; o" h# l7 d: V
- F) v7 k- f. o! A                if(--count[id] == 0)# _" a3 s+ p4 S; U) ^& v
; O6 W9 J. }* f% n. I
                {
4 y) }  ~0 e5 X. a- }4 V2 J- a' g9 f; H( R- S" d* c9 K1 l4 B
                        fadeOut[id] = true;/ g+ D. e# }) _2 q7 i. r2 o4 B

: P  q, h% t8 q1 F2 ]' v                }
5 v( O8 N' i5 A8 p) e; r0 w2 Y! v
- p+ S3 r" {- ]        }: ], Y0 Y* t. J# n9 T; q) X6 @6 E
3 k4 {4 P7 g! n3 {" \' s
        if(continuous[id] == true)# d. z! m8 S, g( L- B9 V
) n) b9 H% m+ w; @4 R
        {) L* P0 X) H. w! }& W( m
1 }8 v- u8 E0 D1 k& Y0 `
                document.getElementById(id).style.color = newColour[id];                  Y0 t" V0 z$ b1 m  _

" c: L" Y8 R( c- l! w5 Z- w        }. D8 a* o2 S* P. s; X9 z' h4 A

' t7 B5 }2 M2 x        else6 r( |1 R8 b+ A7 n' _7 {' v% `
( q# z; }9 m$ C" K
        {
' u/ R3 |' `; S- R3 G! t
- c) M* u7 W- S0 q) Q                document.getElementById(id).style.color = hoverColour;, K0 V* F+ x* a

+ y! U4 ^" U: q- z6 U' q: q& y        }3 i" {7 v3 a- g

- {7 V' ]2 K- B) _# A& B0 E        clearTimeout(tID[id]);& ^- C1 u7 f0 R3 X2 U& s

8 W- b) v! t- D) i! z' r6 `        tID[id]=setTimeout('startFade(' + id + ')', rate);) X2 q9 s0 d) h7 c
, D) c$ U. G; @) d  s- Z
}( u" {8 j  [1 ~; s- c2 i

) s0 V2 }7 ]+ qfunction continueFade(id)* _' H7 b- }6 {4 m1 _
! l, w( l+ h8 k- f
{
5 e+ o* {& t: c0 n. C* A' E+ @/ Y" N: a8 `
        continuous[id] = true;& t1 P4 m2 F/ [2 P7 r

. h4 C+ ]6 t5 Y6 s: P! ]3 o}+ a% a9 A9 r& t
0 n9 Z1 L, w. k. `/ R
function stopFade(id)9 l% m' @6 \' W& U& |4 q1 J
. l$ `% f; P) P7 o' P2 M$ }) M
{
1 X/ D$ J  N4 t
9 J5 W3 V4 C& |! R5 P% r* b% e        continuous[id] = false;
5 f& N4 O- A% K1 Z7 t4 i# X3 Z, _/ d# I! m* ]) w" o
}
5 |* V9 O+ E/ W  W+ b6 _
' b- y" B! T( ~function StartTimers()) h0 w: D+ u5 \1 g1 ]/ d* ?
/ V( `$ ]7 D' ~' B% ^5 y
{        //set up an initial set of timers to start the shimmering effect" V7 Q  q% K6 J2 D1 m
7 U( J4 C+ G, }" A2 z% A: N
        for(id=0; id<numLinks; id++)
% W' u* E: Q5 g; p* K; v* \: ?$ s/ V9 d# h
        {9 `3 Y% e( `; U; F3 s4 K1 z
+ u9 h2 X2 u- }' G* m
                t=setTimeout('startFade(' + id + ')', id*100);
2 j1 V0 [" G9 n- n7 M6 x; Q* b( |8 _. v# h- j; t# n
        }& z, I5 |4 `) Y

1 J5 S9 ?( u) Q0 E! A) t}
: h/ u; L- i/ a7 W+ F) S1 o8 a6 y, ?" d& g+ V$ H: ~  F8 H
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
9 o$ c! [  _# k0 H# C0 m! Y/ q/ V. t2 y5 u6 y4 W- G4 B
initLinks('#FF0000', 6, '#FFCC77');# P$ w2 D& y6 g& a
8 [  `0 u* `# D& F( u* M1 }
//-->( B: R9 d! }/ M* m' a7 b
- W7 A# g7 n0 K+ D' M) f) T7 s& E
</script>2 j+ E; G% P7 a, s. Q
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元
8 }2 N! }, k0 ~4 d1 U</a>- z3 f# v) r. \  ^! U, C
<br>" Y8 l* o8 j+ |. u  E' {
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>3 X4 u+ d, x: D2 b9 S6 \
<br>
/ x* @6 o8 M% w  X9 q' [<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>' ~5 h2 j7 g% K4 J% A
<br>        6 l+ K* T+ X/ a1 [8 i2 `+ m
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
- ]# u" F" M- f! G# T; r<br>
* h9 p2 B9 c% l, p<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>* J" b8 J2 v( _) y+ v- i( ^  b
<br>
6 d% ~% Y4 r% p. i6 V2 u5 ^<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>2 W! B( A7 s; V! e: B$ j9 n! J
<script language="javascript" type="text/javascript">
% u6 m: d% ?) i4 Y5 `# E<!--8 ?  [( a8 h; y9 z1 X) p! R
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
  x1 N5 Y! B8 A( Y+ E) }//-->
0 e0 z/ Y6 Q/ M' f" i8 m) l! `</script>