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

zw2004

<script language="javascript" type="text/javascript">- v7 W) ~" t, e! r
<!--" P3 i7 K& _7 c0 ^, Q
// convert a single digit (0 - 16) into hex
# `3 d9 `" t) X* R/ gfunction enHex(aDigit)  e5 v8 c! D2 ~5 M
{6 q' I1 L2 z6 o# s
    return("0123456789ABCDEF".substring(aDigit, aDigit+1)): H7 g5 F4 {, P! o
}% w9 G0 H; J, b6 }
// convert a hex digit into decimal$ l0 X9 B$ b, ~% m% k/ }. h% [3 K: A2 e
function deHex(aDigit)! U' ?3 Q8 F" h) V7 g* I
{
  j$ g* N( o' k" k2 Y    return("0123456789ABCDEF".indexOf(aDigit))) P) {( R, L, s8 f
}
" j$ U! o, j6 T& W+ ~) P
% e* f( O% i% x! \4 j, U1 A% l. a% P// Convert a 24bit number to hex$ s: q2 D- Q( D- b+ Z
function toHex(n)3 n( C1 [( ], ?  Y5 T- L! B) Y
{9 |9 g* g* X' \6 C! N' G+ e
    return (enHex((0xf00000 & n) >> 20) +; v! O% p* {" J% s8 O) z
            enHex((0x0f0000 & n) >> 16) +
! K: V( M3 o6 P! u) v1 i8 I/ T            enHex((0x00f000 & n) >> 12) +
* j2 S6 {1 @( }5 @0 d            enHex((0x000f00 & n) >>  8) +. D/ ^4 l) x, B7 @9 @
            enHex((0x0000f0 & n) >>  4) +
( n* n- d* W& k: Y1 O1 x            enHex((0x00000f & n) >>  0))
  r" y$ s& Z( _  W. x& k. V2 H}
; i4 _2 B; z! e: P4 }5 N  ?6 D// Convert a six character hex to decimal0 C: b! s( [" M1 b
function toDecimal(hexNum)* R7 E4 W; ?& |- Z2 i1 e7 V
{) H* j2 Q; C( p
           var tmp = ""+hexNum.toUpperCase()
' Z- N8 ^1 I) {, |- B9 v1 H    while (tmp.length < 6) tmp = "0"+tmp6 X4 n6 Y) @1 `: E' Z, ^
           return ((deHex(tmp.substring(0,1)) << 20) +; y% W) O% [4 V# u+ r; Z1 @6 r
                   (deHex(tmp.substring(1,2)) << 16) + 1 z8 |$ d/ ^' g$ a) n8 y. s
            (deHex(tmp.substring(2,3)) << 12) +% D; q4 S( I' t5 D/ B$ M% x
            (deHex(tmp.substring(3,4)) << 8) +
# \2 h6 t% j  E# a0 s            (deHex(tmp.substring(4,5)) << 4) +, p, w  V4 ~: }
                   (deHex(tmp.substring(5,6))))
0 ?# Z& V4 i  N}) B) I1 Q& z+ r
///////////////////Shimmering Links/////////////////////, Q  ~) g+ u) ^5 w& f5 O
//global variables4 {( Z5 l8 z+ t9 a$ m
var hoverColour; X9 I+ f! \2 Q
var numLinks;
+ C% ^5 m6 E+ w- Q7 D3 d5 t6 u$ T( nvar rate;
5 M6 B1 \( e& }3 |- S3 Rvar numFadeLevels;
( R8 e$ a4 x- c6 X1 F$ D' gvar bgR;
  ~2 m) H8 m1 @  S  `! E* p& Wvar bgG;
8 u) D6 g& _" \' i' f5 A4 }  w% U9 Jvar bgB;; ]; c' g% r  c$ e# B7 v/ p8 o5 @
var currR;
( I1 [& `+ Y3 I2 w" ]var currG;0 E, u: n0 Z4 f6 T; T2 V1 F! J& p+ Y; T
var currB;. Z+ x6 K% t8 ]( {2 k5 G
var count;4 B5 N0 G2 L2 A( Y
var fadeOut;# B' b" X7 v* s
var continuous;
" {3 M* z$ ]9 u! ~0 k* Q( x+ b  Cvar newColour;6 b3 R0 B! N% j5 i$ ]
var tID;
/ J. N4 C6 b, Z% Yvar redInterval;
1 l" @+ N9 O  T" v5 g+ z  P7 u, fvar greenInterval;' O6 f$ Q2 o1 h, j
var blueInterval;
* n) Q: f! @( _* Q8 `) Rfunction initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
" S* P# I+ b6 A0 u{- m5 w8 V" h9 A" w4 |, ]  v5 L* h
        hoverColour = mouseOverColour;
4 n# f" s* q; g) o+ e, }$ I' W5 k        numLinks = numberOfLinks;
0 h2 ^5 ^% c. y% Y+ |$ T        rate = 1;
8 L, U0 b) {4 `! r        numFadeLevels = 30;; {$ U( L" W; D; m& Y3 h
        function initArray(theArray, length, val)
* c7 s: E% P" c1 R        {
! H6 O0 j9 {/ m3 E" k3 t8 {/ e5 f                for(i=0;i<length;i++)  Q- u4 k/ j* I
                {) H) A2 w, @8 O. m
                        theArray = val;: p+ D8 l% N2 w8 b- C6 a5 H
                }9 x' c  }7 d" j- K: o, G
        }% O4 R3 e1 ^) m% P: d
        bgR = '0000' + fadeOutColour.substring(1,3): G( r: Y5 U: Q$ ^2 [* |
        bgG = '0000' + fadeOutColour.substring(3,5)3 m2 A2 A" M- T- Z
        bgB = '0000' + fadeOutColour.substring(5,7), n/ k) \( l# i' Z
        currR = new Array(numLinks);
4 Z$ W: S' b4 R5 A/ p0 b: ?, J; ], n        currG = new Array(numLinks);
+ e2 b, n' G7 T$ u5 b        currB = new Array(numLinks);7 Y' a8 A$ U5 _% y1 L: x
        count = new Array(numLinks);5 Y  y& u3 k+ `; F5 {' c
        fadeOut = new Array(numLinks);
3 \8 D* h& m9 r( _        continuous = new Array(numLinks);* \4 y. {: p8 _
        newColour = new Array(numLinks);3 `" ]+ E& y' o- [; R, J( o6 K/ B
        tID = new Array(numLinks);. D- X3 _; K$ N% e* U9 G6 j" N" }
        redInterval = toDecimal(bgR) / numFadeLevels;
3 X% c5 M, l; H& p9 }1 y/ u# N5 }        greenInterval = toDecimal(bgG) / numFadeLevels;) y  m/ C5 c" f. U: k
        blueInterval = toDecimal(bgB) / numFadeLevels;5 l( u  ]( w0 Q( Q. D
        initArray(currR,numLinks,0);; g# y8 p) {9 x( y/ X4 x
        initArray(currG,numLinks,0);+ q+ W4 C1 J0 ?6 l
        initArray(currB,numLinks,0);
2 M8 x$ H  Y8 D2 Q. ?' I' H        initArray(count,numLinks,0);
) V1 ~0 a) w4 n& ^4 ]: D5 @+ k% R        initArray(fadeOut,numLinks,true);. Q# V7 p: W% z" f& X1 a, L3 M& n
        initArray(continuous,numLinks,true);* ]- q$ d0 T: Q4 I& Z  [
}        # n7 c, h" T' M4 a
function startFade(id)
# J4 N# e- ?/ g8 ~( @{
8 C& |& [  F6 F3 V+ T2 e        if(fadeOut[id] == true)3 h+ q* |: R2 V+ ]7 }
        { /*move colour towards background colour (increment)*/
- t7 v5 U4 M  H  R                currR[id] += redInterval;$ |% j) N! V* o' s; D- V) G
                currG[id] += greenInterval;
7 R- r7 o4 J* o( E                currB[id] += blueInterval;2 A) r) _* k& I& m& l/ K: u* _* n
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
3 d/ y/ e* v2 ?5 v/ [6 d                if(++count[id] == numFadeLevels)  r5 s! I4 R. d, V7 J; t
                {6 o- s! n. C2 M
                        fadeOut[id] = false;" S$ _% _8 b% Z3 ]# v
                }" Y/ P7 w& N1 z1 d
        }9 ^7 h; s( k3 L- u# P# l4 O
        else* s1 ^: z- c& V8 t" o6 x
        {
! m4 _4 R6 O' X; K* k                currR[id] -= redInterval;
  R* @4 M/ ~, d" S- N" z2 V: ?) a. X% I- I; E2 N% f: ~/ H" p
                currG[id] -= greenInterval;
: U. k0 `% O* i) s7 u4 T4 u) P# p& s0 u
                currB[id] -= blueInterval;9 ^- H( e  v1 _7 {2 }

& J  {2 D/ ?, T- n% g                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);7 h  S2 O1 q2 _  _" r4 D
: F0 f# A( A7 y3 `
                if(--count[id] == 0)
& _# |7 ^, W) q9 m% R1 z: N
; [3 U4 j, ~$ f; b" |2 |6 N                {' S1 z$ D4 t; C9 w# m8 i% ]6 a

" e5 U0 J- F/ I& `) P6 A  s1 B; \                        fadeOut[id] = true;% w0 E9 K* z, N# q! H
/ j, z# |; s3 u$ I$ f
                }4 B5 E# l6 o6 }+ B' }7 h

8 s* S1 f! q  y2 J: h3 v3 p        }
! ]- I5 m% T% ~, z- H% [' Z4 G4 u% Q$ U! A1 C' \7 y# _! u/ v
        if(continuous[id] == true)7 g- e9 _+ Q# z1 E9 R' ]$ a. c5 X
- l& ~* q  D' T. f7 w. }& e
        {
# D3 D5 w# ?/ T" S% m% N+ Y9 S  }2 d- W4 M# {
                document.getElementById(id).style.color = newColour[id];                1 x+ n: @* ~* Q4 r5 Z" J" t

8 t( q0 n- P2 p' |! I; ^$ r0 _        }5 C) Q  J- E# i  V9 K  j8 }
! I5 E3 p7 W) F1 T3 W
        else+ j& D+ ~0 O/ t) e4 P
# w9 h  |5 V( X. l7 F; D$ [& L4 A
        {
* ?' S3 z9 c) ^. k6 V- M4 ^" j6 d0 {. |1 i! o6 p4 z$ N
                document.getElementById(id).style.color = hoverColour;
# ~. ~& @4 Y) o& M: _8 B
$ U) j6 J8 t- m        }% m4 W4 H4 D. [4 c8 `

% E: b9 @1 {/ `6 M( g, w        clearTimeout(tID[id]);
2 `+ J0 F, R) K3 m* l
% A+ [# ^  Y9 s7 X5 p9 p        tID[id]=setTimeout('startFade(' + id + ')', rate);7 ]8 ]3 U) q$ a+ y; G# L, j
7 e: x# u! H$ Q9 e4 N
}
$ c. a7 p+ a4 S
; z+ |- u5 V0 L' jfunction continueFade(id)
' O4 r; }# R* J* g. ?  p( l& s5 v- s8 a8 l( N, r& V
{
! m  p0 k1 H3 z9 ]# @/ u3 o/ r2 g+ [. O% \2 h
        continuous[id] = true;
" M9 i4 {  O7 V5 q2 n* ?6 }
4 ^  h% l; S$ T+ x4 u}0 u; x9 ?/ i+ I/ e4 q7 Y

% X. R, S7 A) _) N) N# M4 G/ gfunction stopFade(id)
( }; C; A9 k+ i; V; f3 n/ R$ u* G, [+ [; F/ }
{1 b+ @9 e* V3 V5 }3 U
# O: U& o! p) X1 l& l; y) T
        continuous[id] = false;
) x0 J0 N1 @! F9 q% ~1 _: j3 W
( o3 G& c/ k$ K3 b}
1 \' B0 y9 {9 L3 j: Q3 I2 \
; S& l$ @) H- @; }function StartTimers()
  Y, F# `- D) e+ P5 C" u' R/ x$ C# _" o) I2 l2 ]
{        //set up an initial set of timers to start the shimmering effect
: g- W9 b2 w/ o' y0 x, o1 q9 z( T" `  z6 ]5 e! d" {5 {: x  T+ _
        for(id=0; id<numLinks; id++)
0 k7 D6 Z( p9 ]% {4 i4 D
3 L4 @; S0 g3 ~6 [  |) V, \* \        {
+ P4 F, `3 R7 s; c9 k& v- c$ G4 h7 F- N/ p# N
                t=setTimeout('startFade(' + id + ')', id*100);% N; C; O' q4 O0 r, g0 q% t& }
! ^0 ~- Q* i# {5 e( `6 O
        }- j) w5 Q5 R" ]3 y" i. n2 Z8 A- V

0 c' h' v9 r/ L- O}# T7 v' \2 K$ E$ c6 ~1 t

& |4 G; _3 s; \2 I; C+ q" O& T//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')3 Q: `, R$ d0 z( f8 R! d5 V
6 S3 L6 T* X# `+ l
initLinks('#FF0000', 6, '#FFCC77');2 [2 B0 q2 C3 f7 l; ~: x! k

1 X/ X# b0 }' }" _+ y" \9 b' J//-->
) y  F( A! r7 ~4 `8 _( ^
: x% X) R0 b" l+ q</script>! ?; `1 r( u3 W0 h6 I3 t
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元$ w$ n; x+ b" ]# G8 J6 A6 O) u
</a>
9 Z$ d# x6 n3 y6 L) X2 h6 Q<br>" @/ Z3 b' Y; `/ p/ _% @% C' E
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>/ ^$ @  ?& J0 n, j
<br>: r2 U/ [- ?# p5 ^
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
$ o1 p- p# p; a. a" k<br>       
; W, c1 n1 ^+ [0 `; i) Y<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
# ~* Z$ ?  d1 ~/ P<br>
+ K' u6 l! A8 F8 {<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>3 _1 l' e1 l! w4 u7 m% `0 a
<br>
4 [6 o5 n- V9 |7 ?, {" _, i: H" @<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>
! u9 t: z" J1 W+ r# I+ C. D# H2 E<script language="javascript" type="text/javascript">
& l0 w& B& W7 L8 U* {<!--- E9 L) @: `, N/ v' R
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
- |. W4 H* L. m6 p//-->
8 a. G, W; Y3 j! c. i, {1 u</script>