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

zw2004

<script language="javascript" type="text/javascript"># e. S4 |7 \6 ]% k
<!--+ F8 D' W9 {8 R7 U) Q' Y
// convert a single digit (0 - 16) into hex  {. m5 w& j5 I: g& S+ \! F! W
function enHex(aDigit); j( T' I& M% k6 _0 f5 }  Y
{3 V& i. n9 x" S" ~# E& ]5 T' b
    return("0123456789ABCDEF".substring(aDigit, aDigit+1))
- m+ R' P- w6 |0 ^/ l; e$ T! j* z}& a" N2 q1 T, G' \- f4 F
// convert a hex digit into decimal3 I- D3 z9 b+ G/ C
function deHex(aDigit)
1 K. w- }* N% [: S3 N{
: X% j4 o5 k! M% c2 ?    return("0123456789ABCDEF".indexOf(aDigit))( b$ n2 i% j, V( ^  j9 T3 U( C
}
% ~. T; t0 Q$ z% B
$ Y8 C2 Y# `0 S: ^// Convert a 24bit number to hex9 X' U" i' B+ d. ?. ?* y$ i
function toHex(n)
( [0 y$ S6 _: y; p- ^{4 ]# o  n: t' o
    return (enHex((0xf00000 & n) >> 20) +
. a7 i) \' I% ~8 c6 M            enHex((0x0f0000 & n) >> 16) +, z0 U/ U( [& J" M% x" r9 Q$ z
            enHex((0x00f000 & n) >> 12) +
4 t9 B1 [+ Q3 Q! ?; {            enHex((0x000f00 & n) >>  8) +
* x4 [- \: i* i4 e6 H, T& ]$ ]            enHex((0x0000f0 & n) >>  4) +
' `6 k4 N3 H% i) ^  X) f            enHex((0x00000f & n) >>  0))1 z  c; c4 S0 O( K% V0 {+ h
}. K2 W* l5 U& d1 u
// Convert a six character hex to decimal
2 ?' D: y5 I( u" O% sfunction toDecimal(hexNum)
: ]( p, ~9 c$ j( Z2 g; U# g! ~{2 x+ E) c+ T2 f) M  E# n/ m7 B! O# \
           var tmp = ""+hexNum.toUpperCase()  |7 v2 I- L0 S# r( l' A7 {# s
    while (tmp.length < 6) tmp = "0"+tmp+ I  M" r# W/ y* \3 `
           return ((deHex(tmp.substring(0,1)) << 20) +! S( T; C2 l* v+ O, E" D# c( I
                   (deHex(tmp.substring(1,2)) << 16) + ! D# m+ ]0 S$ H0 \% M4 R
            (deHex(tmp.substring(2,3)) << 12) +/ g( W) s! }2 i7 `! g, A4 Q
            (deHex(tmp.substring(3,4)) << 8) +' G. j7 r5 R* r) u- H- B
            (deHex(tmp.substring(4,5)) << 4) +
$ P# p( s' V/ n4 T% C                   (deHex(tmp.substring(5,6))))0 }8 `" a  p$ b' i- q* j+ P) R
}3 t9 w+ b9 I, M  M6 i$ z
///////////////////Shimmering Links/////////////////////
/ ?) e" k$ C* C$ K//global variables
4 Z% S9 X) T% L( l/ h4 C/ Z- Lvar hoverColour) w9 ^. ]1 r1 T# |$ ^5 @  k+ V
var numLinks;  ]# d% _, q& z, B# g% d
var rate;
) C* }0 Z  K- k) m& Rvar numFadeLevels;
7 k% [+ G3 l0 l9 ]! g5 Y. ovar bgR;1 l4 P7 ~& E/ C: S0 z
var bgG;0 Q& n  ^  Z- K% j* T& p' J6 r4 X
var bgB;# r: }$ n7 u  `. l
var currR;
2 ]2 w" J. U# g& x8 Qvar currG;
+ ?, [! {: F: ^* x0 \0 {. P; W9 e. nvar currB;: g$ j! @* z1 Q8 f" a
var count;8 d8 X- B# o! ~5 T
var fadeOut;
4 B+ z6 v; G! |3 p. L) }var continuous;# `5 m) C4 ]7 H1 c# V# J' l
var newColour;* u% Z; M& c# Q8 o, d
var tID;% K" @' @1 W3 s' n5 r0 @  M* M
var redInterval;& E8 G+ S2 `+ h% M0 B
var greenInterval;0 k5 E$ M5 o3 n0 c: G
var blueInterval;
% n2 w$ U/ J5 ]' z: ^0 e, Rfunction initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
! f1 q) k% y( r+ `3 J1 J{5 J/ l$ p0 V$ H5 u$ h8 v' w3 C$ U
        hoverColour = mouseOverColour;
5 z1 S- Q* d) l7 u. f' ~        numLinks = numberOfLinks;# c- }  O9 P9 N1 x
        rate = 1;& v- C) f9 n. S8 x4 H
        numFadeLevels = 30;7 r# L2 w0 V# _! _# m0 z' p( r: u
        function initArray(theArray, length, val)
9 z7 r- Z& ?8 ^6 o- b4 f9 e        {7 H3 a$ c2 }) t8 j5 q; r
                for(i=0;i<length;i++)
# W( E: [9 z9 w7 Q9 Q& F* H; ]$ y* a* u                {9 x% W- b# h! E/ g, j! y5 ?& X+ R
                        theArray = val;
9 l1 |6 x, x- j: a9 b" y, N3 [                }* I7 t! y7 w$ N
        }! n% v3 A6 A; {9 Q1 L/ \
        bgR = '0000' + fadeOutColour.substring(1,3)
$ I7 M2 v7 t+ i+ k        bgG = '0000' + fadeOutColour.substring(3,5)& ]5 D: C1 V4 h( T" d, L/ f
        bgB = '0000' + fadeOutColour.substring(5,7)
, U5 D% y  _+ ~) f/ _        currR = new Array(numLinks);2 b5 J- M1 }; Z- e
        currG = new Array(numLinks);
. n3 K: B6 f5 p2 }1 x2 u6 j& P        currB = new Array(numLinks);
) [  p* h- q2 a2 W- K        count = new Array(numLinks);* \6 i/ m+ k6 ^# D5 V. i
        fadeOut = new Array(numLinks);
6 Y, G% D, s% J8 \4 T) W        continuous = new Array(numLinks);9 P+ k; g6 [$ J, Y, ~" m
        newColour = new Array(numLinks);  r  P$ r( ^" q3 a
        tID = new Array(numLinks);' H1 Z- O2 \3 i
        redInterval = toDecimal(bgR) / numFadeLevels;( M  t9 G; K; o4 B. D3 N
        greenInterval = toDecimal(bgG) / numFadeLevels;
6 U1 f0 {$ @4 ^1 Q' `, U$ K4 ]        blueInterval = toDecimal(bgB) / numFadeLevels;" S" N0 x' }+ z3 Y' P
        initArray(currR,numLinks,0);3 h2 Z. R* Y# u9 u" E; j
        initArray(currG,numLinks,0);
' e/ }/ Q% R8 A/ N+ V9 l/ O        initArray(currB,numLinks,0);% Y0 v- C: G+ ~- ~
        initArray(count,numLinks,0);
8 l8 [4 F5 @" y, }# v4 J        initArray(fadeOut,numLinks,true);; U4 D, m  X: C2 _0 Y
        initArray(continuous,numLinks,true);
5 ]3 A4 I* I& T}        % Y  }" i" I- O; @3 S& x$ R
function startFade(id)! ?2 }# r( ~' }" Y) w0 U
{
6 w8 _- a, ?0 N3 J        if(fadeOut[id] == true)
6 b. x" _) a8 y- V8 y) G" X( S        { /*move colour towards background colour (increment)*/% g* _+ @3 }5 R
                currR[id] += redInterval;/ Z$ {! c' q3 }& P  Y
                currG[id] += greenInterval;) q) A. k" Y' I# N! d; V& t( P) x
                currB[id] += blueInterval;8 n, u# Y' Q6 f3 S% c1 z3 t* d
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);7 f6 `$ S$ n+ o! |  j
                if(++count[id] == numFadeLevels)
) R+ P8 }9 A* b$ A                {
8 g& K" U- n$ Z% X                        fadeOut[id] = false;! L5 p( O" t+ q7 {+ o
                }* B& k) o) i. V  M
        }
* T0 V/ J% ]2 F8 H        else
' N( M8 r* Y$ P        {
3 T2 S, t4 _) B2 \2 k1 [  W! }, V                currR[id] -= redInterval;8 v' a3 R1 y1 b+ V

3 P0 S% d7 F+ b% Z                currG[id] -= greenInterval;% i' w" m0 ?1 L" n* X3 @
) Y+ c8 d$ `& g3 E% }( u7 S
                currB[id] -= blueInterval;7 J  p2 q! f1 n9 U* H4 f/ H& t
; G% d: V" m" W/ h* w& f8 `
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
) D- S# Q* R7 h9 z; y% C( u
, z& w0 \8 q3 [' [2 p                if(--count[id] == 0)
- d/ N) ?1 F+ N' T
5 I: F( ^) f/ ~" `9 }  V1 U/ |' C                {/ M& ]- x8 I0 D% j
$ q# j0 S3 c2 N" \
                        fadeOut[id] = true;
4 i3 w/ A7 J: g4 T' H9 A9 q$ t0 F$ ^# O6 V! e" I- K; r! k
                }
8 o6 g2 s6 [/ ~- L& i3 h3 B% v' w  {# M0 F; L: _
        }: ?& C, l( T  y( H( u
. b! }- B4 A- s8 g+ H0 g4 o' g
        if(continuous[id] == true)- z  ?( M: e  j
6 M( _. Q0 G% R" }. D' f
        {( b6 i! D6 d4 }! H% Y! T- b
9 C" M3 f: z) s- `( [
                document.getElementById(id).style.color = newColour[id];                * T0 h* H) D# x) V7 f
- W! ^, p! D! q
        }
9 \1 J/ q8 }2 W4 w+ d7 l6 h3 O
  C' Y; ^* P4 m0 u! H, a        else
; o7 a' M$ [9 O7 c8 x( j9 z6 e
: p5 ^% R: C+ I+ E" k        {
( g# u+ g1 U8 G6 m" }
3 L3 H3 I1 Q6 @) Q                document.getElementById(id).style.color = hoverColour;/ x; N. n; u3 h8 h8 B) @

) T/ U. K; Q2 u" |% S$ L. I        }
  W! ^  @( ^3 V: q. @, C! ^0 A6 X1 e; c8 u
        clearTimeout(tID[id]);
7 A" d$ p7 r2 d# c, l) n5 F& M8 D3 V/ q
        tID[id]=setTimeout('startFade(' + id + ')', rate);
; _, u0 p; \1 E2 z& ]) \% d1 P% w/ Q
4 b- K8 \+ E/ K' z}" ~; a. h& V1 Y$ P3 o# ]
1 ?! g( V( p" u6 L: M) C% l5 i
function continueFade(id)
/ `! A9 C* T0 U8 G
: Q& S# s8 X' X6 C. D( j" t{+ ?. b, j5 S2 g% D
( G9 ?7 o! N3 w4 h
        continuous[id] = true;
* a/ o( f( x8 n/ V- a
; t1 ~" [# \) v$ v* ]; s2 {  q1 X1 y}
% j- n/ T3 Z: `# J. o, J& T, Y; @
. Y" e7 G  k  q  i( vfunction stopFade(id)  E4 y* b- r: k4 g' d: [% r
$ }3 |" t' g: s) ^5 u
{
: C4 ]1 S& t( M' j) n( V( i$ g: v( r( \
        continuous[id] = false;
6 x$ w0 p8 d& m2 p3 P8 P8 X- d( f& U
}
# d: r. f! O0 r5 e
3 g: J- Q/ I4 tfunction StartTimers()0 j: l9 @8 h5 B3 W
7 l% [3 @+ j$ j" a# S& L
{        //set up an initial set of timers to start the shimmering effect
. U4 y1 q8 Q: t0 ^! `
4 z) ]5 N! W- z! J& ~3 j        for(id=0; id<numLinks; id++)
1 }# ]+ x( r' j8 G0 \" L/ v  }
6 J. ~: v! j, k. @* K! a: e% c; b        {" V( r9 F) ~4 z, Q: H

$ J: X+ _* `9 [! T                t=setTimeout('startFade(' + id + ')', id*100);
4 i0 h/ G% k( i% G( k9 T9 G' S5 F8 g  b# f9 o
        }, X  Z2 B$ {- M: ?9 o/ ?+ U0 m# I

& ^+ ^5 w9 n/ P* y}
+ e0 b% v. ?/ ~$ c+ w/ f: H$ m  M# h5 q6 [3 P" E! D% f' J
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
( t+ c5 T) X6 m  y1 d
! |% S, o( E* C5 p; x5 SinitLinks('#FF0000', 6, '#FFCC77');; w% x1 X. f* f3 x8 M; Y) h
5 g# ^9 e6 ]5 w% p% l
//-->
9 I- f/ p4 J8 W/ C+ v$ x* Y7 r' z4 u/ \+ g" l
</script>
8 g9 N: `$ I4 f' ^0 S<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元
2 Z& R2 ]9 Z- w. i</a>
% t  I  i1 _" l6 l" J. i/ r/ r<br>0 R- L0 g/ s1 a) k3 U
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>
$ j- q6 v( f# ^4 h8 n8 y2 l5 ?& Y1 }<br>6 z: L$ D% }& Y3 ^% x1 u! Y' k
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>* x& m9 t4 Y" ]
<br>       
9 \- s, ]: f9 [( w7 D0 J: P<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>/ x. E! j! o2 A6 P
<br>
3 Q# {3 `8 c( }" j# \, K! b. k/ r<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
9 K) }# h5 ~- y. g4 n) l+ f0 Z7 ^<br>8 v$ }7 \1 {. m( p
<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>
, e8 }& T+ E! N<script language="javascript" type="text/javascript">
$ e# b1 r; m. ]2 \2 j' @<!--( V% }1 S. I! W: |. i3 n
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
! Z$ ?) \7 J# X. L, R' q" _//-->- b' @) Y5 X7 a( ^
</script>