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

zw2004

<script language="javascript" type="text/javascript">
' d; Y" L+ l# d3 Z2 A<!--/ k8 _7 z, V: m: J) x
// convert a single digit (0 - 16) into hex. `1 f4 ~( g) i# @) w* }
function enHex(aDigit)
4 `1 ~* t! C7 O; B1 D! Q; N. O2 X* \{3 A8 y! Y3 ?7 J; \
    return("0123456789ABCDEF".substring(aDigit, aDigit+1))6 S0 y" v3 G: J; Y
}
: j# _% }5 i! r7 J' b7 K+ \+ R// convert a hex digit into decimal: L8 p9 y: |0 X8 ~
function deHex(aDigit)
. L. L$ o3 X, m9 M5 y/ I{7 }6 ?- Z0 I( ]: U
    return("0123456789ABCDEF".indexOf(aDigit))
7 C; r* q& L( K; A3 v* w5 h$ I}
* i& ^1 w7 q0 E* Q; G! I5 [9 F$ o  o% ?  C5 B( J
// Convert a 24bit number to hex
, t1 `0 j$ _8 _6 Sfunction toHex(n)$ Y! r) y$ H; K+ t, D- G2 x
{4 Y3 S- l/ F7 U( t  t
    return (enHex((0xf00000 & n) >> 20) ++ C6 n! g0 y+ ]" y, y! l+ t, Y
            enHex((0x0f0000 & n) >> 16) +0 h& g2 u) T/ b" ~" x" R% Y5 s
            enHex((0x00f000 & n) >> 12) +  W1 L3 x5 h, o- L
            enHex((0x000f00 & n) >>  8) +0 G3 V$ }: W2 [+ m& a1 E8 s4 h
            enHex((0x0000f0 & n) >>  4) +$ U. p1 w/ {" n& C5 u' v
            enHex((0x00000f & n) >>  0))
& A4 C3 o+ p; t! T, F# j6 _0 @* [}, l" r9 E: K4 t9 J
// Convert a six character hex to decimal' L& `- t  A6 P  |- K
function toDecimal(hexNum)
+ K7 A1 _) S8 f* }{3 Z- B3 W/ X3 N" }( N& Q
           var tmp = ""+hexNum.toUpperCase()
& B# ~% Y& K& F4 G8 n1 p    while (tmp.length < 6) tmp = "0"+tmp8 Z8 t* N5 |; E6 {5 D# k& z8 m8 H
           return ((deHex(tmp.substring(0,1)) << 20) +1 f6 Z4 Q8 F* [
                   (deHex(tmp.substring(1,2)) << 16) +
4 t. R2 Y& t4 J( N  P            (deHex(tmp.substring(2,3)) << 12) +
6 r. v" e# P, K5 [            (deHex(tmp.substring(3,4)) << 8) +
2 a7 \' K0 r3 @  p: z* O4 ~            (deHex(tmp.substring(4,5)) << 4) +3 e: w5 _: z( g1 z% c! y
                   (deHex(tmp.substring(5,6))))
, Z% E2 H$ }0 k, U0 Q}
4 C# ]/ _/ v$ v+ v) h0 g: \///////////////////Shimmering Links/////////////////////
' b0 J; c/ y, _' ]5 j7 e4 D5 v3 x" o//global variables4 m; c# \. C/ \$ d$ g. E" `, j
var hoverColour
# m& e- |; ?4 S# F3 D8 [* jvar numLinks;. t4 l* Z* q0 b# l9 X: t& V- L
var rate;  O: v; o" j2 Y! {8 X0 j
var numFadeLevels;* Y* Q$ `! f7 I9 ?: I5 q' t4 j
var bgR;
8 |& Y  D: X( s& Lvar bgG;+ g5 @- f; x, v; c2 K! u
var bgB;3 w/ F- Z! }' S9 B
var currR;
; e( w) a' M  Zvar currG;
9 A, E# m1 l5 x1 M9 ~var currB;
9 @( y+ Z" a3 b2 mvar count;3 t4 R$ U& A3 I) A
var fadeOut;
- B+ q3 z  ^8 {. |! V6 |' ?var continuous;( l0 K7 g4 H( T7 g2 K' ]' d
var newColour;5 Q# y, R( R2 d
var tID;; ]! Y* [4 U- G& X6 A0 d
var redInterval;+ {0 U, h* u4 L2 Q' P0 J
var greenInterval;
& b) @& k6 K8 r' \/ \var blueInterval;8 q0 m4 h' L0 Q. p) z7 a
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
. h' n$ d! {! r3 p  `* O5 C1 n{- M% U% n  q  e" s( R8 a
        hoverColour = mouseOverColour;
2 _) S" l6 Q5 u( M" B' A% F        numLinks = numberOfLinks;5 T7 L- p* C' l9 t7 A5 X2 b
        rate = 1;. z; P; a: F. B! K. x4 X
        numFadeLevels = 30;( E$ g& m. D( n% G* w! o' t3 F  A0 P
        function initArray(theArray, length, val)* r$ W- i3 |5 z6 l! H, Z
        {
* n0 p+ e( Z/ N' _6 x                for(i=0;i<length;i++)
/ S% E: p  Q, y* Q3 h) ^% H                {
. {" g0 c0 Z9 l7 B  q. f                        theArray = val;2 I! o& k) {' ^- f) A$ ^0 E
                }5 D+ v' Z1 y3 v0 A
        }
5 S, K4 ]  ]6 }! D$ V/ O        bgR = '0000' + fadeOutColour.substring(1,3)
" n) e0 H  J' C7 u) o2 c0 U        bgG = '0000' + fadeOutColour.substring(3,5): y3 c1 ?) d7 Z; @& d1 \" ]
        bgB = '0000' + fadeOutColour.substring(5,7)
( A( D8 J" P) _) s        currR = new Array(numLinks);* J, f; T1 [( r9 w9 @- ?
        currG = new Array(numLinks);1 [; S& s6 f( o/ Y' L4 I% T9 E7 p
        currB = new Array(numLinks);
( h$ d" }8 g& y        count = new Array(numLinks);
! v% V! g5 p: H/ R        fadeOut = new Array(numLinks);' o+ }& C$ G+ J$ O
        continuous = new Array(numLinks);
1 M  r  t& D4 i6 g: G% U+ D        newColour = new Array(numLinks);
% \( g% m) g: m4 e( K; i5 n' C        tID = new Array(numLinks);# w4 T3 m8 U* ?* R
        redInterval = toDecimal(bgR) / numFadeLevels;# M, ^: o3 v5 T- Z6 F9 M
        greenInterval = toDecimal(bgG) / numFadeLevels;
+ A/ a1 w! p1 @        blueInterval = toDecimal(bgB) / numFadeLevels;. h- w( V7 H5 Z, j" H7 Y
        initArray(currR,numLinks,0);
  n) @% \2 y* y        initArray(currG,numLinks,0);
/ {/ e5 }" y7 \% x  ?6 _        initArray(currB,numLinks,0);* N1 y! h8 n* L, ~, j
        initArray(count,numLinks,0);* T3 b. [, l7 h. I" e
        initArray(fadeOut,numLinks,true);/ _8 h! J. \$ Q0 z! l- V6 ]  k, G
        initArray(continuous,numLinks,true);
3 l& |, a% V4 P5 z$ ?/ f" c" }}       
7 A/ m# w0 R1 J# {function startFade(id)4 S  c+ U/ _: E! `, z3 X5 e: o
{
: V7 F9 [1 _: l4 c/ Y( Y        if(fadeOut[id] == true)2 ~$ a( k7 I# c5 J
        { /*move colour towards background colour (increment)*/
( o) l, T" ^" @! {, {% n, g, }                currR[id] += redInterval;& r/ `7 f  [* S: O. y
                currG[id] += greenInterval;; G! O; G, d6 d0 P
                currB[id] += blueInterval;
5 i4 T6 R3 h, Z                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
0 l0 b4 i8 S5 d7 G8 M' P4 ^                if(++count[id] == numFadeLevels)
) x! D; C: M# N2 }' i                {
. x3 u8 z" t1 K  v$ u- A                        fadeOut[id] = false;
+ R( [* _9 B7 A2 l; N; s% p# Z0 v                }- Y! O' T* m6 Q8 J
        }
# s8 t+ t) ?1 v9 y+ n1 w7 s        else+ ^  t! {% s; [1 k( d; R1 F8 _0 X+ p
        {
; B( d/ ]3 Z0 L3 C1 _6 [                currR[id] -= redInterval;3 T2 F- A3 Q0 q% [8 d
/ w% O0 ]1 r+ Y  F& w4 S% I. E" W( S
                currG[id] -= greenInterval;% x4 _+ b& L( W$ i  H7 o6 k( A

# z, w4 s" {2 t2 T2 R/ ~# O                currB[id] -= blueInterval;+ Z% c/ `# j$ Q3 f) H
/ K( B, u* ~+ K7 i# p5 s& s
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
6 |2 r  l# Y# B5 g( c& [5 N' v3 M) P% l! t( T. F
                if(--count[id] == 0)7 l: W1 T. o; @0 F
( `/ O* _: j. g1 Y
                {
) O  l; M/ I- i, x3 c1 a& \# O+ r* ~  x% T- t
                        fadeOut[id] = true;
( \9 n/ M7 L8 r# e& p4 J" T! U# q5 K
                }
( J$ [4 [3 I) ~4 c
, ^5 T; b. L/ k: j        }
4 K8 A) D2 ]* A9 p# R! n; o( D" Z  I; Y3 A, z
        if(continuous[id] == true)
: j7 P# f' V) O/ o5 h) f0 L. ]5 O' o1 Z6 t  g- B) L) {4 u9 n. f$ Y
        {
& H# {3 e7 T# j9 ?- v$ g
5 U2 }+ V6 l6 W% \( C& y                document.getElementById(id).style.color = newColour[id];                7 T# @6 F2 R* M9 f7 m

# I2 {0 L% O) ]' g+ m- o: o        }
5 B. c& A9 Q, r' y, L  `. `$ ?
0 U, i5 Q" }7 M# c- D        else
9 n( U$ J4 Y% W, H$ K  K; f) [6 [3 m, {+ A5 s0 u: c
        {* k2 m3 D8 X  ~" e& ?" X
3 y# [! N, p% G
                document.getElementById(id).style.color = hoverColour;
. w7 E! c4 i% p* e
+ P! J3 g# F% g9 W. K( z        }! H5 k6 R+ W1 L+ I' ]* ^- u. V
1 c* P4 m6 M2 h! o' g( j' U3 r
        clearTimeout(tID[id]);) J$ v2 ?+ d2 M7 \- Q

7 e: l5 T; [/ ^4 C% E. L        tID[id]=setTimeout('startFade(' + id + ')', rate);! H' C4 N2 E5 A3 z& |
: d; [% U+ Y9 G9 B# U; J
}/ E3 \) l, j8 M+ W" e! n- d, s
: H/ [. k3 V. Z; {! K9 [
function continueFade(id)- g0 [" W& r' Q! ^# L4 w

! a. _! o% ^* L{
2 K' R; v' h5 h( Q. C4 |$ g
- H/ D2 t; W& ]9 l% F+ h4 d* t6 G        continuous[id] = true;
# W! ]1 B( K: e: F
+ q) L7 k3 G7 H' G7 c( ~8 m" l}" m. @% a5 n% j* c
4 c3 E+ v& O+ Z! e7 L. }
function stopFade(id)
. o& A& x/ O& b' n$ \
: X* w* l  L  \  n0 h  H{
, d2 z. O3 x9 [; v  S' t5 y1 _) P& d% l: w
        continuous[id] = false;
5 a1 q5 S' \+ r/ E0 {' Y. Y& x
3 t) B. |& J# a3 N}3 ?1 W! `; Y9 E8 B, g

  \% h9 O+ f' r2 D! A: S- Wfunction StartTimers()
* {1 L1 w7 r5 |4 ^% f" k; L- l4 c& x+ l1 |6 P4 J; W
{        //set up an initial set of timers to start the shimmering effect0 L) v1 j4 x  X) Y$ f  X; U' D

" }( w+ i( ^, \        for(id=0; id<numLinks; id++)
+ l; e3 D# K* N1 X: |6 Y
: C: L+ A3 t. [+ p  {% G  A6 H        {. r8 k) v9 R: y* A
! \5 C5 w5 _9 ?' z9 c1 B  q
                t=setTimeout('startFade(' + id + ')', id*100);* ?- I$ [, a/ @& y4 A8 R
! M) h. \5 P3 X8 {
        }
4 N. H: o" v# h% q7 I$ v- k( _
$ e9 `) L- M$ n9 x  a, _}. H+ m* S& ^1 o4 V- h

) N8 b( Y' t# F//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')' o# y: z  z/ `  H1 z, s

# q' Z2 d- z  S  w/ oinitLinks('#FF0000', 6, '#FFCC77');& a& e+ J0 Z  m* C$ k$ f

! e* b4 x; ?: {. \  k//-->
* t+ D+ e6 _) }2 _0 G) _5 X. `8 g* ~' o1 n4 R; d
</script>2 z$ w6 [1 _5 n/ n
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元0 S" q. N. o( y. ~2 I
</a>
, I) ?- ^$ Z  z8 h+ ~1 q<br>
: K% |# ~  }5 r2 F! ~. N0 J<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>6 k$ K4 o0 G' P0 E
<br>  E% E1 }6 p8 b2 ]
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>  ^* y& Z$ J9 S  u
<br>       
8 x. C3 P% `' n<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>) ?3 m5 T0 |5 c4 Z- F
<br>& F' ^8 @. x' e' q0 s
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>$ X" f% `% q2 Y9 y" c0 x- i
<br>* y2 g8 Y2 k' f$ t5 I
<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>6 ], M! Y  @9 u. W
<script language="javascript" type="text/javascript">
0 l4 A+ c; m# x6 O8 t. u<!--
: ]7 m9 Q+ T6 B( i( I( UsetTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
# Q* B) I4 P9 v3 b1 J$ X//-->% n8 c6 E% z; N  @+ y! w: b
</script>