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

zw2004

<script language="javascript" type="text/javascript">
. J+ t; k' S( b2 p<!--# _9 \9 j  a0 i, C7 I& F
// convert a single digit (0 - 16) into hex
; Q: Z8 i" C; u$ O9 w2 L* J# Ffunction enHex(aDigit)
, i7 Y- g* S$ m' T3 a: q& e: \: C{, K3 t/ D9 f, \3 g
    return("0123456789ABCDEF".substring(aDigit, aDigit+1))
* ^7 |" P. Z6 L& H3 e! e}
, r! N; Q! ~7 s5 d// convert a hex digit into decimal! x2 K% F- C3 ]  {
function deHex(aDigit)6 G6 Y; }. ^) h( X/ r  j! I
{
- M5 v* [/ \' T7 J$ M    return("0123456789ABCDEF".indexOf(aDigit))
" M: p; j) Y( y3 O& \& R}
) s4 n9 e0 u1 j7 E
* D7 A( J$ I# J3 y) P! i! d// Convert a 24bit number to hex
9 V* U- u! O, ]" n0 Rfunction toHex(n)) e5 b, R  ~, ^5 h) A2 T. {1 p
{" U% b1 o! ^4 B: F; r
    return (enHex((0xf00000 & n) >> 20) +0 s5 O& A% k4 \) ~/ z# F: ?( a5 {$ O6 O- k
            enHex((0x0f0000 & n) >> 16) ++ c  B6 d; d; [- b( J4 k$ l
            enHex((0x00f000 & n) >> 12) +' c9 t4 k! Y. n: C6 L
            enHex((0x000f00 & n) >>  8) +* I& F' S6 J$ _9 E! ^$ L
            enHex((0x0000f0 & n) >>  4) ++ R6 [# x3 n, X1 K
            enHex((0x00000f & n) >>  0))) e5 p3 A4 f. w% W" a( ^
}
+ K4 q3 {- `0 j, s1 s// Convert a six character hex to decimal
" C$ z, A' w& n$ C/ z9 J# `function toDecimal(hexNum)
$ T( k$ _& y, A' |{9 }* c" l6 Y0 c, ^- w, x- ^% k
           var tmp = ""+hexNum.toUpperCase(), s( y! S- Y; N
    while (tmp.length < 6) tmp = "0"+tmp
- J! _  ?3 w& |* }3 q/ @: j6 d0 ^/ R           return ((deHex(tmp.substring(0,1)) << 20) +; g5 G* ~& w5 \  [# Z. q9 O
                   (deHex(tmp.substring(1,2)) << 16) +
! u6 y& c9 g9 O            (deHex(tmp.substring(2,3)) << 12) +
4 [( S3 L5 V) y" z! P9 F            (deHex(tmp.substring(3,4)) << 8) +
! s' G% ^! _5 [) L$ Z& i( u            (deHex(tmp.substring(4,5)) << 4) +
+ u7 }: V/ t5 O$ F( o                   (deHex(tmp.substring(5,6))))
( k6 A1 I! q4 D}
& ]# u- Y0 `* ]) R5 l; ~9 D& x///////////////////Shimmering Links/////////////////////
# y+ L* G8 R/ w2 J, d//global variables
; f) C2 ~8 _5 w1 {+ h8 L, i" Vvar hoverColour
; W- {) u) b7 v- D" Q& Wvar numLinks;
# V* T0 u3 K6 {- t" b7 u) D. {var rate;
6 S( N9 A  C) z/ y$ o9 s( f7 B* Pvar numFadeLevels;
* h/ O3 i' Y5 N0 ^  V7 \6 ?: f0 P7 R/ tvar bgR;+ R) G8 b8 w% j
var bgG;  f7 X0 Y! n6 U$ ?3 x: z7 o
var bgB;* F. F1 g8 w. m  |- S, ~* e. p
var currR;
' ]8 W0 O6 f. j3 h6 t5 Lvar currG;
& ]4 C1 g1 r7 T6 y4 Evar currB;
) T6 e. j3 E) jvar count;
0 U  ^3 H0 v& ^* k7 z1 uvar fadeOut;4 {  D' R* y2 M# T; t5 l1 j
var continuous;
+ I% U. p' z$ yvar newColour;; k! l" R* w1 q! P/ z9 ?1 f  ?
var tID;$ {0 B4 W# U/ V- [% \6 T! F
var redInterval;, H* O" [" N7 Q  G
var greenInterval;
6 h& F4 a9 H5 P3 G" Dvar blueInterval;( x4 L0 }1 G3 D. c# Q6 v/ X' `
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)( P  D% B; Y  j
{
0 a) Y. q; g9 @' e& g        hoverColour = mouseOverColour;$ h( f1 R9 S& l, U$ p# M
        numLinks = numberOfLinks;
. U- y6 P6 S' L2 e8 A        rate = 1;
1 j- w: L6 P  B, X/ ]        numFadeLevels = 30;0 g  n8 m0 Q) \9 ?0 y; e& F
        function initArray(theArray, length, val)
0 U. q0 P/ I2 R, f# Y3 k        {' X  ^( j+ ^( U, r) y' D& S/ p0 n
                for(i=0;i<length;i++)+ [0 I, g- q9 f  \2 O4 u
                {& ]; s, O9 a" s% _3 `( k+ B" z7 w4 n
                        theArray = val;
8 e6 z0 B3 h1 j7 K0 I3 b+ H                }
( f7 E6 N  a8 n  g3 ?        }1 }$ x) G# v* }1 J' ^
        bgR = '0000' + fadeOutColour.substring(1,3)
6 |; B5 |5 h: R2 ?# `7 W        bgG = '0000' + fadeOutColour.substring(3,5)2 |3 H1 V( K' c+ D& Y- ^1 _% V3 r
        bgB = '0000' + fadeOutColour.substring(5,7)
3 S& e: h: g- O: c! V& B        currR = new Array(numLinks);
# e% L" k' i5 z* N1 C) B        currG = new Array(numLinks);0 U' ~3 b  }& D
        currB = new Array(numLinks);
3 c" Q! X) ^1 @; m  z        count = new Array(numLinks);
& X9 c+ L4 E* {5 I2 V        fadeOut = new Array(numLinks);/ U& L; i, m9 I$ j- f( v
        continuous = new Array(numLinks);" n+ s4 F1 d0 Y9 T7 e& M
        newColour = new Array(numLinks);
9 |2 l0 w& @9 F% ?" l( R% i        tID = new Array(numLinks);
, l9 `3 C  d7 i& A  T, r3 O, p        redInterval = toDecimal(bgR) / numFadeLevels;
7 q1 i( R- f) {& t1 k* n        greenInterval = toDecimal(bgG) / numFadeLevels;
$ t& F  K7 _6 d" M        blueInterval = toDecimal(bgB) / numFadeLevels;- Q' f4 S) A, K4 O, l- C
        initArray(currR,numLinks,0);
) _, k( E- Z9 ?. S) s0 c        initArray(currG,numLinks,0);+ x& D3 |4 o7 z( {+ U1 ^1 @- M
        initArray(currB,numLinks,0);# u. o3 e7 n  \# n# m' y
        initArray(count,numLinks,0);
* ], v0 c4 O- ]+ z% m! f/ y5 O0 E- Y! `        initArray(fadeOut,numLinks,true);
( D/ A  w7 S0 n& c        initArray(continuous,numLinks,true);
; D. t7 V/ p  }" I}       
1 l; x. Y! O& F' Y3 ~function startFade(id)! w7 g* a2 |, ~' s% ^  k) o  K
{
8 M5 M7 A' w& k# T        if(fadeOut[id] == true)9 t  U6 W! n1 g8 n8 P9 k! O9 [" ?- t$ G
        { /*move colour towards background colour (increment)*/" X5 h4 ]1 N$ e5 G. |* O; f
                currR[id] += redInterval;/ O, [# @2 F& A  h! S
                currG[id] += greenInterval;  S* g7 A( b) T  q& S
                currB[id] += blueInterval;6 W# z1 }; j$ a& h+ }
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);3 Z$ C2 i$ O/ P( A0 C
                if(++count[id] == numFadeLevels)$ n* U+ p4 }7 j
                {0 h4 e6 [* M; s
                        fadeOut[id] = false;
6 v" {( V% O2 h0 [& N3 k                }
9 X% H0 K4 c9 h        }
& A' B; h/ l' U3 g! v+ U. d; ]        else! C+ i0 q* X8 |# ?
        {1 o0 Q; o8 H% s' U! Q* f( \
                currR[id] -= redInterval;
$ m# j6 {- u7 w( O
  m1 c/ c/ q; \+ e                currG[id] -= greenInterval;
% B: O) z8 `. K. |/ V0 G6 H5 e) v% q( `* ^: H
                currB[id] -= blueInterval;
5 h) k8 v* u3 E+ ?# n5 i, N4 c% I7 q) `
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);+ p; U4 ~; y3 o8 O0 j* K

' Z. J1 [) u. f+ g: [                if(--count[id] == 0)
) g5 Q) `) L/ j8 n, W2 p! f: ~+ F6 p+ W3 a/ E8 X+ Q3 z' O# ^2 g
                {
* R+ E! L1 w' {, @" c' x( m" q7 {, n+ |1 O3 J7 C  s1 h
                        fadeOut[id] = true;
2 E# o% f! J) G0 L
5 J0 v. ?$ [/ E* v! O! u# h                }" U; M) L! R, H
8 N8 y7 N- c7 f- u7 Q4 U
        }
& g/ A+ U% K6 Y* S, x6 Q! ]' {8 @4 B+ W2 C+ Z  l3 ]- j
        if(continuous[id] == true)7 {* U7 `% ], u# i9 }9 j

& Z  M5 l; y6 S) O6 r3 j- X+ b- Q        {6 H6 y- R" C4 j2 \  t3 h7 L# P
/ k* Y1 R$ G7 R. Z8 f9 ^5 _
                document.getElementById(id).style.color = newColour[id];                ; o' o; {2 Y* x; x- f2 g

" Y, X% Z5 @( n) |        }; P6 b/ G) [* A2 Y8 D/ P
8 i/ g* A( w5 Y& N: y7 U9 b" k' q
        else
  l/ ^# x! Z. |6 s1 B7 M6 R; I' S
        {+ f3 b+ y$ Z2 U) d% K5 T. h9 ]
, h( S- f$ V( x" z+ C. Q
                document.getElementById(id).style.color = hoverColour;
' X8 p+ [  Q1 [) c; X' ~7 e+ n' p
        }
2 _" |$ u$ v" w
* N( `4 {  Q* R7 t6 H! [' @        clearTimeout(tID[id]);3 T# ^! G5 Z& G3 [) t$ F. K

  R1 I6 N* m' n0 I/ k        tID[id]=setTimeout('startFade(' + id + ')', rate);
; k9 G1 R) b0 R% T" m, g; v9 [  C# _% L- P8 s9 z% g5 }) s
}
( A& ~' D; M/ r0 h, y; }; o. K  e" N% N' ^1 C" k# f
function continueFade(id)) w8 T) X9 O0 m+ U5 a0 J

# k6 k/ C6 w" ~& c. {{
# G. D& c! Q9 e2 L+ v9 r! s: q
( }% h3 {6 }! ]' I        continuous[id] = true;, P7 H. s, W/ E, B; s

. H1 t) e6 I8 m  V' K6 S, t}+ s5 J- R' y5 }
6 A) m8 t+ M- c" @! r
function stopFade(id); s- Q7 M% s& `+ w* k: ?2 m; M
% A% K! l7 X0 Q, C/ D# n
{
; {& i5 |" z! Z2 A4 g/ G9 X  }6 s9 ?
$ J, i% U; Y) v1 |8 E2 N        continuous[id] = false;
2 r( E+ ?. Y% m+ `+ h: `" e7 `& L6 a2 x" Y9 P1 G; A# B
}
  L8 @& g7 O( c6 ]5 @! {9 ]% N* F5 g6 U( \. C. ?
function StartTimers()
' v* j, z8 B9 U* Z' j
# J; s0 C4 m4 p{        //set up an initial set of timers to start the shimmering effect4 ~3 Q% s% H, Z% U

: P  P+ y+ h* c% I5 X9 q5 T        for(id=0; id<numLinks; id++); P/ w0 B5 F5 ?; V' h( l( E5 m4 p. ~8 e+ v

* w8 v9 k& y5 Z; c8 N3 U* J, V        {2 q( G1 `" D( ^. b

1 J/ B( n. `0 X" d6 f2 k. u9 L                t=setTimeout('startFade(' + id + ')', id*100);  {. A- s! h8 x" U

- j7 k% v4 ^- |& @* q        }
5 S* q* ~, s( J( S" n% N; U4 k; ]  O2 d: [6 c2 R! {- U
}
, b4 _3 j1 j4 X& H
/ X8 r: K2 y6 B- |- V//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
, \4 h  `9 N- b9 F
  w- X) v% E, r) n) h2 zinitLinks('#FF0000', 6, '#FFCC77');
/ ~4 S. a, ~9 b  B- z
) K; A& c/ e  ]. Q//-->, [2 p& q( ~7 [0 m. u8 a1 G4 {& X4 V' x/ C
. a- z2 O# G: u3 X8 J  u
</script>/ ^+ p& `8 V* O+ l7 g
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元1 a" G7 P! S, `6 D4 N* E4 e6 a5 e
</a>
& X) P% r$ _# S  x+ z5 s+ G' p<br>
# s; ]# w* r) k; q* |2 [<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>
& [9 n, }, c, Q# [& H<br>) G2 Z6 K" J0 X- g2 N9 S' ^2 B
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>1 l' u1 x/ z; I  s" P  x
<br>        ) a/ y' c1 v2 r0 h: \
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>- t; c# O: r6 y' F) X
<br>
* X( M' z* L3 Q<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
1 n! g, g9 ^7 [* i+ O<br>3 |7 j5 S$ H6 e% i7 ?9 b
<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>
4 \4 i' o" [0 Z% H<script language="javascript" type="text/javascript">* D4 ?" w  r2 I! u: d* F1 u
<!--
' t$ j) b( s0 ]0 C" Y) m5 l" JsetTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
) Y2 Q3 x' W1 G  v% `+ b//-->
# U8 ?, F3 c/ B2 _( d& O</script>