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

zw2004

<script language="javascript" type="text/javascript">
) m' p: E: L  W( _<!--
) Q. v( b! q' u$ i// convert a single digit (0 - 16) into hex
# [4 d7 ]0 u3 G9 ffunction enHex(aDigit)3 x& y6 u2 F. ^9 P1 P3 y
{* s" s8 x: R% ?3 x& o
    return("0123456789ABCDEF".substring(aDigit, aDigit+1))
/ y; W: |" J( X: v8 M5 @* x8 C}8 Y7 H: F' a( w! d1 q  s+ I: ]# U
// convert a hex digit into decimal0 Y$ y+ j2 ~1 u% p' r) @- i5 ~
function deHex(aDigit)+ j$ o4 r! t9 p, j$ Z
{6 w! F: y9 Y4 S! |$ P% y
    return("0123456789ABCDEF".indexOf(aDigit))& O* W* G7 k7 h! n( ?3 W, [1 D- E
}
% e7 D2 J, T6 [# b- P7 K5 `" v5 G) V; W, s* W2 u8 \
// Convert a 24bit number to hex
% `2 Y- ]; y+ A3 Z/ ~9 ?( }function toHex(n)
% l, [6 c7 n$ e2 U" H4 Y{
) B  {; }7 V& K" _2 G  W: t    return (enHex((0xf00000 & n) >> 20) +  i  S5 `3 G8 o) x. v
            enHex((0x0f0000 & n) >> 16) +# A4 \) i* p. i- T2 u; q' f' C
            enHex((0x00f000 & n) >> 12) +5 h9 U0 @% t, h5 i# s
            enHex((0x000f00 & n) >>  8) +
1 Z/ J7 \9 f0 T! s8 }3 Q1 i            enHex((0x0000f0 & n) >>  4) +
0 L: X9 |5 E+ x! Z: ?9 u            enHex((0x00000f & n) >>  0))
" A, r8 v! t. \}, G; k' `2 c4 ?/ a5 c" `2 T% l( i1 S
// Convert a six character hex to decimal
# h2 O( c/ y  B$ jfunction toDecimal(hexNum)
6 `* m) C6 V1 t* Z$ e, T) }6 L  |{
9 s' @& H1 u9 S: H" ^) T; @- c           var tmp = ""+hexNum.toUpperCase()
: T: ^. f+ S  l+ P# |# o+ U. x    while (tmp.length < 6) tmp = "0"+tmp
3 ^( V  f) {4 k9 \/ B! }$ H3 ^6 x           return ((deHex(tmp.substring(0,1)) << 20) +
3 p% D3 m2 [3 Z8 y: F7 L                   (deHex(tmp.substring(1,2)) << 16) +
* C& [; ?7 G2 k7 L            (deHex(tmp.substring(2,3)) << 12) +7 n. v$ x$ H& T* M1 e
            (deHex(tmp.substring(3,4)) << 8) ++ q- E7 T/ |2 f7 d
            (deHex(tmp.substring(4,5)) << 4) +& C. ?2 P2 V$ S. `% d
                   (deHex(tmp.substring(5,6))))7 M! z" S- r% i$ }6 ~+ U7 P; h
}  i% B7 u. V. s0 l
///////////////////Shimmering Links/////////////////////
) t- @# Z/ E. U! d0 Y8 E3 Y0 o//global variables
5 t4 Q% T7 F" [+ b3 ~var hoverColour  R# G9 u+ g9 Z: f
var numLinks;1 j" Z6 T+ j# ~9 u
var rate;1 i' L3 h1 i( m7 M/ Y: j9 M
var numFadeLevels;& x/ b! Z. ~6 ^
var bgR;0 Q1 F  q5 Z' }& N& j7 r+ D
var bgG;
9 Y+ l4 L# P& G  m1 P9 h8 |var bgB;+ \$ M6 U) W& L  Q2 L* ?9 E5 |
var currR;
' ~) O0 D) L4 G% \% Pvar currG;  o: \! p9 J5 y0 {8 G$ M8 g
var currB;1 m" W7 m0 A  u0 B; I$ l5 T6 `
var count;% w/ q. [- D# l
var fadeOut;
. c/ _7 j7 ]/ r( lvar continuous;: |1 B/ B2 L& |5 M8 A$ J6 X$ B3 T
var newColour;7 k0 H- x  t5 c, W1 R
var tID;
2 t7 a5 y) ~& N3 P( t" J1 g. jvar redInterval;
8 ]2 d; U3 b; {var greenInterval;
; w- f3 a- G. I% Z- D8 @: b. Nvar blueInterval;6 T. S: {2 ^# [/ I" B, ?) [
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)) x$ j9 L. x5 m. F( t( p& W
{4 t) {0 C' S+ r
        hoverColour = mouseOverColour;) m  |/ R6 K' l' c! n5 i/ ?0 }' F+ s" I
        numLinks = numberOfLinks;) k# F: B( D3 x
        rate = 1;1 ?* q3 ?) y7 r" O- G
        numFadeLevels = 30;) a/ Z' @& U! M2 T' ~, P, ^  T7 ^
        function initArray(theArray, length, val)' g  S2 I) K- w5 T& ]
        {
3 `3 b0 Q5 Z3 ^. b7 c                for(i=0;i<length;i++)
( y2 E3 [5 h+ Q) K7 X7 y                {) z  n. G7 Z+ b) X+ i' [4 ~# R
                        theArray = val;
# E1 n+ X, E1 ?% l6 L, J                }
6 x. H0 q' Y, [: ^1 Q: u        }
8 u' m. Y3 E. k: _( w        bgR = '0000' + fadeOutColour.substring(1,3)  [9 M9 E% E2 }  L1 p
        bgG = '0000' + fadeOutColour.substring(3,5)
; V, Y  i+ e$ ~+ {9 z        bgB = '0000' + fadeOutColour.substring(5,7)
4 V2 D, T% ^( b5 h: ]        currR = new Array(numLinks);3 E0 f( L9 K0 P1 \0 A+ r
        currG = new Array(numLinks);
+ P! R+ w  D; A7 q/ i        currB = new Array(numLinks);
  Q; ?, C$ e3 s; T' s3 X8 x        count = new Array(numLinks);
7 T! V/ f& z2 [& L  [- S; @  \        fadeOut = new Array(numLinks);$ w2 e/ [( }& k* L
        continuous = new Array(numLinks);5 o: O( b6 b6 V# p4 ?; [3 w: B
        newColour = new Array(numLinks);% Z" _% h& C) q9 d1 l% b/ J# }
        tID = new Array(numLinks);
2 V8 o; v; k1 V4 @" d  L7 g0 _        redInterval = toDecimal(bgR) / numFadeLevels;6 _7 _0 E. A- P
        greenInterval = toDecimal(bgG) / numFadeLevels;$ k2 l! J( w# C# r; F: {
        blueInterval = toDecimal(bgB) / numFadeLevels;
( |8 j* t3 u5 H$ z1 M$ w8 }        initArray(currR,numLinks,0);
- C4 a, H$ l. ?4 Z  E) u        initArray(currG,numLinks,0);# J" L: b" f9 H
        initArray(currB,numLinks,0);
+ J' t0 _) }& Z  ^5 q! j* c) Z        initArray(count,numLinks,0);
; n) q6 }$ L+ c9 P. ]        initArray(fadeOut,numLinks,true);
- v4 @! l& \$ q        initArray(continuous,numLinks,true);
1 Q# |. g: v0 v$ S3 O}       
( b! f2 O7 B4 f1 `% N0 w0 Dfunction startFade(id)
# `( s- a+ i9 F/ }1 U9 l: j{
+ e/ B6 g8 w' Q8 F3 u        if(fadeOut[id] == true)! ~0 y3 A3 o, J* v# c( }
        { /*move colour towards background colour (increment)*/
2 m2 O. w  F$ H4 D. M) e3 N: L                currR[id] += redInterval;, l$ O4 s* v% c
                currG[id] += greenInterval;% r: f3 Q1 c. N: a( G
                currB[id] += blueInterval;$ v. o4 K9 m( g' [1 V
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);/ _% A7 U$ ]. g8 O, t
                if(++count[id] == numFadeLevels)4 G8 V: S8 q5 l& Z9 t
                {
9 q7 |7 T- s* k& w                        fadeOut[id] = false;! [" A( e. X. l- {3 L% H
                }
; e) J" `8 a% `4 M2 ?6 z) [        }
% N4 }( ^6 Y* A3 g# f6 V8 w        else5 X9 g7 l5 y! S" k. n' R1 H, {
        {! e7 f+ N3 Z* q- O7 C; }, [" `+ f
                currR[id] -= redInterval;- V  [, A8 A- D+ S0 O+ y
% A0 t' Z/ A5 n! a0 `( `
                currG[id] -= greenInterval;
; D. a' Q- e. N/ @5 Q
! y" h5 V$ e- S; P+ V                currB[id] -= blueInterval;. n3 n" _% x0 d  j! N) V+ C  Q
% R) N3 ^& _, }7 f
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
1 V% N& @4 m  i" b1 @
) B1 V- [1 ?1 d5 D1 g- e                if(--count[id] == 0)# a/ j. q$ f6 M! z7 u" I& N
2 o' P4 Z) }* g$ z& M) d: d% J4 H
                {
7 V, \  F) Q& ~" i3 ~
8 \1 Y$ f% s1 I3 u+ V& R$ X. L                        fadeOut[id] = true;
" j5 ?; ~) b0 p, G+ ^! h! I7 p
; w! q) G* V; N8 {                }- m. c! q, e8 @/ p5 x  b2 V

: J% n) S/ b/ f- N& y        }/ B- R- E- q% v" o3 a/ m& b

- H" E. o: s# r7 s7 _8 l  [+ n0 d! |        if(continuous[id] == true)
3 K1 L9 R; v1 l8 I
/ n' N$ O" D9 X7 H8 _4 p3 M* u        {, [( z7 a& h( k3 ^) n

5 f+ F1 H+ h. g- [1 f8 W                document.getElementById(id).style.color = newColour[id];                ) \/ y8 K( m4 s

2 c8 n. N8 Z' Z  j% t, N        }
* t  ]$ r6 ^. W8 s6 Y5 O( E
* e3 I+ I8 M9 s3 `        else4 @7 L- W0 R- C# s+ @. l3 H2 S" R

5 a6 ?, T5 y& O2 i9 V: E8 M, d        {
( i, g  O: k% |- H$ u* z7 v9 Q1 ]2 q! Z0 Y. y
                document.getElementById(id).style.color = hoverColour;
5 Q& U! i- v; D' b, H. j
3 g7 o% r: ~5 |& G        }! @1 ?; t2 M4 }1 m: D
+ n% t8 Z4 n+ V: Q6 m' r
        clearTimeout(tID[id]);
0 O, r, x  E; f8 F3 Z, C
* Y- ?+ u5 q9 s0 O( x        tID[id]=setTimeout('startFade(' + id + ')', rate);
# K( S. G" r0 M  N) f
# h$ U" }) Z7 }) \! L0 K1 b}
4 L) \. C( i# S' g! b  F
& e4 }$ J+ f( x5 U- L' l, `function continueFade(id)8 R0 S( a3 I; r9 K" r! m+ Z
' B" j) p' u) Y5 N2 s: C# x/ h
{; r* \9 D- |( z3 v

3 q, @3 X4 n  z/ U1 Z+ U$ i        continuous[id] = true;. U8 E! S* M. q/ s0 O4 k6 L$ I
& T3 h! k9 |$ o7 u4 J: Z) X
}
8 M, ]: p; D4 I' z& K0 \5 o
: N) o$ n' q+ E* N: @4 ufunction stopFade(id)
7 `7 Q9 y( l. }# b6 [: C! o4 E& n( \# I6 O
{
& c  v" A1 c" Z/ q3 a2 R& I" J
; U. {& i' [$ O9 Q: a        continuous[id] = false;
' e, E+ j1 O3 r6 r. E0 d' ]! l
, X' b1 ]  B* ^5 b- m2 @- G$ m! |}2 k  P6 N, l: ^- K. h; n- j

* L5 t( U, @" J" P/ ffunction StartTimers()9 j% w; C+ A9 k6 f
+ `0 O! C+ y1 k' ]) m
{        //set up an initial set of timers to start the shimmering effect; g2 @& @2 \# P, \
" g2 ]+ f2 u* }( u" u
        for(id=0; id<numLinks; id++)/ g* D; O1 C. F+ Y" d8 F9 Q: P0 J
! v0 K! ~' E' K) q* h" d  Q- w8 e
        {
8 f$ \( ^' a" n! B# g$ o; Q' D7 Z; @0 b) m7 i2 \/ Q
                t=setTimeout('startFade(' + id + ')', id*100);
' o, g. t) F# f- S# L) p8 V0 H8 m3 f1 E
        }% }! c/ e7 S7 L; `
: C; j1 T4 P$ p/ k3 g0 \  @& c
}
3 }! [5 y3 h8 n! c; _0 m9 \# V( R6 O+ W. l: a
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')  i: Z- o# N9 L( N% _/ _0 c9 n0 U" S
. R  Z5 x& d( C! Q" L# y. r7 F# j
initLinks('#FF0000', 6, '#FFCC77');, m; m4 s: R; C

- T! Y  W2 x" k9 z+ [; w4 O) G//-->
& O9 E& g) M3 Z1 r( a2 K6 ?# B/ y# r# F/ U
</script>- D2 K0 j9 h& |) m, ?0 |
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元
, j& t& @% @* i</a>( j- ~( B& @5 g( d
<br>) W& ^2 ^: W& _9 a0 T% X
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>
* O! }6 n5 }4 s3 I<br>
4 t* w) P. W2 V3 O2 r6 {3 [<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
& p$ N8 l8 I% X1 p<br>        + ^* y- I- [' D! U/ l! n. y/ |' `/ L
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
4 {3 q: L" B/ \<br>
5 X( n/ b% W; J. C- J$ t* w<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>, i- a$ g" t9 Q, K! b: n
<br>: m2 b. [' I- ?& w# X
<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>, h  N  ]# N4 p1 h+ J6 t3 {8 F$ k
<script language="javascript" type="text/javascript">/ B# S; K3 |. d+ k5 K( w. p
<!--
& k# v: d# Q3 R( Y6 ssetTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering' K; N1 F7 N& g# ~  a" g0 X# I
//-->/ q9 P. S2 N' T9 [7 O, _3 m/ @! b
</script>