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

zw2004

<script language="javascript" type="text/javascript">
) u! k7 s% u4 Q# }5 A4 u- _<!--
  R+ z% G( i1 `$ \( @# J* N  Y// convert a single digit (0 - 16) into hex
1 ?5 a& y. w% x; F; d- i( ufunction enHex(aDigit)7 L  R) B* ^% y! B' f
{
- x7 L' W3 D  e, Z# W+ s# f    return("0123456789ABCDEF".substring(aDigit, aDigit+1))6 n3 S9 D; y$ i/ x
}
0 W2 U7 F: [2 |/ l. D// convert a hex digit into decimal
9 S+ E* H- l% Afunction deHex(aDigit)
: W) G% J( G  y. z{& R( L/ Q( _3 O" a" Y; M' I! W' X) O
    return("0123456789ABCDEF".indexOf(aDigit))
2 a# M4 }% [9 K, O3 r}
5 X6 Q9 k2 N9 ]4 ]( i- z+ p4 c( u" |' j# Z0 j% E' i/ ~
// Convert a 24bit number to hex8 A9 t  d8 n3 ^" o- u' T. t
function toHex(n)
9 q( h1 ~& ]2 n) m+ D{8 T" R! W0 G/ _( q. {; E# f
    return (enHex((0xf00000 & n) >> 20) +# m* p/ E4 c' B( o! t0 S
            enHex((0x0f0000 & n) >> 16) +! L4 k0 y  v6 D; _1 t
            enHex((0x00f000 & n) >> 12) +) `% T1 K  s+ {
            enHex((0x000f00 & n) >>  8) +
* i, d2 c- y' }# W+ v            enHex((0x0000f0 & n) >>  4) +
$ _& y, T7 C9 d( k" i% E: O" X            enHex((0x00000f & n) >>  0))! R- E0 ]6 n0 O
}) N, l: x) i0 C  ^* _0 m
// Convert a six character hex to decimal
$ s6 P+ ]  d' c0 ]function toDecimal(hexNum)
! i  M  y: \. Q% b/ }0 f{
4 N1 J" z7 \: h! i; d( ^0 B           var tmp = ""+hexNum.toUpperCase()
. f8 m0 W# u% Y; P8 S! F8 \  h: b    while (tmp.length < 6) tmp = "0"+tmp$ W" t0 U: c5 i& \
           return ((deHex(tmp.substring(0,1)) << 20) +# _# o" G0 E% k( W" H  a6 B  g
                   (deHex(tmp.substring(1,2)) << 16) +
' q" f# u; P! O( K& C            (deHex(tmp.substring(2,3)) << 12) +% k4 @/ M( {$ ?4 l5 S" s/ Z0 {
            (deHex(tmp.substring(3,4)) << 8) +
- F8 l) V( b3 @8 w+ U" {9 e            (deHex(tmp.substring(4,5)) << 4) +
  `( F5 f; q# b4 j, H0 F6 B  Z. `  s                   (deHex(tmp.substring(5,6))))
0 {4 \; a' s1 z( l. e" w& [}+ x4 t4 C( j# r3 n9 ~& ^' l' k! j* S
///////////////////Shimmering Links/////////////////////' Q3 J8 I9 t+ c% o3 l2 V+ g
//global variables7 v. C6 b% f; @2 X
var hoverColour3 p- E: y% o- N% k# }
var numLinks;" D: |7 P' t+ ]0 ^
var rate;4 Q/ C7 G( M, _3 Y8 L
var numFadeLevels;
* I/ G) c" ^# R# E) X; wvar bgR;! x1 j6 R/ \) r# m6 |& j, }9 c8 A
var bgG;
" T8 i. V' W) W- Ovar bgB;* @) T; k1 ]! w9 K4 O6 I# X1 f4 r! w
var currR;, ]& a" J  n" m
var currG;
$ C; y  r6 b5 qvar currB;5 V  h% d0 X3 D" d' X( Y9 x
var count;# K, g+ F( O4 f" g
var fadeOut;% H' I  b( l9 `# S5 h
var continuous;
: M* F' f$ }+ r# Lvar newColour;
" a  u+ i! s' ^& n( q6 gvar tID;6 P) d! n  H* {- M2 W
var redInterval;
$ ~5 i6 v( ]9 s. k, L& }var greenInterval;% u# X6 a3 [8 w( _5 {. W1 t
var blueInterval;
- v5 w8 R1 ~) ?; G6 J1 R1 c5 xfunction initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
: n5 ]1 d; M- E{7 w& h6 g7 z! E! H$ O
        hoverColour = mouseOverColour;; z: K  ^: A9 z: F0 d
        numLinks = numberOfLinks;
' r5 x) c) ~1 W& g/ Y% z        rate = 1;
* h# ~; V! `3 n' z! j        numFadeLevels = 30;/ F; M" d5 h; C1 V( r' K4 Y% ?6 {0 L
        function initArray(theArray, length, val)
; t( W; F( u7 `2 Y        {, u4 y/ c5 f2 S- m- \6 I
                for(i=0;i<length;i++)
3 G% \; A+ l# v( ~' X                {
& U+ ~8 y- K! C% t) O6 _5 W! h                        theArray = val;# C0 @- d1 w" w4 [
                }: h, |" ~" Z0 z1 }- L* N
        }
& J( `% F1 A6 F! j* V        bgR = '0000' + fadeOutColour.substring(1,3)
; G, I" V2 ~( L" g$ F2 A        bgG = '0000' + fadeOutColour.substring(3,5), }" ]& N$ P# Q, m$ u! q
        bgB = '0000' + fadeOutColour.substring(5,7)4 w$ g$ w4 h8 p1 S
        currR = new Array(numLinks);
" v* N1 \( R1 P8 Q$ G        currG = new Array(numLinks);
! T9 w. C3 s, P6 a3 b& [        currB = new Array(numLinks);* {/ [1 h0 D- l
        count = new Array(numLinks);* _# n" T4 G$ b* q' Y. G  o1 {& Y% g
        fadeOut = new Array(numLinks);1 i' P3 O7 v9 z% E
        continuous = new Array(numLinks);" X& W, ~) b+ M- n. S
        newColour = new Array(numLinks);  }' G, y' R3 Q- q& `1 m3 m
        tID = new Array(numLinks);
0 G( n, ]9 i  E5 F7 y9 W4 E: S9 D        redInterval = toDecimal(bgR) / numFadeLevels;
# a9 ?, z7 }$ c* ~        greenInterval = toDecimal(bgG) / numFadeLevels;
3 V: }+ n$ i3 k7 t8 L1 V5 N        blueInterval = toDecimal(bgB) / numFadeLevels;
$ A9 I, Y) x. ]! ~1 t5 Y( F        initArray(currR,numLinks,0);
; }% M/ P( E$ y" m  S6 G9 {0 e        initArray(currG,numLinks,0);
3 z& n9 m4 I7 C+ z6 }        initArray(currB,numLinks,0);  I. C! o8 Y( U  \9 e: ^
        initArray(count,numLinks,0);# w/ Q) ^" J4 l$ P# P- r  @
        initArray(fadeOut,numLinks,true);
1 t- K' \! q" o! P4 a! f* @        initArray(continuous,numLinks,true);8 e7 v5 ^9 f5 R; c
}       
# P- E2 V& K/ q% P" d" jfunction startFade(id)1 Y" B0 U$ C, h& l* t8 z) {4 F
{
- e, ?+ Y. T; Z' h4 Q        if(fadeOut[id] == true)
6 p9 `1 e3 j( k        { /*move colour towards background colour (increment)*/
3 I* T; \6 a6 F                currR[id] += redInterval;
6 B9 G* o# V, p, q0 m3 N                currG[id] += greenInterval;: z: c7 J- j. y" e- z4 l
                currB[id] += blueInterval;: ^- i8 G: q! p$ T) W2 X$ P
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);9 l" B& M  [0 s' X9 p7 P* [% A
                if(++count[id] == numFadeLevels)8 L- O& D2 z$ r" `) i* P0 U
                {' q2 Z; Y( p9 Z2 ^) ]0 c
                        fadeOut[id] = false;5 v! u- M6 ^4 F  k$ `
                }  h* o/ M3 ~  R8 o: U1 ?
        }
2 X+ P  o$ G3 S" K* T        else
2 p& c' K( |2 k, P; T) T4 z5 M        {
% K: x5 \4 f! ^, [7 l1 V                currR[id] -= redInterval;
& ]$ H' Y1 M8 _2 F% w; R* O6 r2 z* F( v; O2 [
                currG[id] -= greenInterval;/ J3 a1 D6 N2 Y% @2 B: M+ ~6 o
/ T# J" C0 I- A
                currB[id] -= blueInterval;% p, h2 Q! x. e6 @+ v

3 {$ `4 I: b( |                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);3 I; ~. q% D6 T5 [5 D
3 a& u) q4 d: J
                if(--count[id] == 0)
2 Q: h: ]4 D/ b5 Q, ^- n; D0 R1 R9 V& w, \
                {' g0 t: M! j+ ]8 N- h! e. Z
; Z1 l5 ?2 I8 X; W
                        fadeOut[id] = true;
' J$ I7 m3 \. V/ N8 L; E+ g  r1 v3 L' c; K: Q& _9 a& ]+ K
                }
+ q. o" g# r8 D2 X% l2 {, |" N* Y* I" F) L
        }3 d; U0 @/ ]5 @  \- P$ U

- v5 H) [* B( t; f        if(continuous[id] == true)
  A3 `( W5 t! k9 ^5 ?, W/ i
5 I3 k, G2 c$ y/ _        {
7 u( Q2 Z9 b; z5 s' t! T- i9 \8 N; g3 z5 r4 D2 x. Z
                document.getElementById(id).style.color = newColour[id];               
3 [7 K* f) ]9 X- y
# y* J8 J, D8 L: \0 k! v        }- w' W% y5 r& x# x7 U+ m

, Z: o' ?: D& D& v  N: @8 z; J" A1 j        else0 l* {* v" N7 t4 |- H1 v! E) g% [

, l+ ~, n, R9 i# q7 y        {) r, a5 {( w- i4 s& }* m

% X( v9 z; R- b; X* \                document.getElementById(id).style.color = hoverColour;) O8 h- U* @2 f9 S- w" X+ t
8 G. m4 x4 r9 X8 a2 ~, n4 ^
        }
, m/ I+ z+ l" o1 ]2 S
3 }  I3 J, B; p0 n( n        clearTimeout(tID[id]);2 \5 @7 b. ~& S' M

( a) C+ K+ i/ i& c        tID[id]=setTimeout('startFade(' + id + ')', rate);" o) T6 P* O0 Z8 u, y4 k
( g7 n  v0 P3 X
}/ O' P1 [2 s4 h. Q% X
9 C/ L0 [9 H: M- h' R# w
function continueFade(id)/ m& ]" `$ z$ ^1 e
4 i& Q. ^) m* R; G2 f( R/ H
{' V  f- l6 e" Z4 W6 m& e% D

' ]# J+ M( ~7 E% z5 x2 F        continuous[id] = true;- p1 G2 b6 P# P2 m
* r1 N7 s) R1 j) f, C3 }# b
}  E  j# n! _% |  |
! P5 V! F# E" {: A
function stopFade(id)4 j* W- c! c  ^" n- Q0 s6 W
- I5 j, R( r. ]! j/ ^  ?
{
/ \4 e  v5 a7 c: @) T2 N3 Z* v% Q$ Z0 |$ `/ H
        continuous[id] = false;
  Z' {. \' Y$ ~# k3 ]- _. c. N
: z! x2 v  E3 W& ?" N$ d0 W}7 d6 O: l) U# @$ x
% b- B: E* ]% N$ A1 C' g
function StartTimers()" F6 {7 ^2 C' U3 a, f: b# x

7 q" }2 V& C# B& E{        //set up an initial set of timers to start the shimmering effect6 W- }% X) t5 l

: R" U8 U1 ?% D0 B; {3 ]        for(id=0; id<numLinks; id++)- f. J" }- n4 \0 o

: G- O* o: p) g, n: E1 @0 X, H        {
2 P5 z6 a( T, B) F( X; T; \; ~8 Y
9 \$ r& x' H* k' u                t=setTimeout('startFade(' + id + ')', id*100);) A2 B3 V$ `/ `0 u( ~% g5 H8 J9 k9 e
, j' u) X& W- |% P
        }
; x9 }0 k  ^* J) p, p; t% \1 `8 G) A
}
* b# P; N( \0 s! M3 p& J* n$ x+ ~' I5 _0 L: F
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
4 e) f9 k+ h" [- I8 d  Z3 g8 x  V
  [4 n1 z, Y3 L! S2 rinitLinks('#FF0000', 6, '#FFCC77');
1 @/ |' d' b# t$ ]7 C# H4 P+ o; \3 S! a. [# }! ]
//-->
( r% V# h5 B) C' ?5 Z" w% _, u3 E/ w# d! @
</script>1 ?/ E, b& F8 H5 Z$ E8 w3 d9 L2 r9 P
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元2 d# L) F5 @+ h0 B4 u+ H- F
</a>
' |% i! z/ T8 \7 c  ?7 D% L<br>' y/ w5 D8 K6 ^/ _1 W4 P, J
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>
2 \8 M% U6 m! Z# P; i<br>5 x2 R# j) ^; [$ y# x$ m) @. v
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
* }3 H4 Z% O$ T<br>        0 e. J) f) `" {
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
& E$ R. t& h2 V- E6 z( {4 @- j. L<br>
- Z; I3 j* D* m0 ?  \% c- \<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
. Q3 E5 X, G* l, X) r3 }<br>
8 u( T/ c" r! h: t<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>
2 L! I1 N, {( o1 v5 v1 a( q<script language="javascript" type="text/javascript">9 V% ]6 z% X3 n8 F, C2 k* M7 Y* v
<!--
9 U7 \9 b" x, Z) n* nsetTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering, G" X2 a( |7 r- M# ]/ b
//-->
7 _. X% R/ M" Y6 h: V2 L8 k$ k  Z</script>