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

zw2004

<script language="javascript" type="text/javascript">7 o0 P2 `7 y  ~0 g1 T. `
<!--
' Y+ A8 f6 `; `+ I, s1 u// convert a single digit (0 - 16) into hex
, l/ o8 E' i1 l1 S( yfunction enHex(aDigit): B/ \2 Q* p& ]' ?) z6 B
{
: O! _9 q# @& w    return("0123456789ABCDEF".substring(aDigit, aDigit+1))
6 U' V% ]% @5 y  V" D2 g% X7 H}
. X8 E7 F% k+ Y- s' l5 _7 f// convert a hex digit into decimal
3 D( E6 L. u+ G( G2 @5 l9 U5 Cfunction deHex(aDigit)2 @" X! E$ A4 t; M3 @4 P+ `- P
{
2 M  ?# L0 g" E- E: a, m    return("0123456789ABCDEF".indexOf(aDigit))
; X+ f6 X5 d. B! q4 G9 R}. _' t1 I4 a, P( D/ l7 m
3 ^4 J( S- L7 b
// Convert a 24bit number to hex, r4 _) f  g) _% P
function toHex(n)
7 N9 h  \$ H2 p1 O{
* k0 _2 B* i( b# X2 w    return (enHex((0xf00000 & n) >> 20) +
' M9 r4 E& Z4 |            enHex((0x0f0000 & n) >> 16) +; z" J% }+ W0 g  Q* l
            enHex((0x00f000 & n) >> 12) +
  \! D  {7 i) u3 v$ k( d            enHex((0x000f00 & n) >>  8) +
8 `* R- h3 h( w# |# C5 C            enHex((0x0000f0 & n) >>  4) +- z- {8 ?) p7 g+ e, z8 {
            enHex((0x00000f & n) >>  0))$ H4 ~( J( j8 z+ y6 Y/ Q0 o3 W8 P
}+ d5 v3 Z  A# M1 q) F
// Convert a six character hex to decimal1 _8 r) }- }: ~- I2 B9 m  }
function toDecimal(hexNum)% U3 i# W; E1 p' j" P! E( \
{$ \) i0 I  @+ G5 `8 @( N6 r( i
           var tmp = ""+hexNum.toUpperCase()
% }$ Q+ f6 V$ d    while (tmp.length < 6) tmp = "0"+tmp$ i  d' |7 B; I# `2 p* s" {. t+ P
           return ((deHex(tmp.substring(0,1)) << 20) +! Y3 Y9 i, S6 f
                   (deHex(tmp.substring(1,2)) << 16) +
3 Q8 U) g' C5 R/ e            (deHex(tmp.substring(2,3)) << 12) +! U+ w/ A. g- ]; S& R
            (deHex(tmp.substring(3,4)) << 8) +- q! P" J0 `& I
            (deHex(tmp.substring(4,5)) << 4) +* {% g4 ]+ A  D# T0 R
                   (deHex(tmp.substring(5,6))))
+ R+ p: P/ \# |}
1 L# d5 L, E9 K2 S# b, I8 F///////////////////Shimmering Links/////////////////////0 @% _6 `9 g0 B* i% G( Y1 }
//global variables( E7 q$ a7 p3 s2 Z% P, x
var hoverColour) _! U0 u: a- T! R, A, z9 J# U
var numLinks;! K0 c, @* g$ R
var rate;
; c6 D7 C; v% \0 yvar numFadeLevels;
5 C$ w* X& ~) o( ovar bgR;
; `6 C1 W; `+ Xvar bgG;( r* b- L1 ^: q0 e: v2 I) s
var bgB;, ]7 Z; m4 E3 v9 F: ^$ a
var currR;5 z4 c' i: x4 B- q# z8 s
var currG;  b+ w9 O4 @. X
var currB;: x/ P4 p( h: ?$ b: }
var count;2 t& Y, S* V8 l( A0 j9 j2 a
var fadeOut;+ H0 E( j$ C: C3 E& j8 _
var continuous;
* H6 e4 s* ^; u* j$ Qvar newColour;
" I- V- ^, Z- p  A; ?4 [var tID;$ `* B' |% j/ L" N5 C# ^
var redInterval;) ?6 X* ^* t2 c! X5 [
var greenInterval;
# ^* }- _: J# N4 @$ @+ `  W, j/ @var blueInterval;
' S0 p! G8 k8 L. D6 }& F" ~function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
4 T& x2 k0 h- d- q{: L7 z6 W/ I7 B6 W9 e/ n$ c+ q
        hoverColour = mouseOverColour;
" E; d, A: |! w8 ]$ s        numLinks = numberOfLinks;: U% c! `: @' }
        rate = 1;0 @# [& J1 ?5 b2 ]# {
        numFadeLevels = 30;
( t' p- ~3 ^: R3 d- N" S        function initArray(theArray, length, val)7 u5 b+ x7 O7 R4 |
        {
8 z/ {3 K9 x! s3 c3 Y3 o0 t1 L2 |                for(i=0;i<length;i++)
3 v6 B' K; f8 i) M4 B                {
# V- R6 X  M, p0 v% f5 }                        theArray = val;
2 x. C0 S2 G6 Z8 K                }$ b4 M" l' h  D6 `) B/ i/ }" |
        }2 h; T5 V! [/ R* |9 q
        bgR = '0000' + fadeOutColour.substring(1,3)
9 o+ o& `, g& W  T, r        bgG = '0000' + fadeOutColour.substring(3,5)
1 ?5 ]/ ~4 a1 {5 z6 U9 ^        bgB = '0000' + fadeOutColour.substring(5,7)
5 r: o1 Z9 D9 S, I3 N        currR = new Array(numLinks);
9 }" P. ~0 U% `5 @        currG = new Array(numLinks);
! D+ f. o) P8 U) n$ z+ q6 B        currB = new Array(numLinks);
# r( R5 |8 }+ A! }# \8 ^        count = new Array(numLinks);* s6 R6 [8 I* ?, K- |, S
        fadeOut = new Array(numLinks);
; m8 c% ^7 N' a" |- v3 v' p- j        continuous = new Array(numLinks);8 E/ U) j7 A& |5 d
        newColour = new Array(numLinks);
* r# ?1 a: v; e! O' J        tID = new Array(numLinks);' t! ]# Q5 x& H. ~" O7 o; B
        redInterval = toDecimal(bgR) / numFadeLevels;2 m* w; n# r5 h6 @; S
        greenInterval = toDecimal(bgG) / numFadeLevels;/ v7 n4 Y1 j6 b" |7 `1 O
        blueInterval = toDecimal(bgB) / numFadeLevels;
) i- U; C' w# ?8 Z7 m, b  o. f5 ^        initArray(currR,numLinks,0);! w; p. L( y9 @: L
        initArray(currG,numLinks,0);
% _2 q- [- ?2 S( S8 G8 q        initArray(currB,numLinks,0);+ N# _2 p& x8 G# K$ A' d' Q
        initArray(count,numLinks,0);
" z) r0 r- |5 t( ?) d! `' o        initArray(fadeOut,numLinks,true);
0 M1 s- V, f& s6 G        initArray(continuous,numLinks,true);
  d; F1 n9 G! Z. m# u+ Y}        ( I, C& F+ ]: I2 P
function startFade(id)" g" B# A% \* B3 {7 N9 S) ]* L5 I
{# g: `% E! c# M  V
        if(fadeOut[id] == true)7 `/ ?& y1 X$ y" G/ M! L' P
        { /*move colour towards background colour (increment)*/4 i3 s5 ^) ]; e: E) w. q% C9 k
                currR[id] += redInterval;
  E( n; D# C1 o# @- Q7 Z                currG[id] += greenInterval;( k/ d& h. x7 I1 p* j
                currB[id] += blueInterval;
) a' \! z6 _6 o                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);6 f7 z8 W" _- y- U+ E; X
                if(++count[id] == numFadeLevels): U% c8 |3 a1 p  i6 Q- ?
                {
; Y+ ^5 ^! `2 @2 |; s$ N. c( D                        fadeOut[id] = false;
9 h" H9 l3 b: M. O; ^; D                }, O8 h, p7 |( Q8 X# L7 b. B
        }% N/ o* k5 L0 Q  x1 k5 X# j2 j3 X
        else9 c2 Y9 J3 k2 g9 m  b' X
        {% ~9 S6 j" P; p1 f8 V: Q
                currR[id] -= redInterval;! }7 e7 z8 P9 ~% S; ?
* i/ k: H8 C7 a" c- y
                currG[id] -= greenInterval;
" h. }; F# F" M* a! a& B$ |4 ~4 J% K+ i0 R
                currB[id] -= blueInterval;
+ [! C/ F3 d9 v: a! I$ ?7 @$ Q. Y9 S
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);  A; b! F8 y; G# O8 E; F2 [( H. f

" ?& D6 {. I9 n$ L/ ~5 n) i' ^  J$ q                if(--count[id] == 0)
. r) D8 @, J9 _' d( d9 ]/ K# c; {. `# s* x) h! s- ?" g
                {1 ?; Z  L6 u- C

+ T( b6 w7 o- n% G! x2 b( N                        fadeOut[id] = true;
0 u! b( f5 P& [. i9 d$ i# h6 Q; }( B9 d$ B0 |8 U2 h3 u4 @5 i! k& o2 Z2 r
                }2 s4 C9 f; |3 w7 I2 h. v
! ]& `# t0 N, n: s& V6 @
        }
1 T+ m" b& f. y( Z9 o% j  S
. {% J& b/ z8 b! g6 _8 Q        if(continuous[id] == true)- Z4 t/ @% X( r: N; a

5 ^4 Y2 x1 |! x3 M) A        {
; T: [  i; ~8 v: f6 A  y; ?6 z6 _7 q& h; k) c
                document.getElementById(id).style.color = newColour[id];               
* R# W1 E" e- D# Z5 L
; n5 ~4 ]5 P& s) X! n$ e        }
4 Y/ f1 r0 ~% H) }% J* C1 o$ U9 k) f( q/ b0 u' n! A. F
        else( @1 I6 U& m5 U( g, y

: M, ~. ?' R- `/ Y; m        {
- }2 N) S7 X- }7 I, E7 r+ y+ c1 o+ e" w
                document.getElementById(id).style.color = hoverColour;, i! C6 a6 E$ O5 r( O5 l4 w) ?) \
6 W% f* n" a& Z- Q- S  c8 X
        }
4 R# U* w& l; M3 O  g4 `$ C4 G3 B: O* Z3 w. H  |' o
        clearTimeout(tID[id]);! O8 r* F! H) e

0 X; r: u# J* d) s8 x* w        tID[id]=setTimeout('startFade(' + id + ')', rate);# B* u5 l, m" ~0 ]# N6 N, d
& I0 v. }. U: v4 R( i5 b% l
}
& w7 k. h6 j% g$ z
; c# K3 a7 G0 G' V% }+ }function continueFade(id)% G+ H: `! `8 t$ I) [( t# u+ p3 ~

1 f- i9 B$ e% N% d0 {+ G{
9 E, z# S; O+ r, F3 U: V+ q& t8 O6 `$ X% M
        continuous[id] = true;  M3 x. I) Y% F7 c* Y# V' k
. j; C% \" n. K* ^# z6 h1 j
}2 L3 F5 e6 L8 r- x  v
& o  h. B4 j- i/ o0 E
function stopFade(id)0 d& s- k) q' G3 M  k
$ q0 P6 [* ~! o- I
{! L6 D5 X9 i8 U! y. q
$ i! h% Z9 x  A: m6 W. V
        continuous[id] = false;
$ ~  c; ?; E6 k2 W, H1 @
- }$ J8 t9 d$ L; @}
/ b( j7 J5 k1 G9 G9 f
  [  F* s& f) a& @. ifunction StartTimers()
5 o- u' n4 a0 F( u
" v: V7 I8 s9 e* w: [7 o{        //set up an initial set of timers to start the shimmering effect
) C: W' ?2 V0 @: E
! G  D& h3 Q5 }  ?        for(id=0; id<numLinks; id++)
" Z) S0 _. E, b$ O3 \  t7 m1 Q! w
        {
1 Q; m0 s: V5 A+ L2 B- j2 q. _) x% q  ?
                t=setTimeout('startFade(' + id + ')', id*100);
5 X9 Q& ?8 N- n3 |2 f; n) D# F5 m9 N& l9 r3 O' S
        }! Z4 F# `( o, A
* d/ S3 Z, c3 }$ S, z* S
}6 e: ]8 D& I" L7 j) \

9 n- v1 s2 K) T//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')1 ~- y* L% p6 p4 s% j9 [) ^
5 n! v+ l4 c& w4 R, a
initLinks('#FF0000', 6, '#FFCC77');
' J: C8 j$ c, r8 B+ g6 ?
0 e0 ]/ P; M6 h( ]//-->, j8 u2 r9 [; H8 i

  ?4 ~8 h% c- v1 I</script>
* A" D' H' |% w% t4 i<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元
0 w1 X6 M9 j( O; A% g, }( E- H( H# G</a>- F2 @" D! w# W% w
<br>" U( {+ G6 \! e4 ~2 @: s
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>, x7 P2 \1 R5 L! ?+ G
<br>: i3 T: |& N' [/ l
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>: l" O- A. ~2 I
<br>       
5 a% C! U6 [: \4 g) Y! b<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>2 r) r. {9 G( E5 E8 J) j5 n+ X9 C) ?
<br>
: `) g6 u* A8 y- b& Y' T; z4 P<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>5 @# s0 N% B, ]
<br>
0 ~  z( c' v8 N# \1 g# l! T9 g<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>- i& [: Z8 _) n. I1 |; Q( D6 s  i
<script language="javascript" type="text/javascript">2 @2 @8 [) P  f) }6 L' f
<!--
3 O/ L4 z/ d) F4 \' M1 n  ~8 ~, CsetTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering/ w, b  x* f; E% c$ ~
//-->' e# h, z* `2 t3 }
</script>