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

zw2004

<script language="javascript" type="text/javascript">
$ j& @: p, n% X6 t. j7 ^% R  l9 h+ c<!--
  }/ }4 U. J" g8 c) I& h// convert a single digit (0 - 16) into hex. O' `& H0 N0 s9 r  _
function enHex(aDigit)% }8 q2 f2 W! ^, X% |& C4 C' V
{
7 m& ]" l+ c. e8 G$ B2 e& H    return("0123456789ABCDEF".substring(aDigit, aDigit+1)): D, N; Z* Q/ B; }( `9 j7 r; R* l
}2 V% |6 N3 l' V* S7 u3 @
// convert a hex digit into decimal
- O, f; e6 L$ x; p* V1 ^* F/ P; [function deHex(aDigit)5 X( e# Q9 Z5 ]0 g5 S8 o! E7 \0 u
{
  T, D6 h" D/ e) ]3 p8 i" M% Z    return("0123456789ABCDEF".indexOf(aDigit))
0 w) a, q1 k6 T7 i4 t: W4 {$ m}2 d* P" u3 B2 L* N, \
' n) D! X0 V$ d/ Z
// Convert a 24bit number to hex
8 S" I9 S6 _, nfunction toHex(n)
# B1 R* O5 n4 f! a* w/ M. n{* m# c2 Y4 K6 L8 N/ X
    return (enHex((0xf00000 & n) >> 20) +
1 X) z2 c2 ^% |: t7 o* B            enHex((0x0f0000 & n) >> 16) +
; W/ m+ |' g# o: U9 b3 @1 e            enHex((0x00f000 & n) >> 12) +: n/ a; \! F) b( Q1 t! b, `" v+ j' y
            enHex((0x000f00 & n) >>  8) +9 y) f3 L8 z; `  a7 d- @3 R* Z* D& i, q
            enHex((0x0000f0 & n) >>  4) +5 z$ U2 |7 s. X, e& R
            enHex((0x00000f & n) >>  0))
" p# q' H; r: f* @! M}
0 Z9 e' p0 |& @! p$ U// Convert a six character hex to decimal2 ~( x, O8 B$ [
function toDecimal(hexNum)
( Q: c( b4 f' r- |. S/ M3 R{
# _2 M- k2 W! b9 k* }" p- x1 t           var tmp = ""+hexNum.toUpperCase()) \7 c0 L8 @; H* H
    while (tmp.length < 6) tmp = "0"+tmp
- U9 O3 g* b' ^5 A8 a           return ((deHex(tmp.substring(0,1)) << 20) +
; `0 F8 b8 f/ h2 k' j* Z' F3 b# h                   (deHex(tmp.substring(1,2)) << 16) + ; S. J6 ^5 p& h2 s
            (deHex(tmp.substring(2,3)) << 12) +
# J. r! W( d& R/ Y0 o$ \            (deHex(tmp.substring(3,4)) << 8) +
. W9 T) @) w. U+ e& z! e            (deHex(tmp.substring(4,5)) << 4) +
- p" n( Y# f- f8 K! v( y                   (deHex(tmp.substring(5,6))))/ s/ G: c2 e. T/ j- t- y+ ]
}
$ A! G- C- \  }- \% r2 ~/ H/ Y///////////////////Shimmering Links/////////////////////
3 g& b% v3 c4 O' W//global variables# z( t- B, ~  J/ q
var hoverColour# O9 u3 Y$ H- n2 A, j
var numLinks;7 i1 I6 P3 Z4 T0 H% \/ b
var rate;
! Z( o( O* F: E  c" Vvar numFadeLevels;, s1 T8 Y8 n9 h/ h) X
var bgR;+ q2 F* J' k! g1 x
var bgG;
, s9 x( T5 q: v* o  J' Fvar bgB;
; }8 R, z# l7 ~  Q( i) |& Gvar currR;& P8 L0 H; u$ x& y
var currG;8 {5 X0 B7 a* {2 e
var currB;5 x; a3 h2 T6 p
var count;
: S& B4 F& V6 m+ i2 f1 J0 P/ Evar fadeOut;
8 r5 H6 d- Y: n; I; C# Y: d0 nvar continuous;
  I. z3 V- G& z3 E: xvar newColour;, y8 m7 J0 d) _6 L: E) C
var tID;
0 h$ j- z; j; e$ K8 q& ~) G$ V" Yvar redInterval;- p" `" ~/ d: Y7 z$ m& a8 X. H% |, u
var greenInterval;
. D. V# H" ]3 m( Uvar blueInterval;
7 D7 l1 o: }8 efunction initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
$ K7 ^  o! f, d" O{
) ?( n! R, b, ^6 ^6 n4 w$ N        hoverColour = mouseOverColour;4 e, p5 g4 _0 Z& }' `  P/ Z
        numLinks = numberOfLinks;
; S( T* a  x/ a" Z1 H3 G% q        rate = 1;
1 M0 W+ R, y- j- d3 {8 l        numFadeLevels = 30;
) n  s+ S/ {. Y3 I/ c* `5 }* c        function initArray(theArray, length, val)0 Z  v# c& T* H) `3 J# b
        {
4 m3 C) }. H; m" v0 D0 Z: |' l7 Q                for(i=0;i<length;i++)
) Y8 ?9 Y& R6 }5 k2 C# k                {, d: [% s; g* E9 X
                        theArray = val;
+ \3 u' O6 L9 r$ z" B! j/ v% ^5 |                }
3 y# Y) ^. d) l0 z# j9 t        }; r/ {" M. p" b& A8 r" |
        bgR = '0000' + fadeOutColour.substring(1,3)
3 B9 \' l+ X! X        bgG = '0000' + fadeOutColour.substring(3,5)( z: \9 T3 n! `
        bgB = '0000' + fadeOutColour.substring(5,7)
* a+ C9 t1 m3 }/ w0 v! }2 O        currR = new Array(numLinks);
1 M, v1 h/ T. P' e1 V6 s        currG = new Array(numLinks);  M! D: D. M. a( s' k3 I
        currB = new Array(numLinks);6 [+ u" w5 m( F
        count = new Array(numLinks);9 R! b) Q. A7 S  p' U5 A
        fadeOut = new Array(numLinks);
0 E8 F! {3 R  [/ ~        continuous = new Array(numLinks);
/ H2 g2 [6 r, T- S2 |# R& x4 N        newColour = new Array(numLinks);
  G& S6 e$ ^6 |. ]  t        tID = new Array(numLinks);$ c0 j0 a: d7 q8 M9 O- R
        redInterval = toDecimal(bgR) / numFadeLevels;. m1 D' Z' D! ]  o! b0 O0 C3 y' F; E
        greenInterval = toDecimal(bgG) / numFadeLevels;
7 J! o1 P7 _& Z# ^3 p6 w! ?1 `        blueInterval = toDecimal(bgB) / numFadeLevels;. x) o7 ?# H$ x2 S
        initArray(currR,numLinks,0);
" Q( b. ?8 H8 G$ _1 j) `: P& k        initArray(currG,numLinks,0);7 {, u& M+ z4 W$ c4 `
        initArray(currB,numLinks,0);: W+ Y% `2 k$ c* e
        initArray(count,numLinks,0);
+ ~. a6 ]( Q, Q. z6 i8 T4 y2 H        initArray(fadeOut,numLinks,true);
: A* F. X1 t- R" M! u( l0 c+ o        initArray(continuous,numLinks,true);6 w/ |* r3 `* t: B8 |
}        * T  E3 n8 O5 Z, q- {  n
function startFade(id)- n9 ~; l% d$ f; m! K; E/ A* v
{: O( L" I9 d7 ?, d, W7 N
        if(fadeOut[id] == true)
: i( p5 |$ J$ x6 U        { /*move colour towards background colour (increment)*/! Q, h- b! C+ b+ z+ K
                currR[id] += redInterval;4 _, ~+ C) {0 e$ R
                currG[id] += greenInterval;
/ _# `" u. ^7 i% a8 K# @% Z                currB[id] += blueInterval;
, R5 S0 \* c1 `5 s                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);/ G# n: N& W( k" @* n8 X. n
                if(++count[id] == numFadeLevels)/ g; g- R, g: g% |
                {
8 I: D: b, h3 [1 G% A) ?1 d7 Y                        fadeOut[id] = false;
! r" L% @$ n$ k6 n, ?                }
9 X! U" W+ X+ X6 e: O5 x9 `/ B' v' K        }
$ d; ^8 {4 t2 o% O  U+ q        else5 ]3 g9 O3 H$ Z2 ]3 t2 {6 }
        {
$ X" o; t+ @/ o) q                currR[id] -= redInterval;7 d& t/ d9 Y: G* ]- N, n& K

, a2 ~! ?' Q" X' F                currG[id] -= greenInterval;: N. z4 D" K1 h, M
' y6 j- `! r4 C9 U* I1 I+ f
                currB[id] -= blueInterval;
9 n4 C- Y: p1 l0 U- B
( W7 _# P3 S$ N                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
* O8 U% a- `) j, j" n6 P3 u9 T5 E- f0 l" r
                if(--count[id] == 0); |  z. A; x) j2 I6 s/ }; n
2 f4 X+ n- X; c; H
                {
3 g0 j/ F8 L0 B  E* w+ g, l
4 L1 T1 k; t. G& y5 c9 B8 W+ T- n                        fadeOut[id] = true;
  S2 n( V; Z+ H% F; _1 M- c
% }8 x6 ?+ N- G" G& W3 X( U0 p3 @                }
: C0 O" m/ q" E6 s& {+ }! m5 n% b
' v% p5 `1 i2 s. b8 I        }; k3 w+ a  _8 T0 C* g& S: o5 P5 W3 V) ]
. w1 [+ @! u6 B6 e
        if(continuous[id] == true)3 Z' l- _% l. ]5 n& F" h6 h! `

3 O+ G- V# u9 [' @        {
! T+ v# R* X9 r; g  C1 i6 @9 E$ E% o; Z# D3 V, F8 H
                document.getElementById(id).style.color = newColour[id];               
: A5 J1 P* G  J- q" K! U$ I( C% Q. V# }8 \0 u
        }
0 j2 A4 S: X( F" f* p: U' d# i, c$ G/ a4 V. b- w
        else
+ y% `5 V, Y# T3 F. M! B) J; y8 ]/ I9 k) }9 z
        {
* i$ E- K/ R- _" x" R
6 Z5 D) w7 [8 E" {  q                document.getElementById(id).style.color = hoverColour;' s8 A9 \5 ]4 ?9 t! q1 W$ X& `

& k- W  d4 }0 Y1 e3 z6 r) D        }
& r/ A. S* ~: {1 G/ Q& d5 x+ Z, R4 ?9 U8 l" }' B+ z
        clearTimeout(tID[id]);" u* l6 r2 m0 _# U" v# W8 O  \; w2 @& T

' V. p% p. g" |( b# p+ D) v# b" x* h        tID[id]=setTimeout('startFade(' + id + ')', rate);
* U/ e1 l/ _7 b% y  X7 \: X
/ A1 K- X& b& x) N1 e}
" d7 `+ X5 ?) _& b# e) ^: f) @5 c2 {0 f7 P) J1 l! X
function continueFade(id)$ x6 P( Q6 l. M  y
: G( R7 p9 i! J( X
{
7 x+ [) V& J0 t4 \; X0 r2 Z7 G' l& Y8 L7 @
        continuous[id] = true;$ T  ]6 a# r1 R2 h( W% J5 T
# Y% ~/ j) H4 _+ M/ Q
}+ ^! C! U  A1 M) @& L% B9 `( g
0 `8 B: s. y4 j* x$ v
function stopFade(id)
! O! k- f. t) V2 U3 ~+ i4 g! r. p" t6 G3 O4 Y( s5 y6 r- Y; n. Y
{
) A! S  B6 F0 n7 d1 ?/ ]
5 {% q) Q& D# x, f8 H3 t8 v        continuous[id] = false;8 s$ I& D: _, |7 Q

* A7 r5 E% x( Z+ Z/ u}
" Q6 ~; m+ f5 O+ _9 S  J5 {& J. L  z& F! q3 T3 |
function StartTimers()
5 \0 m2 L' x. M& t7 {& {2 X
, r+ R- K5 }1 h: m{        //set up an initial set of timers to start the shimmering effect
7 V7 H% x  ~0 E3 n/ h( t$ F4 I7 b+ \; s; A9 v" M2 r% _7 k
        for(id=0; id<numLinks; id++)
# n( p- L0 v/ T' G* R- K6 \5 T7 T; c2 d
        {" M& x$ m1 V1 p) F! n1 Z
3 O7 _# ~: E  g
                t=setTimeout('startFade(' + id + ')', id*100);
6 G, J- {) Q1 R5 g& Z* O( w+ ?
! D' o$ T$ w0 r2 u        }) O, |- Q' [2 _+ b) l0 m" [
2 l+ P: n2 G7 C( f0 I: X/ A
}
" z7 t' L$ h: V* p% c8 S: |
+ l, l: h- ]6 W; J* u# S//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
9 g/ d& ~% N$ j& B7 ?- A+ P9 D7 R. E
initLinks('#FF0000', 6, '#FFCC77');
/ K" u* j. G/ s' q7 E0 A5 y8 @  j, b! T8 _# _1 u
//-->
/ n% f+ Y6 ~" ^$ d4 y
( C2 X( S4 c% D) m' W</script>
9 b2 {( l" d$ n! {8 Z( r( z7 A" J<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元; I) r1 q3 n6 H* M' x
</a>/ E' `7 b* w$ I! Q4 t
<br>
: e' ]$ [1 O& v9 U- a' E<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>
: C0 r7 O. p! u0 X$ F<br>
3 Q' w/ V0 x4 r% H" ~+ r+ X6 ^<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>+ {9 H6 _5 @) E) @. h1 v
<br>        & `4 c+ R2 ?) L( t3 q4 K
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>8 {. B7 p; D/ w  c. X+ h# b
<br>- m3 Q$ y8 J' g3 O" M6 z, a  F
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
  V; b( @2 ^* J5 H# A<br>/ F5 _4 M7 Z7 d5 u
<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>
$ _) e: }8 d* x4 E8 I4 J2 _<script language="javascript" type="text/javascript">" `, N0 N, c! u4 x# @, u7 E1 ?! l) {
<!--, z+ \/ ^8 b; a/ O7 c  ^1 A
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
, F5 U0 g/ o  I) G; E//-->0 _7 _: K, l" G; i* x& \, x
</script>