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

zw2004

<script language="javascript" type="text/javascript">
" o( ^$ n$ @; j9 R<!--7 P- P0 N- K0 F- r9 m
// convert a single digit (0 - 16) into hex
, j, a$ z) }% J7 A' f. Ffunction enHex(aDigit)/ S) D! ~3 b# n0 a" z
{# a# J! T, ?4 W
    return("0123456789ABCDEF".substring(aDigit, aDigit+1)). L% g) F8 j$ m+ B# ~/ U9 G
}! d1 \) X8 b+ C1 y! r
// convert a hex digit into decimal
5 B( A  w7 Z7 o* u" p7 Vfunction deHex(aDigit)$ A& v. V; }8 K: E6 `
{1 P! E& v$ d( p* U6 N( e- _
    return("0123456789ABCDEF".indexOf(aDigit))) F6 d, S3 l$ _/ l' |
}
: k6 w6 B$ P6 l6 c$ Z
+ z# k' H1 P. e& [// Convert a 24bit number to hex
5 g8 N- u" V' T! A: F: qfunction toHex(n)* n7 k9 |- ^: Q. y4 n9 U' e5 S# ^
{
( [5 C$ k6 \  u& J1 D+ E    return (enHex((0xf00000 & n) >> 20) +
: t2 ]+ h3 Z- l* t            enHex((0x0f0000 & n) >> 16) +3 L' v9 @, P5 q- [) j. c
            enHex((0x00f000 & n) >> 12) +
/ k/ n# O7 r; E4 j4 A# J            enHex((0x000f00 & n) >>  8) +- V$ T& Q3 O/ E% I6 ~% c" e+ V
            enHex((0x0000f0 & n) >>  4) +, G/ g' {$ w! x) |
            enHex((0x00000f & n) >>  0))
+ _5 S+ y: I. C3 d2 Q: z0 _/ G  w}0 A4 _# ]9 R$ c
// Convert a six character hex to decimal% s/ k" x& j1 _3 W& D% ]" f
function toDecimal(hexNum)
( C  B; v! t9 Y+ X5 a; N- b% g{+ D: Z: t* T; R/ L4 M
           var tmp = ""+hexNum.toUpperCase()% M7 _6 K+ ], V% ^0 p
    while (tmp.length < 6) tmp = "0"+tmp
( `& l/ L9 F5 o# ~4 u5 F# J9 C           return ((deHex(tmp.substring(0,1)) << 20) +) i7 F3 G3 w. A; l7 q
                   (deHex(tmp.substring(1,2)) << 16) + 3 w  L6 F0 X- |2 `9 _
            (deHex(tmp.substring(2,3)) << 12) +
1 D" y- P8 Y) v$ g            (deHex(tmp.substring(3,4)) << 8) +( p. `, B: Z6 p
            (deHex(tmp.substring(4,5)) << 4) +5 S5 u' s( u% u/ @3 D8 T* ~0 _
                   (deHex(tmp.substring(5,6))))
/ O$ p2 J+ ~. t: A; V3 C% A}* X$ d& `* r! U$ [; r8 G
///////////////////Shimmering Links/////////////////////& S7 J* b/ R; V/ m: `
//global variables+ }$ _4 j4 X+ }- n2 R# x9 n- j. B
var hoverColour
4 q; s9 N0 i  H: _8 W  H6 gvar numLinks;
5 S% T' @! e+ m, A( evar rate;/ |* }1 Y& H; Z. b0 f/ Q- y; Y
var numFadeLevels;1 b6 L* @& o9 v4 F. u3 h
var bgR;
/ Y8 \, H- Y0 @var bgG;
# p- ~: }& _+ t! Evar bgB;8 W0 m8 h, W9 Z. _; h  e9 v
var currR;3 q1 ]; v  N1 ?. s  w
var currG;0 C9 r. _3 f5 P% p1 G, @: i
var currB;
" P' P, r* h, e" h  a9 M, svar count;
5 N# ~. J6 h  {: L8 _7 w6 yvar fadeOut;
) R  T& f' F9 h. Xvar continuous;8 I" y% O! Y) h$ r8 m
var newColour;
/ b( c% F! _$ y1 L3 _; s- vvar tID;2 c5 d/ F% }: O* f4 n! ^8 U
var redInterval;
6 k9 X. x6 i0 I$ }var greenInterval;3 s) N$ m6 q: F8 [+ \( R; e+ d
var blueInterval;
3 S* T* u, Y* Bfunction initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
7 h9 \" e9 |0 ^% m8 R1 Y9 d{- C$ O' P' ~. H3 U/ G% {- V
        hoverColour = mouseOverColour;% a& ?+ x8 Z3 q: t" z
        numLinks = numberOfLinks;
$ r3 I! f* G# t3 a+ R" E        rate = 1;
+ L2 ]+ P2 Y) p        numFadeLevels = 30;( `7 F1 p* N% t6 Y. S, d
        function initArray(theArray, length, val)
* E4 d$ q; y  b+ Y        {: r. b2 y: f# L
                for(i=0;i<length;i++)7 S2 p- S/ w9 V2 N5 Z
                {
) S1 Z4 ?5 W+ `% w! y  O* y                        theArray = val;
. C+ F! U8 a" p1 r3 R' E) K3 p1 P                }$ s8 w: ?$ D; c4 A
        }
' l2 y* j* u. w9 z        bgR = '0000' + fadeOutColour.substring(1,3)
+ b2 E; s& q7 J  f- {- Q0 o- g        bgG = '0000' + fadeOutColour.substring(3,5)
5 n* `' A/ O% p4 h5 W4 u        bgB = '0000' + fadeOutColour.substring(5,7)
4 d# B& q+ L- z6 m  u. T& p: N' T        currR = new Array(numLinks);
2 Y' i& ]% }! B        currG = new Array(numLinks);3 q& @; H( t  L" g, Y9 k& j
        currB = new Array(numLinks);1 t$ S: H# j/ s3 n6 `  D
        count = new Array(numLinks);
  `* z! z( m+ S2 g        fadeOut = new Array(numLinks);
9 y0 E1 ^7 y0 c! s& Q0 e/ m        continuous = new Array(numLinks);4 v* v* e7 C6 p; e
        newColour = new Array(numLinks);
) I5 p& Y6 T5 K2 |2 O/ {        tID = new Array(numLinks);
) \! ?  f1 L) X9 G+ j# j        redInterval = toDecimal(bgR) / numFadeLevels;
" ^% m; P+ U3 A/ ]) n        greenInterval = toDecimal(bgG) / numFadeLevels;4 Y1 Y4 H$ y" v" v0 A, \
        blueInterval = toDecimal(bgB) / numFadeLevels;
6 x; O& W2 _9 {) l6 x: w# C0 W        initArray(currR,numLinks,0);6 z0 r4 s& }2 ^
        initArray(currG,numLinks,0);  B) `- W  W7 V* }
        initArray(currB,numLinks,0);
7 @: c0 ]5 _, n1 E        initArray(count,numLinks,0);2 |2 p. q, Q! O6 Z  e
        initArray(fadeOut,numLinks,true);
8 D& W( q. A+ h5 V9 T1 D        initArray(continuous,numLinks,true);
! T6 c9 G- |) B5 E* r3 c}       
# Z' E. \7 |9 |" Y, H5 M4 jfunction startFade(id)4 e  L; b" k$ p! a, @% V
{
% y, g6 `$ c9 w        if(fadeOut[id] == true)
( j" C! C8 \/ ]; Z5 Y9 s& J# t        { /*move colour towards background colour (increment)*/5 Y3 T5 h$ R; O: p; [" z
                currR[id] += redInterval;4 [/ G# q9 r  d2 F
                currG[id] += greenInterval;) V; g2 g" A* F! N, g% w2 Z
                currB[id] += blueInterval;1 J2 h0 _% w, v# K4 H# j4 |" v" k
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
' {! G) C3 R7 C! d% C. J# I                if(++count[id] == numFadeLevels)
& [* c% a; F5 o; D9 c4 r                {
5 u3 f! J) a) o+ K3 C5 j3 C8 T9 |" W                        fadeOut[id] = false;
: ?, L5 l' N' |2 t8 q5 f4 j, R                }8 e! S: |3 `* T! n. G) Q3 m
        }) U& f$ _8 }) U7 T, w
        else
* ^, u6 K9 f: g: n        {7 P7 Q  M8 [) A
                currR[id] -= redInterval;
7 _! F* F0 v/ k. Q* Y$ t. P
: @9 D) W6 S3 Z6 p                currG[id] -= greenInterval;
1 b3 v- `  G$ O/ b
* I7 q2 Y& w# ?) k) {( j                currB[id] -= blueInterval;# \" A& b) q0 R7 J" M# r" F

, X0 A- y2 g' r1 X- L                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);/ P1 z9 q+ b, b9 `) S' K& S
4 d; E  W6 E( T$ _6 ~
                if(--count[id] == 0)
4 K9 G- C; \5 j1 p( }' w7 C- k# r9 q8 Z; q9 U
                {
0 X3 K. t; S' h0 c# C$ r) d9 c/ r9 _# M9 i" D) w
                        fadeOut[id] = true;
/ e" j( [: u; V" N7 ?' L* V  y5 O
( T9 b# L& G2 T9 K2 I) F                }  A; m1 t1 |  ]9 ]6 N

9 X% J2 h# y: {! T        }( A: y8 q7 C* z2 c* ~6 d0 [
' k2 |- o4 c+ E# C; [( G* q7 Q
        if(continuous[id] == true)
6 l# O; v0 f. N  ]) h
9 u+ c, t$ G  c9 @: S$ x) D        {
4 r" u1 @, Z% T1 B4 K" o
- {& i; w5 |$ Q- s# K  F                document.getElementById(id).style.color = newColour[id];                & f0 t. u* y. O  I. C" E3 G% \
) `* ?: X& V9 I! k; j# n8 K
        }
/ V+ H2 J+ N$ Y, P5 H9 I& x& Y: N' B2 l! O' D# A' j
        else
5 H3 f, z  b; _1 T9 b9 z" u
. o) x4 K- x5 g  Z        {7 r8 |  |; V( k  m

9 x2 G  R1 I$ M2 T$ N- r                document.getElementById(id).style.color = hoverColour;
: r7 h! ?3 A+ n1 Y3 l; k9 P" I
; [7 [" [8 v, ?: ?* v        }
9 h: A' o5 D( V0 S0 d: r+ o0 j: k, F2 j7 I7 ~. O3 y& D. B
        clearTimeout(tID[id]);
$ h3 X. `1 y3 a' u5 o1 m
. @7 H9 l: }) S$ \        tID[id]=setTimeout('startFade(' + id + ')', rate);/ I- T, Y+ T- ^4 z6 `$ C

' Z' |, b  F: Z7 q5 D+ s}# r, ^$ B0 }2 }- @* u

8 y6 p) ?- c1 w# K9 dfunction continueFade(id)
) G! U9 d" y: L+ [( ~7 Q$ `
* |, B4 Q6 b( }, P. l3 Z{: R  C: a* g' d# b$ I! o+ K* V
& y0 {5 R( S1 O  r) ^) [* F) }5 z$ h
        continuous[id] = true;+ O. B8 ?$ l3 {. q" C

8 ~$ q' l# Z9 b7 ?4 n( n# c}
% f9 T3 ^' x8 I! p3 p
! d- @6 _, d3 |5 ifunction stopFade(id)
$ R7 ^, Z, W; |- h( I, u' I+ m& J4 [  c% J4 N% F
{
5 d+ }5 ]% z4 Y* \8 M! D0 w9 i, K7 W% |' {! A1 R* D4 Y
        continuous[id] = false;) {/ n" C6 }( H8 A- k

9 c/ U6 H) u: Y5 Z0 n}
3 t8 d6 Z3 \) E; w0 J) K; @. e9 x' ^% W. E, O
function StartTimers()5 h- Z- Z5 x8 A5 ~: l

# [( W2 Q( F, R+ ?0 @- q7 H{        //set up an initial set of timers to start the shimmering effect
; T- N, D- r0 x# ^4 b9 |# N$ `( N% n- P, ?8 w3 B. G+ O( [4 J* K2 z
        for(id=0; id<numLinks; id++)
" r. P- P( g6 D( Y; L! [0 W, Q+ G
        {
" r4 D0 T) E8 }1 t
! j7 {4 ]5 I9 W9 d( h                t=setTimeout('startFade(' + id + ')', id*100);- e2 d3 d7 S7 p  k* N

& J! ]  z3 Z4 n( U, }. }        }2 i0 e2 g6 h* J3 L5 C1 n* K

5 b( _) ~( Z3 R6 O' i3 L( j}* B, p6 V; W1 {( [

/ b" r! v/ L9 z' n& ]8 V  M//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')7 E% N% D. v. \' q# m' |

/ C" L: \" x, }- t' Q" H( PinitLinks('#FF0000', 6, '#FFCC77');
- B* w+ t: m& @% d
& h: t5 G' A% j' }, y1 e3 n* q//-->: r. d' R$ J9 E$ V7 ^( r: Y9 R

# s( O  p3 [" S( ?' Z# r  f- k</script>
' s9 q+ U4 A1 y& i5 ^3 d<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元5 w2 c  J7 \, Z3 U- F3 l$ O
</a>$ C+ h& t8 y' o4 H4 \# w; t$ v
<br>
+ v/ G) m6 x8 \<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>8 f7 U9 E/ A" U9 Q7 ]
<br>
' q) P/ w8 k- [1 |# W% n" P% J<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>1 `& o) b; x0 }8 L  [
<br>       
5 [7 _6 y$ E, |3 V7 `<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>2 M1 e4 I: e/ R2 H4 p( m% b
<br>- b! g5 k2 ^2 i% D8 O
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
2 R6 j  r6 k2 h1 ?' J- D<br>
/ ~5 s. o) n# Q<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>
& W* v  e3 X6 f, [& u9 V/ A8 [<script language="javascript" type="text/javascript">
7 X7 U$ I6 L3 A1 N) x<!--. v, L1 S7 C5 o9 _4 s1 G
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering( m+ g/ W; T% [
//-->
3 u0 a. c3 P$ e* K) i0 Z0 \& o4 y</script>