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

zw2004

<script language="javascript" type="text/javascript">9 e) y, @) }6 e6 E# U3 c$ @& M
<!--# m9 B7 O' b' h! \( I5 `
// convert a single digit (0 - 16) into hex1 F+ u2 ~0 k3 c; s& D: d( F% [
function enHex(aDigit)
" n2 Y" M% i' F+ }: u{
- O' _# _' A2 c8 p. ?1 D    return("0123456789ABCDEF".substring(aDigit, aDigit+1))
6 |/ R* i; L  o# s}: l. A# D6 P, b6 V! ]( }$ b
// convert a hex digit into decimal! a6 k' m( r6 X$ _4 g
function deHex(aDigit)
2 j& y$ a! U: _% h! h& a{& e1 ~8 v4 ?1 z2 l: N0 R
    return("0123456789ABCDEF".indexOf(aDigit))# B0 g/ i& u: b+ j
}
6 M" D# }$ j% F. U. J! d' x  Q5 H$ p+ R$ s6 }2 }6 f' ~9 g
// Convert a 24bit number to hex
2 n, z" k' c1 s$ _* _3 {function toHex(n)
! A. ?3 Y, C7 z1 q$ B1 k{
9 L0 [$ n6 y: n4 ]+ ~, Y; t    return (enHex((0xf00000 & n) >> 20) +3 b% j: R  M  F- c# |$ H& |' K
            enHex((0x0f0000 & n) >> 16) +
# V* d2 \) b  ~# _' u: J            enHex((0x00f000 & n) >> 12) +
9 T( a2 y/ p  i$ ^6 {- \9 z            enHex((0x000f00 & n) >>  8) +
5 k% L& s3 H; w; {+ |. W) O* a& I            enHex((0x0000f0 & n) >>  4) +0 f3 x( p/ W8 r  j4 i: b) ?- v" V
            enHex((0x00000f & n) >>  0))' ^4 e- y6 q' X7 J
}
% z7 N" Q+ L. d% u, p// Convert a six character hex to decimal
. }, {6 W7 [# b, X0 x" J; Efunction toDecimal(hexNum)- G0 V% k* D. T) T& c% K
{" q; \8 B7 c* S; E- J
           var tmp = ""+hexNum.toUpperCase()! ?* [/ a' Y) ~2 Q1 C/ l
    while (tmp.length < 6) tmp = "0"+tmp, L) i# l! q1 \' i9 h4 T
           return ((deHex(tmp.substring(0,1)) << 20) +
6 I% c2 r" B) `6 m# g                   (deHex(tmp.substring(1,2)) << 16) + + G1 w5 C4 _/ ^. f9 O. D% q
            (deHex(tmp.substring(2,3)) << 12) +
4 `& o& m( f0 a            (deHex(tmp.substring(3,4)) << 8) +
9 n( c$ y1 @& s$ n- @; D9 a            (deHex(tmp.substring(4,5)) << 4) +2 s% g, P' N0 ?7 C* i5 t
                   (deHex(tmp.substring(5,6))))
7 O6 N) v4 s3 x0 J+ G: g3 V}! E- |9 v  p: E$ ^% H# J
///////////////////Shimmering Links/////////////////////
$ f! r; b* ^$ R8 z//global variables3 j3 e8 s; |" M, n5 K
var hoverColour& c5 s; |" v+ S' j1 G8 X$ R; J
var numLinks;; ~. _7 Q% L5 f  k8 J5 w
var rate;
2 P& c. j- @$ N+ w* H$ k2 ]var numFadeLevels;
( {# M0 e$ X# T1 w# @8 w" r5 `var bgR;
  |- L8 }& h9 ~- Y3 U+ q5 h5 pvar bgG;
9 y& e7 T6 D3 E! R: }, gvar bgB;
1 j/ V, g; n! R! Gvar currR;5 v1 Q- D# S# T
var currG;. @' o' a, |2 g7 x- A, e
var currB;
. ?9 |# M2 j! A! ovar count;
( I4 q5 U4 {$ }6 A, b- q: w1 b& evar fadeOut;: x2 P3 u; W+ V3 Z
var continuous;. ^8 }$ y4 u, B- r
var newColour;+ _! M6 L3 j  y$ N+ y9 ^* I
var tID;
3 I* ?: P- o/ c, X" hvar redInterval;2 ~& t" x: q0 e
var greenInterval;
1 n0 u" W: ^8 I  x) |) O! Vvar blueInterval;8 K& R/ g+ U+ [6 |
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)* }5 C0 Y3 k$ U- p4 {! n% r$ Y# Z
{
, b3 L# y. z+ W* W& k$ X: y        hoverColour = mouseOverColour;
  Q& m, E& C4 |- C. x        numLinks = numberOfLinks;* G  m3 T0 `* D+ P, ]
        rate = 1;! f( W% l3 I% T  E
        numFadeLevels = 30;
# P6 B& E8 k! n) F1 T        function initArray(theArray, length, val)
6 e$ T; A0 l, g# X/ a4 X        {
) z4 `2 {* V& c3 d& [1 T0 ^) g: E                for(i=0;i<length;i++)
' d7 m8 i. L3 g: w/ A                {
7 B- L8 y$ s- S                        theArray = val;" Z$ q9 a- C5 d! v# d" a
                }: B! b" @$ {5 `) a# s
        }& j: M4 u' w/ j2 K4 ?
        bgR = '0000' + fadeOutColour.substring(1,3)" m( m) D' h2 u8 V- ^0 ^' T
        bgG = '0000' + fadeOutColour.substring(3,5)
( u4 w$ a+ O  R, b        bgB = '0000' + fadeOutColour.substring(5,7)
/ W/ s, g2 @: V& T( z2 o. K1 C/ O        currR = new Array(numLinks);8 ?0 Q4 }0 z; M  {
        currG = new Array(numLinks);% E0 j- T8 }  e# x
        currB = new Array(numLinks);
/ U3 {: Z4 y5 R        count = new Array(numLinks);: {7 n' M! V! z" h0 z' L) `
        fadeOut = new Array(numLinks);
# W6 t1 D; M: s" o0 S' W        continuous = new Array(numLinks);8 t1 I2 p3 a" M
        newColour = new Array(numLinks);
2 i3 D3 k# V: \6 K* ?        tID = new Array(numLinks);& y% R4 N/ L* j: I  E: K
        redInterval = toDecimal(bgR) / numFadeLevels;4 s6 J+ v7 Y( ]
        greenInterval = toDecimal(bgG) / numFadeLevels;1 T0 y  ^5 Q/ a
        blueInterval = toDecimal(bgB) / numFadeLevels;
7 R1 ?% v2 A5 {# v$ e: L* r        initArray(currR,numLinks,0);
7 A/ }9 k* e4 m7 S2 Q# }: d( Q& F        initArray(currG,numLinks,0);& N9 @( z( p* @; S: E
        initArray(currB,numLinks,0);
6 e/ Z1 X  p2 u  A. g) _        initArray(count,numLinks,0);
$ Z" N' U' K0 ]        initArray(fadeOut,numLinks,true);, {+ I1 Z5 D0 U4 c8 l+ X
        initArray(continuous,numLinks,true);
, Y" z" u' A2 x! x5 w& z. m}       
6 s2 b# C( W7 y! H8 G: J0 jfunction startFade(id)
2 r3 A9 D& z" L+ t& [: y1 E{
$ a; e  ?6 B7 Q" C+ Y! K% m4 G        if(fadeOut[id] == true)7 R$ R9 w9 K. z6 m
        { /*move colour towards background colour (increment)*/3 W) |! P6 m- M8 n# j
                currR[id] += redInterval;
8 o9 P/ e, @; t( U& S                currG[id] += greenInterval;
8 g! {5 p1 r% t. \; ^                currB[id] += blueInterval;9 H& b2 Q5 _, [7 \" R
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);% O% @" }1 P. b1 k9 }' r; A
                if(++count[id] == numFadeLevels)& P1 Y, @- t3 `0 _6 x4 j" r/ ^
                {# r/ Y7 I! `, q$ w  |
                        fadeOut[id] = false;% J4 O0 s: k7 A0 c- h$ N# w1 e
                }3 U" g/ N" }5 \& t$ {7 F* K9 ?
        }
& H, U3 g' r' S. f, \) t        else
0 j! m. j9 m5 l& k2 H        {
0 R# d9 H: V. R& s; I0 O                currR[id] -= redInterval;! t9 |9 H3 R8 n

2 ^$ M3 G0 o; C4 d$ x                currG[id] -= greenInterval;% H8 t8 z- K4 V
2 ]: U) d. P! @, ?! w. ?
                currB[id] -= blueInterval;% X3 v( P$ F1 _5 J

4 H6 k0 H0 P5 J' j                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);9 f4 z5 C3 P6 U" r/ e% M2 {' _5 ?
) \9 P3 e# ]4 c* I5 e$ H& m
                if(--count[id] == 0)
; o8 F* m6 n8 N. n) {7 r( |+ t( y3 q6 F3 A3 L/ c4 d, U
                {
( p  t- x$ k# m9 U" ?% u- g+ \
& `* R# N3 a' r( u4 s                        fadeOut[id] = true;
) D! F  g1 e3 o! r" t2 d5 G# o) B* f& u3 ?; Q' w. }
                }
* u' b/ K% S3 Y1 m/ E/ O: z2 r
$ p# I9 n5 b, S        }* i' O* I) Q7 [' n

! V5 H* M! U0 [+ n4 u        if(continuous[id] == true)* a3 Q  [! P* e, P% w& _0 x

8 t7 V; }- x9 @; Q  T% P+ ], {        {; E7 f/ ^+ @1 E0 X
, W2 k5 N5 F5 t9 [
                document.getElementById(id).style.color = newColour[id];                , ?, L  l8 d' ]4 S/ @

: W2 W; \& P  A5 n" ~7 s# }        }
" ?( G: p9 i% P1 g( f
6 n! Q& }# J( z% `' g8 [, z        else% o& W6 n1 F) I. i: I1 T$ @$ Y

0 s! M3 V/ N* j4 [; v+ v        {5 t. S/ V, K8 T7 b) k# p
$ q- w. s4 C2 F$ Q- `! e
                document.getElementById(id).style.color = hoverColour;
7 Z  r. {% W  C- P1 W" }" @+ w5 M$ `! i9 n% P
        }
: T- ?6 Y& d/ t2 }; l. a7 N1 `* W. E& ^$ V+ w8 w1 }, t" {8 U
        clearTimeout(tID[id]);( Z) D/ G2 d! F# L" e
$ K( x8 Y7 u+ u3 a% c
        tID[id]=setTimeout('startFade(' + id + ')', rate);
) R7 W& o2 g% m7 l) \( z+ N; V8 K, e0 I( G: Z7 D7 i
}* `! g/ A& l3 o# b2 T
5 j& v4 v3 U7 y4 O9 t$ ]  r* Q
function continueFade(id)
' E& \; r  c( N7 n
* Z% ~. r+ C1 X! Y! z{9 G# P% w/ x8 N2 J; l3 e! ]

- @, t/ d4 |  J* y% k9 D% H- z8 d4 A        continuous[id] = true;0 ?! o! u7 u& e- Y+ @8 |

7 W3 V, {' p: O, p# o1 f/ \3 _/ j  Z' R. s}/ b1 m. {- ~: |; ]( {

9 w. ^4 x5 m2 X3 V( D$ v$ afunction stopFade(id)
4 k: Q6 D% _) [# _$ c1 _+ K
4 V$ Q$ m' w* r$ x' j8 G{7 }+ Y( g/ L) ]. f
- T6 n& ?0 K, v0 L" S
        continuous[id] = false;& h2 w) K- f8 I  u9 W, Q
' x9 I& j/ f7 ?* o6 E& \2 o
}
1 f7 ]7 L8 p! _0 N$ H1 ?/ `+ c" B- z3 |; E  |
function StartTimers()
2 T) u% M) m# r  e% l
8 U1 {: l- q' K{        //set up an initial set of timers to start the shimmering effect
% g+ ~6 M4 Z. W* p1 H& ?2 n! K. C( c! M
        for(id=0; id<numLinks; id++)
$ J3 C: _* r- s/ f
7 m" x1 p3 H0 [$ Q) h& w        {7 p# u, M$ `+ n, f% k# Y

  l$ u2 }# j/ t3 a% m7 |. _5 A                t=setTimeout('startFade(' + id + ')', id*100);
/ Q# y! J) N5 E7 f/ K
0 S, M$ i* |* [        }
2 S7 m9 i& @" U- A- D4 Z8 G9 K, h, ?4 L1 d( }) V( P- H
}
6 \7 P) m8 p, ?$ E- ?& F/ q
2 L. U# _; M/ f' e5 `: J. m//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')$ g& w0 m5 a) {, X3 Y, `

) V4 e  r, ~2 IinitLinks('#FF0000', 6, '#FFCC77');. `  ]' P7 j! C% N3 S' v

$ T( w9 z( ?2 N. o; [. L//-->
/ d. k$ D3 M& d1 q, c7 C" Q
) x& \  L$ r1 b* @0 f+ _</script>! X4 P" \- G  F- c3 b8 x8 D0 O; P
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元
6 c0 ^, O  K6 M9 C</a>
3 J* w) _2 i- e" o<br>
) x: e+ n  d; o3 Z* k<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>
. y+ h4 d+ L3 I9 s<br>
( c0 U& S/ H. v6 ^  d- Y( A3 Y<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>5 z% \! k5 B; Y& y; Q8 t
<br>        9 U0 p  K2 f9 s& O
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>7 H1 }2 e2 ~% {+ U7 O
<br>: O' q, P8 h0 |8 \
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>% T' N# s) ^' Q; c5 H
<br>+ L0 X- e  }- K- a: I& @7 {
<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>! P5 R2 b8 g- k5 r; c
<script language="javascript" type="text/javascript">( J9 e# U& H1 V" [, ~4 a
<!--2 E: p/ v! M' y8 y
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering( i% d" T5 ?/ `6 ^+ q* l
//-->
2 r) {# \: Q3 J8 u</script>