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

zw2004

<script language="javascript" type="text/javascript">
! @1 k2 \! Y) X% w) I7 z- }<!--
9 u$ l% I: J2 \  m8 P( T8 i// convert a single digit (0 - 16) into hex/ x( f) K; @" H: r' V8 l' Y- _
function enHex(aDigit)5 S$ b# u# B% R$ _8 B
{
" C' ]4 {' m' i& R2 E- h    return("0123456789ABCDEF".substring(aDigit, aDigit+1))
& j7 r/ a2 x: K" |9 @# x}$ `) b& c0 [# J- E# t5 S+ J3 V
// convert a hex digit into decimal
3 A" R4 d8 j2 qfunction deHex(aDigit)) h# n& d3 c: m" I7 f+ [
{
7 c  K/ A) o4 f) O- Y    return("0123456789ABCDEF".indexOf(aDigit)): c6 K; I6 l4 |
}
. b. d' O  N5 K6 |4 b
; ]$ Y4 ^5 f% B4 J( @// Convert a 24bit number to hex, [5 e2 i5 y; X! n+ S
function toHex(n)/ f. d$ y! w" `" G
{
4 Y$ c' \9 r, A/ w, Y+ M/ ?7 q    return (enHex((0xf00000 & n) >> 20) +1 ~+ u! ?1 W$ ~5 J, O
            enHex((0x0f0000 & n) >> 16) +) t% {- q" k) j# C* E5 Z4 e
            enHex((0x00f000 & n) >> 12) +9 M  w9 d) A2 z4 d2 E
            enHex((0x000f00 & n) >>  8) +
/ N* U" d6 m) y8 |5 j            enHex((0x0000f0 & n) >>  4) +0 A0 Z2 f1 [! Y9 J
            enHex((0x00000f & n) >>  0))
* Z0 ~$ l5 i% L8 a7 r. w}# r3 d* u! b! `5 D
// Convert a six character hex to decimal
7 i! s# U6 G7 m0 X& I; Sfunction toDecimal(hexNum)+ Y6 F' I7 J9 C( g; d3 Y6 W: a* V
{% r! g" j2 y  B$ ~0 f4 ?
           var tmp = ""+hexNum.toUpperCase()
! @& ^4 K+ q9 n) a    while (tmp.length < 6) tmp = "0"+tmp
4 M3 w- q" Y- v5 L4 {           return ((deHex(tmp.substring(0,1)) << 20) +/ r; J2 _- M- O. |" Q( N8 e
                   (deHex(tmp.substring(1,2)) << 16) + 4 }, h6 b- [4 k9 A* c# U
            (deHex(tmp.substring(2,3)) << 12) +
* G3 _/ M. _& O! q4 X# j            (deHex(tmp.substring(3,4)) << 8) +. N$ x! G; ~3 o
            (deHex(tmp.substring(4,5)) << 4) +2 a* \! D$ U6 `) w. U1 f
                   (deHex(tmp.substring(5,6)))): ?; K' e' `0 d8 u7 X
}' t  N4 a9 X& p' s
///////////////////Shimmering Links/////////////////////0 }. U, J1 \6 u. a
//global variables
+ u( {: b- d0 b, }) s5 jvar hoverColour
) N+ Y4 I. h. x6 B8 F3 ^9 v- m6 cvar numLinks;2 Z+ S2 v7 I- ^0 i' k. y
var rate;9 r; u( m) T8 L  U' S/ e9 l
var numFadeLevels;$ u  H: L1 ?9 v1 h7 S6 V
var bgR;7 y/ V9 b# X6 c: m7 ?- O9 h
var bgG;) @8 m1 \8 U- i& k
var bgB;
# V2 @0 L7 m' |. k8 g& Bvar currR;, x# \: y, Z+ t% E. v7 h+ |( n  g
var currG;% b" t- v  w2 F3 ^
var currB;- f7 m% C8 N2 C4 M
var count;! x, y1 e: Y0 U: A1 u& t; W+ D( i
var fadeOut;
: ?/ ~; C! l# i7 Tvar continuous;" d6 G& u- R( ?7 @, E
var newColour;' T) W- s+ h8 Z
var tID;/ _$ F/ F8 `0 y7 E' s6 h0 h; T
var redInterval;/ G5 R6 Y6 x' D
var greenInterval;
  M$ W9 c, E1 ~. V% }* ]6 nvar blueInterval;0 v1 d' i+ l9 K+ q7 r
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)+ y4 t* n' y! ]* ~; Z
{" O: o" {4 ]# a0 n
        hoverColour = mouseOverColour;
0 L9 s/ s, i4 |( a1 |        numLinks = numberOfLinks;( e/ C* B( P( |+ I$ B% z* X2 V. T0 Y
        rate = 1;4 J2 }5 w* |1 Y& D, \+ u
        numFadeLevels = 30;
- |7 C$ _2 a* K8 [1 O* G2 p* v        function initArray(theArray, length, val)# y  [& }" Y9 a! F. E/ S% k
        {! [* J( {3 Y* k" |
                for(i=0;i<length;i++)
% }" w$ e0 P0 V, a0 C& ~                {0 A+ q/ r" G2 [! ^# X% U, i, w
                        theArray = val;
: u. y# n/ n+ j+ V- X                }* e, j! G' `" K9 J
        }
" H9 d4 I& M3 [% C        bgR = '0000' + fadeOutColour.substring(1,3)
1 [' K8 R+ |( w3 Q7 x& P        bgG = '0000' + fadeOutColour.substring(3,5)4 n9 F; _, I& B. ]
        bgB = '0000' + fadeOutColour.substring(5,7)
7 V6 c+ v' [4 O. l7 t) p0 O5 R        currR = new Array(numLinks);
% z' x* [5 n) j% b2 ^. Q        currG = new Array(numLinks);
: q5 q) M0 P! O7 c( I4 T        currB = new Array(numLinks);1 t5 k( W7 l# I
        count = new Array(numLinks);
5 Q1 D* o. W% I# ~% t! W! r        fadeOut = new Array(numLinks);
& A! Y% \, n$ n5 P/ N! s9 D        continuous = new Array(numLinks);
& |& t8 d, \, T, W* f4 g        newColour = new Array(numLinks);, `; h# }" o5 A& [
        tID = new Array(numLinks);
+ l/ n/ w5 l4 V8 b, ]5 O! U0 i7 |        redInterval = toDecimal(bgR) / numFadeLevels;5 J" I) V7 a- x! E
        greenInterval = toDecimal(bgG) / numFadeLevels;7 S3 J7 t! C) R9 f- l
        blueInterval = toDecimal(bgB) / numFadeLevels;7 b9 c7 }4 X0 Q) w$ o& }2 Z
        initArray(currR,numLinks,0);% l$ E& \9 ~3 h* C8 G1 Y) W+ n
        initArray(currG,numLinks,0);. _2 J0 y: |  z' S
        initArray(currB,numLinks,0);% ~/ r' N! A; z* ~
        initArray(count,numLinks,0);
3 T8 |3 s* B; }8 E9 h- x- C2 [        initArray(fadeOut,numLinks,true);
; A7 C  _0 r& K6 Z/ L        initArray(continuous,numLinks,true);
* e4 N1 Z( L2 j}        & \* z. _9 \3 V" g. t0 P9 X, W
function startFade(id)* C- Q& p' z, L# g; r5 r/ ]% b- w
{
" F. f% R, I4 N# R        if(fadeOut[id] == true)2 T5 g! ]' n/ d5 U: A
        { /*move colour towards background colour (increment)*/
( z3 M8 o9 \( G8 o+ [                currR[id] += redInterval;
7 g: B. J, x3 J/ y                currG[id] += greenInterval;+ o% L2 I# J4 p3 g7 \
                currB[id] += blueInterval;3 H/ p! K0 o8 h) y: w
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
% N9 y6 r  j" s% d1 s! n                if(++count[id] == numFadeLevels)2 J. `) o7 }" T# z
                {6 ^4 m! V5 y8 e7 E
                        fadeOut[id] = false;
! M4 L& i% [* y8 n& ~                }/ H, I5 p; u: I% Z/ A+ K$ j) W
        }1 k( {# z: z1 X" v' e* t0 H
        else
- Z+ A( @6 V& z# Y        {
: p: e- H9 w  S! A1 D5 z  z) h$ Z: {$ e                currR[id] -= redInterval;
7 [, _: p0 x1 ]  V& r5 x4 r. b$ K8 D9 t, \- G& ?, Q6 w  w! q
                currG[id] -= greenInterval;
+ D4 a$ T- G: t! N& q. t+ S
  X- P/ q+ Q6 x                currB[id] -= blueInterval;- Y' x% O: \9 A( A3 K. |1 A
! e" d# C3 J& K+ w" z* N5 H8 m  |
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
; k, s! h! l% {% O* Y- Q0 x/ R6 e1 M  f' }! J; r
                if(--count[id] == 0)0 z5 F( O1 c& A. p/ n1 H) o5 c0 d8 x/ U
1 s$ o, R! ~. ]
                {( [( f0 N0 W1 _: {) O/ Y6 \

" ?3 v8 `+ ?9 g( d/ S( s                        fadeOut[id] = true;
8 `0 f; t6 H' ?* M8 A$ z; w" W# K9 l1 f- m( ~( s' W
                }1 ^. x' m( p3 p( L: \; m

8 G- ^7 R3 c! K% ]. i        }5 A2 D1 A; r6 b3 g: K

. a3 z2 z9 D4 P  j        if(continuous[id] == true)
; r7 u; Q  m5 F2 K' [9 O8 A
3 e7 r9 e9 I  {( R# y        {( s& @2 F: }, e! U: E9 Z# b/ U* W
) O- L7 W# j/ w" l; T
                document.getElementById(id).style.color = newColour[id];                ) Y$ [) P% \+ G

' [  R- e- w6 Q: k6 j        }( b; ?+ N- Q( B9 T! E% F
& e7 }8 z! Q2 A  a
        else
1 l9 {5 G9 I  a5 x) v! ^  X6 u
3 S1 q# Z+ D, `( u2 d- i- |/ L        {# p- j6 L, B( `  q/ {, q9 S2 I
; @; A  U9 e# O) O9 H/ d1 r
                document.getElementById(id).style.color = hoverColour;5 a4 b1 j( x/ P# m: y
6 c8 D' \1 {$ E
        }+ @$ ?" ]7 X/ y3 ?! m8 r3 M

$ |) p$ J+ H: ]7 X5 _+ b3 F        clearTimeout(tID[id]);
+ l" t  X# G9 |5 h  Z7 S3 K) W4 u
! B" @$ B9 o9 k2 p: J        tID[id]=setTimeout('startFade(' + id + ')', rate);% q: e0 c" z3 D8 g) o: y

  A+ a1 r2 Q# \$ x" x& o) n2 B}
0 P' F5 z# }% o$ A( r) N9 |8 [6 s) t
function continueFade(id)
3 H7 @) D  V9 @; O
7 h% Y% l2 V/ ~( d* P! n{1 `7 |" U( E  {1 K7 @

; s4 Q9 v, t& ]" G2 L8 X. @        continuous[id] = true;
% c; |: Y' t/ E6 W( m# _5 p0 K; j  \
}: ?+ g  I0 G# F* k  y/ D
. M- ?/ ~0 X* h& g' l
function stopFade(id)
/ K* W! {8 f. @! r% F: n3 v& x' ~/ u& v2 {4 _" ]8 K0 s
{4 i& U! e& F0 v7 x
7 w7 G3 w3 u7 {5 y8 E
        continuous[id] = false;
2 T; _: u  a0 f4 g2 z- \: b& F" N4 `  V+ c: s
}  p& ^) T3 U+ A' t" @

. c5 X) S. C' I& i1 }$ T$ zfunction StartTimers()
8 R' ~* u2 S4 m2 @
& C& W0 ]- K, Q, o& @( v{        //set up an initial set of timers to start the shimmering effect
) C  j% t% X/ {6 p) q, W! E2 u1 y1 a5 s& m' c+ M! c
        for(id=0; id<numLinks; id++)
* d' e$ T8 X- X: k0 L
+ Q. D; i! z/ ]9 n8 }        {
# S5 {3 G% f% F: [! k
/ r9 o) j% T1 u* L+ K' k                t=setTimeout('startFade(' + id + ')', id*100);0 C8 Z. E% C, V/ Z
; L9 f4 Q0 i. Y' X
        }9 U, |3 X  h0 E( d! }0 }5 ]
2 v) n- Z, u+ K0 C
}& D5 Y& o( [! }7 n! [* G" `6 V6 W

9 x# Y, B& c! v//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
1 e+ Z+ I/ W: B& m; [9 A0 c# h! ]6 t& N* p4 x0 B. O
initLinks('#FF0000', 6, '#FFCC77');
) p: @) u2 ?+ x* i7 b  x& ]
4 E( f, K# j" [5 I- M//-->
: r2 M8 f( E. D) s" `6 f0 l. y3 a
* |* n  q( M- J/ q6 `& U</script>  }& ^$ t5 J( Q; B' i
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元( i" S, K9 I( f) C1 ^4 c
</a>
1 D1 ?' [* r9 G0 }0 t5 `9 t<br>% Q+ k9 i0 N2 C8 n& \# O; \
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>
, c3 `( t; n* o  o) S$ E8 [) w<br>
8 I7 X2 n6 P3 ^% i" Z7 x<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>, C- z  D$ D4 }2 n
<br>        / u, I+ k  i& p
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>9 Y: X. I& Y6 e; e
<br>
/ y  H3 H* o) D/ n9 z9 S<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
9 I1 J% D% R1 I6 D3 X& F<br>
3 g7 l4 x# f$ j- q" p. w9 Q( G  b7 v<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>! U, }  s" {3 H/ D5 W% {
<script language="javascript" type="text/javascript">
) b8 v! l% k4 @8 q0 n! Z<!--
& g4 t& m4 k/ c* O+ m3 v) _3 lsetTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
: i+ Z* u* d6 u6 U3 g//-->
* C& y' v1 B4 u; g: T" X$ W% Z</script>