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

zw2004

<script language="javascript" type="text/javascript">! G: w$ a2 x, F& K# V- F( k) l) V
<!--) O+ `0 d. }. x
// convert a single digit (0 - 16) into hex
7 q8 l) u" \- ]/ _+ t4 g! Afunction enHex(aDigit)
: g2 d% b" k9 C3 d* ?- \3 U{
+ Q' `# Q4 H6 ~6 c& ^* s    return("0123456789ABCDEF".substring(aDigit, aDigit+1))/ K5 p8 c+ A/ o* f; c* r
}  N( E/ ], }' `. @
// convert a hex digit into decimal/ Y" S$ X: H2 h- ^
function deHex(aDigit)* z' |8 b" E# R5 X5 e1 o6 \0 f
{3 u2 e% O; ?$ N  ?" h; P% Q5 B0 K
    return("0123456789ABCDEF".indexOf(aDigit))
% M9 b! s2 A6 n- V}7 e7 i: G' q$ k* E" H9 e

+ r- X) e- u+ p7 j; b' W) A; p// Convert a 24bit number to hex
: j: e2 B3 @$ L# Tfunction toHex(n)
+ ^8 |; E  N: o5 F0 |6 R0 ]{
1 t& i2 m6 l/ i* n+ F& ]: d    return (enHex((0xf00000 & n) >> 20) +; w. x6 t. f5 a6 L4 J) g( Y/ u$ Q7 k
            enHex((0x0f0000 & n) >> 16) +
( q% I: ^1 j- ]$ W            enHex((0x00f000 & n) >> 12) +
% ^2 S1 U, F6 ^8 z; O            enHex((0x000f00 & n) >>  8) +
9 t! |2 v) C7 q8 s3 y( y            enHex((0x0000f0 & n) >>  4) +% B) F3 |+ N* V1 @- ^: C" k9 W" m
            enHex((0x00000f & n) >>  0))1 T; F; C5 u/ v* R5 Y# P" X
}
& p$ Q7 d' I! q+ V' x8 u// Convert a six character hex to decimal0 R; z: U# d; y1 h4 o+ S
function toDecimal(hexNum)) Q9 W" b- }. }& h
{9 `2 Q0 E" y1 o7 l" C9 a
           var tmp = ""+hexNum.toUpperCase()
) R2 ^$ z5 l7 `& D+ j; X$ v6 D    while (tmp.length < 6) tmp = "0"+tmp
; c# i7 }$ H7 G- B: p2 Y5 Y           return ((deHex(tmp.substring(0,1)) << 20) +
) `' K0 E& `2 I( X2 b6 X                   (deHex(tmp.substring(1,2)) << 16) +
- E# n. d0 P8 e; G6 q            (deHex(tmp.substring(2,3)) << 12) +* H; r* J/ l9 W( b' f
            (deHex(tmp.substring(3,4)) << 8) +( D0 B( f8 s$ N0 L, g8 W
            (deHex(tmp.substring(4,5)) << 4) +
; n4 y, Z) n* g. M/ O! G                   (deHex(tmp.substring(5,6))))
# Q( H1 e, \0 |5 s8 s  N: h}4 b: ~/ b& m- n1 q: j
///////////////////Shimmering Links/////////////////////
6 ]8 X6 J% |7 k0 }//global variables
! G( t" ~" w6 e# a6 p/ @0 @) m# [2 gvar hoverColour
: U  ?+ j* _/ b1 D& avar numLinks;
* R  J6 O2 {) e2 v" fvar rate;+ E( q/ x2 S; |& ?6 y) \# ]
var numFadeLevels;* b- v0 }2 I( r+ X
var bgR;
( ?- T) ?& a' i8 u: Q. q- B1 gvar bgG;4 a) e4 g, Z. X! q
var bgB;: K2 [, \7 O) }9 V$ `5 [8 Z/ u( H3 Q
var currR;
5 C  S' o) ?' l9 x7 E3 A) D5 ^2 W8 Y& {var currG;- l( W8 H+ \0 ?0 \, T2 E  N6 k
var currB;
9 w/ \. C2 E. r. i. wvar count;5 s* l( u$ V& r$ |3 T+ |
var fadeOut;6 j- A; b! |) V( J  v: z- o
var continuous;
! U7 T' X8 W9 j6 g( S" O+ Ivar newColour;
& y9 ~2 b3 q( c1 ]/ yvar tID;
$ J0 u0 y3 V8 S3 T# K7 F0 nvar redInterval;: d- S1 ^1 U* c/ I) X: e7 @
var greenInterval;% Y1 z$ @% e& q$ S0 Q1 f" B4 r
var blueInterval;
7 _% x$ q% F1 u* cfunction initLinks(mouseOverColour, numberOfLinks, fadeOutColour)8 X! R8 ?$ S3 {+ r0 G3 p& O
{
. ^' k- c2 p# D, R- D* n& h1 P        hoverColour = mouseOverColour;* [9 H# z7 |: v3 X' Y0 v6 V
        numLinks = numberOfLinks;) B6 J* a  R. M5 o
        rate = 1;
7 A0 l9 p( j, N' k+ W) T        numFadeLevels = 30;$ \  \4 J+ \; ]. {1 v8 k
        function initArray(theArray, length, val)6 R8 j' C/ i+ ]4 @) A$ n
        {3 k2 a7 L, S2 g0 g" i4 T
                for(i=0;i<length;i++)
1 {' i) A- r) O" y                {
. P/ Y# W6 _) h# X4 T1 S                        theArray = val;
# c1 W# q7 N) Y! V                }0 o6 r' O5 C" q6 l) K- n3 P/ {
        }
% W6 g, @* m; ?0 {        bgR = '0000' + fadeOutColour.substring(1,3)
2 \4 ~" x9 L$ h( z0 v% ]/ H. ^        bgG = '0000' + fadeOutColour.substring(3,5)
# A) ]2 Y3 I" B, _8 Z! E1 ?        bgB = '0000' + fadeOutColour.substring(5,7)
0 Y+ B- \3 Y% X9 x/ n( F  r: M        currR = new Array(numLinks);
; g1 \4 v- m% f* f& ?- E% i; l        currG = new Array(numLinks);
8 r' |- a' ?' Y6 a        currB = new Array(numLinks);
$ }, _( v# H0 _0 ~  c3 H        count = new Array(numLinks);
: \, x$ Z6 A2 U3 ~) W) C( e        fadeOut = new Array(numLinks);% p; r2 ^2 E# L5 ]" ]
        continuous = new Array(numLinks);, ^% J% B" Q3 k8 I- o# b6 @
        newColour = new Array(numLinks);
- A5 c  ^# \* G) C% H' M. U$ d        tID = new Array(numLinks);
& g4 y, X) `$ ~, b% b        redInterval = toDecimal(bgR) / numFadeLevels;6 w1 ^7 {% J4 `, \  b0 u
        greenInterval = toDecimal(bgG) / numFadeLevels;
/ {) t* k; W6 {5 u  Q6 ]        blueInterval = toDecimal(bgB) / numFadeLevels;
- a+ j: f1 W2 N( j2 i+ h        initArray(currR,numLinks,0);
. d4 o+ C0 o+ O1 M% @+ x. p* Q        initArray(currG,numLinks,0);2 Z2 C" R; g- z- x# Z
        initArray(currB,numLinks,0);
1 W* V' b, ]' E! m/ X( _; s        initArray(count,numLinks,0);
0 l, k) F" P4 `7 Q( \0 s! r* k        initArray(fadeOut,numLinks,true);! l' [/ k. D- `. L$ X) j8 p
        initArray(continuous,numLinks,true);$ ]3 R% y) \0 {, A$ [4 C4 o6 }( A
}        & X0 J0 I: _) X) m( W8 t! \
function startFade(id)" M& J4 {  E- [$ H
{
6 @9 r" N$ {; B3 M        if(fadeOut[id] == true)! F& R8 [: u% I2 g5 L" s" ?
        { /*move colour towards background colour (increment)*/
7 z  }! x5 v$ X: m* z: l/ f                currR[id] += redInterval;9 \6 r- y6 h) }0 f# P
                currG[id] += greenInterval;
. d$ J( {1 o  p% o9 \0 M                currB[id] += blueInterval;  W1 I% H" V' {3 M
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
3 z5 @9 \8 s1 P" M6 e( l3 z                if(++count[id] == numFadeLevels)
* w: u% v0 @8 W" P8 _                {8 Z$ O9 N. l$ L; s; N5 Z
                        fadeOut[id] = false;, K+ f1 o" n3 ~& m0 K; |
                }
0 j! ~' C( j' j# B) U        }
9 K3 [+ R6 W7 x( D& _$ ^        else4 ^6 `! e! s3 L! }# l, J  Q
        {
; z$ d3 v4 }4 M                currR[id] -= redInterval;) |5 W! i( g% X5 t2 B

& e" M. @- @. F" G5 Z                currG[id] -= greenInterval;
+ s8 l2 E7 V$ T2 Z) k+ n4 b" b. G: t0 [8 L* r. z7 J
                currB[id] -= blueInterval;9 X2 y6 q0 B' a; [
/ s' m; H  A0 C7 I
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);7 I3 a: Y. h% X; c
3 l( U; a0 p8 @" P/ W* \
                if(--count[id] == 0)
' d. V. @/ T* n& f9 W/ ~! e# u4 a9 q; B% ^* b1 [/ _
                {
1 g2 X1 k( @9 A8 s7 U. ?) E+ U$ _$ V
                        fadeOut[id] = true;
" ^# w/ _" u) J" G! M( }+ [7 l7 J
. ~6 l' \9 Y4 B2 B1 G                }! K/ b' t! J& r% H  a
1 y4 H" G' r4 e) K- G  Q5 s: n' f
        }. Y* v, s# a5 y$ r( y7 `7 _9 S

0 N% y' S& P" H& z        if(continuous[id] == true)& o2 \( d4 R4 i4 ?& }
* h" D  Z$ E$ D/ C
        {
0 ]. A& j6 \8 N
& V2 X/ j9 `+ v. O/ J" d                document.getElementById(id).style.color = newColour[id];               
. j1 q/ A: S3 J9 |. n9 M2 _7 X* e5 V& f! V" [
        }
$ M% M! L' t( F; ~& N& D
7 w, P  k2 e5 a. G2 M        else
6 ?' s3 U4 o/ `9 U) u, G3 N% Y7 q% O( j2 e' j& h
        {
- W: ~* c+ @4 w' h5 V7 z; d8 }/ x5 K& S
                document.getElementById(id).style.color = hoverColour;
  O! A  |9 ?5 n8 l/ R* w6 J/ \
. N+ S. x( Y! O& K) }4 P3 e        }6 N* c$ g1 O0 ]: h- t" ?
) E' Z5 g0 D5 M( }) O) e8 ~* w4 r
        clearTimeout(tID[id]);
5 ~# B9 x; l9 [) r
& w7 j3 \' m/ }: X. {1 ?        tID[id]=setTimeout('startFade(' + id + ')', rate);
& E! Q. S; P; o
" R# Y( J6 `; k% ]& B}( F/ J; y6 U# v& z4 T2 g# b
$ }# _( ?% }5 j8 |5 u7 I) w- u/ I
function continueFade(id)
7 M( w/ b! ^3 z$ _5 G1 w+ d' W) u' v6 y( ?3 l$ _
{
7 n2 U( y1 q& y+ ^$ {" X) F( k- y  f7 R$ X) s
        continuous[id] = true;
0 ^% O- g9 l4 J) s' u8 l7 x! U. ^
* H/ ~% ~9 w6 b! n}
( W; R5 ?$ N6 H$ X
) l1 S/ p3 J2 c8 m6 l5 bfunction stopFade(id)) X- f  v0 T  J: X) h* D) b
* K, j, H  N7 G! ~! ?
{: }- Y" G4 m- G3 J
: y2 S$ J+ y2 }" o
        continuous[id] = false;
8 X; r5 D" a$ _; O
6 a0 p3 m5 Z* w; V; q, B}
4 i* q8 {. r! ^! c. d6 u
3 H! e' {' H3 z. Z4 N& `function StartTimers()5 X4 [% x  b# |% g' G: V6 Y7 L/ x. q* j

  H2 U2 l/ h$ R; R{        //set up an initial set of timers to start the shimmering effect
; v5 w& h( L0 b1 `. g! l) [6 h! r& P2 [
        for(id=0; id<numLinks; id++)
. H) k& {  T, B( [
8 G! m$ M" p0 l1 W- O4 T+ Q4 P( W/ C        {
. E0 J# r3 d8 I, n3 P) `) X( g! l/ Y7 r" o& T! t$ R  E+ v
                t=setTimeout('startFade(' + id + ')', id*100);
& T  i  r' E* H8 i, g* K8 ~& j$ y1 @% Q' v
        }& L, H: m' d. T0 i# Q3 t! W

; g' {  |" ?6 h3 ?; X( ^/ B}- e1 Y0 Z1 M) k) H: y9 b& E7 n

: d: H: b: k) U+ {# u* O' R//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')/ O% [6 }( i0 Q5 G
' F( x4 N9 S$ J% [7 j
initLinks('#FF0000', 6, '#FFCC77');
2 ?2 ?, E  p1 R+ Q' D6 A8 D
/ F$ V2 m) E0 U9 o% n8 R//-->
) W$ `3 k# g' s, D5 h$ h! O& x/ I+ I
</script>
9 V  G! S6 f( A  M( x# c; |<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元
* @7 X. [. @- h$ o9 e* w</a>
) A9 E3 L9 K: G3 k3 G7 q( S<br>% `! e0 {- D8 M2 j' I* Z4 O
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>$ I1 K  ~: ]: `9 J6 N1 _. u8 r
<br>
+ t" d" R5 }* d3 N<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
1 _$ J" l# L' @4 }' J  l$ Q9 w; @<br>        8 Y4 Q3 I7 h; j
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>) n, a) u: Z9 Z
<br>6 l9 f3 O0 ^4 K: ~( E4 R+ J. @" _8 C& w1 W
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>3 x6 Z( P' q$ P9 s5 K
<br># d9 d+ Q$ F5 z# N. H* g  a
<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>( q% k# b8 [" B+ R5 K6 I2 L, r
<script language="javascript" type="text/javascript">; u* S! n/ ^' X
<!--' _) a  _4 U9 O6 S
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
5 g; u' d: Y0 ]4 Y//-->" R( ^" b: t) N( E0 o7 s  j) |
</script>