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

zw2004

<script language="javascript" type="text/javascript">
* i  _+ y3 R1 G<!--1 F2 c8 d6 L( s1 S( I& Y. i
// convert a single digit (0 - 16) into hex8 L' c; ]) }/ V
function enHex(aDigit)6 C; ?# q, M/ T6 N
{
9 v* ^/ s6 [( p* A: e4 n8 h    return("0123456789ABCDEF".substring(aDigit, aDigit+1))
( w8 t' u( B% P& R3 b}
$ z8 ?  L' ^# [// convert a hex digit into decimal
* [; K8 s1 F- O* o- yfunction deHex(aDigit)6 W+ G# [* _0 ^5 d' X; N
{2 v$ o+ O, W$ e' g8 l. {! {; Q7 a* A
    return("0123456789ABCDEF".indexOf(aDigit))
6 o; h" N0 O. U- y}. ]9 W  A+ T6 A+ \
# s. d0 L2 w' N7 m5 ?
// Convert a 24bit number to hex
" Q/ m6 P! N* R8 h& U0 tfunction toHex(n)3 h& G7 @* s) t" s
{
( {( [* y- @' J2 o6 A. N2 V$ Z: v- g    return (enHex((0xf00000 & n) >> 20) ++ L/ O! s  \. A1 [
            enHex((0x0f0000 & n) >> 16) +' V% d) f2 M$ w: q6 W* D" J
            enHex((0x00f000 & n) >> 12) +
9 x: v. G3 F, G( k            enHex((0x000f00 & n) >>  8) +2 K# R* ^% Q# O  u3 Q
            enHex((0x0000f0 & n) >>  4) +
+ V" E9 P9 ~3 Q% U% {/ V2 }            enHex((0x00000f & n) >>  0))
! \4 ?0 f- t$ e/ K( z1 d# }7 r}
4 v% O% I6 K, W4 w) N// Convert a six character hex to decimal
, }9 k. Z! y# l, O" ~function toDecimal(hexNum): @4 h! u; @3 f, g! i, z  l
{
! Z! q8 |! S7 m9 |           var tmp = ""+hexNum.toUpperCase(); a9 |1 |- d0 p/ n$ G" h
    while (tmp.length < 6) tmp = "0"+tmp
' N- g9 J& _, b           return ((deHex(tmp.substring(0,1)) << 20) +! ]1 r9 T% m9 ]1 \8 g, R
                   (deHex(tmp.substring(1,2)) << 16) + & {; {# O2 h; n0 m
            (deHex(tmp.substring(2,3)) << 12) +
4 x9 D1 o& |. e6 G9 E            (deHex(tmp.substring(3,4)) << 8) +. a7 L$ I) z* \* @3 D; N
            (deHex(tmp.substring(4,5)) << 4) +
/ L4 J# d: {6 P( Q4 W                   (deHex(tmp.substring(5,6))))
- k, G7 C% l$ f; a( w1 g, I}& }+ |$ M+ X# [0 R% g* P
///////////////////Shimmering Links/////////////////////* h0 `: C, @  W
//global variables8 Z: ]4 b( m' R3 ^% i8 J
var hoverColour
. |# y& u! ~4 q  P6 Zvar numLinks;
. {& e9 m3 q3 t% Q$ I- Vvar rate;3 S" w2 V- L3 a; Z/ _
var numFadeLevels;9 S5 c& Y5 l* J/ c9 O
var bgR;, U/ I( h) Z9 L4 z: w( O$ t
var bgG;0 g/ v5 v; x0 t& M5 `/ b
var bgB;$ c  X, l! z0 p1 h) m
var currR;# A# F3 m; A& P# m, B3 S+ R
var currG;6 f8 S7 p4 k' y) E) ]' }
var currB;
2 l4 l- ~1 X8 a! H" ]- rvar count;2 n0 P; X; {& u* n, H6 ?( J! ^
var fadeOut;& M9 V" s, R5 C3 [
var continuous;6 F0 i( c! ~$ t6 S5 ]
var newColour;
4 Z3 J, ?- l# v" d2 jvar tID;/ x+ P& \; C9 P) M0 G) Z% [
var redInterval;. J" [0 t5 q, h. a. E" ]; g
var greenInterval;
: ?* e. Z, s4 {& B" Svar blueInterval;, I! f  F) x# w$ Y: t7 e1 Q
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)6 W3 C. S+ P3 u- |% O
{
/ K' n5 L' K* P" u! W5 f$ a        hoverColour = mouseOverColour;
! `8 |! d" |" d7 f: m        numLinks = numberOfLinks;) ?9 `  A" N2 c
        rate = 1;3 M9 y/ \+ R& D( m: H9 ?0 h
        numFadeLevels = 30;) _, p" |0 N. c+ G* H; Q% `1 N5 P+ q
        function initArray(theArray, length, val)
7 n- ]; b0 g: e' V# I        {: W3 H7 o' q- f) N
                for(i=0;i<length;i++)
, w6 [; N& W" S7 X" O, v( H9 @                {# F  P* H5 b8 `4 \
                        theArray = val;
, R- e$ G# T0 f% L2 }! G                }
; \1 j" V+ Z- F3 P+ q        }
- m) N' s4 r% d/ T* f        bgR = '0000' + fadeOutColour.substring(1,3)
  I* Q3 z  g. L4 }        bgG = '0000' + fadeOutColour.substring(3,5)
. ?1 V) n8 b& _5 e" ?  c& x5 k! _        bgB = '0000' + fadeOutColour.substring(5,7)
$ L5 o3 y* g6 i7 g& e8 A        currR = new Array(numLinks);
# m4 N' R4 d$ x# X( r        currG = new Array(numLinks);1 |3 R- u9 O. t* K% {/ T1 F
        currB = new Array(numLinks);( d9 I/ T- q. k: x
        count = new Array(numLinks);8 X1 J* X7 N% Y& t, A" ^: m! F6 b
        fadeOut = new Array(numLinks);
& o! @$ \# ^. Q9 r. |4 ]        continuous = new Array(numLinks);9 J4 D& ]8 K, n1 D
        newColour = new Array(numLinks);
6 r0 Z0 b/ E' e# K- \! m- m        tID = new Array(numLinks);
0 u! P$ Q% x5 [. h3 u3 s        redInterval = toDecimal(bgR) / numFadeLevels;" `8 t8 W6 Q0 e7 s# \
        greenInterval = toDecimal(bgG) / numFadeLevels;
, z& z+ r2 g- Z3 B( W, @        blueInterval = toDecimal(bgB) / numFadeLevels;; w0 O* @( r# |4 b
        initArray(currR,numLinks,0);
4 Z5 j6 u$ a- u9 ~$ @* c$ H! @: U        initArray(currG,numLinks,0);, }9 k& S) s- P- Y. W3 E  S
        initArray(currB,numLinks,0);: {( ^7 q: Y$ i% b( X
        initArray(count,numLinks,0);
7 C2 [% A* c0 F. v$ Y0 i        initArray(fadeOut,numLinks,true);$ z! ~6 Y7 D! ?! f" {0 V) b( _
        initArray(continuous,numLinks,true);
5 b. y+ C5 A6 y! c}       
2 x- B% X1 H# S* O( mfunction startFade(id)
( J0 B2 _" P8 a5 i( a% ?9 \{
3 |% {, H2 c' _/ `4 H  R        if(fadeOut[id] == true)
9 `6 L& V, G7 w% ?( ~, N! j/ ]        { /*move colour towards background colour (increment)*/& i* k5 \; S' y+ `" M
                currR[id] += redInterval;: u" u6 Y+ q$ X3 C/ j
                currG[id] += greenInterval;7 \9 f4 `) ^2 [4 A5 p( [% i
                currB[id] += blueInterval;
; |0 A: H9 M! L$ _                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);/ u0 t% e' {; u7 Z3 E
                if(++count[id] == numFadeLevels)
8 N2 e3 O8 E+ H3 m! J& H0 w                {% n% h6 l3 q& A# I% X8 r5 h6 b
                        fadeOut[id] = false;
" I  e4 L, O; ?6 b                }7 P- j  B  R3 C" z5 S
        }
* N0 x- m' H% K  U& [, k0 E' P        else
- B# j# e( ?, a* K# L+ Y        {# V+ R4 b$ {' ]" X6 K
                currR[id] -= redInterval;
2 ^2 B- v/ g6 T" y2 w, M3 w" ?; X* X8 X* a0 {) F
                currG[id] -= greenInterval;
* t% z2 `- A: r8 i3 s( n, {  P; Z6 Q7 L4 H+ \! \: q( X$ k$ M
                currB[id] -= blueInterval;
  i4 M* ]" d" T! v4 `% b. k6 p
, D/ P& W7 D! T, T8 I                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);  T- i! i4 \0 o

* f6 M- v5 z' q9 U* p$ U+ g                if(--count[id] == 0)1 b, s0 L9 k+ P1 P

0 X& H& R0 B( p, k+ r                {5 N% B" j# u7 z' ]3 B4 X
; P' v  L6 L/ f
                        fadeOut[id] = true;
2 T4 z+ D, R; [
* U4 ^) }: Q  {$ K! ~                }
5 }2 u3 A- V  N( q: Z! n9 G% H4 K0 T( a: X5 \6 h3 T" n. S
        }
. G6 N' x) W( [7 M7 ?6 l7 w
: @& b3 T# O( J/ B3 m, |  r8 o        if(continuous[id] == true)
2 [! P9 s2 T* K8 B( W5 p! J
6 i$ l# F; G: V  p# T: @  f! t4 o        {
! Z3 J' n0 q5 {# F1 w
( }3 n4 b4 q' ~' z! c" Z7 V0 a                document.getElementById(id).style.color = newColour[id];                ; h! ~. K$ G8 a3 u" l* q( m

* {- h) V$ r4 [1 i) I! ~7 }        }3 U( \0 `& z0 A

" K4 b, Y  a; K: F7 f7 A) u        else
2 ^  Z) m" Q( w$ F/ m
, A' X: H! Z5 T& |/ a, D        {$ K8 o, \5 ~3 |& T2 t# W
' S* e+ e0 h, ]
                document.getElementById(id).style.color = hoverColour;
6 S; W; s4 _+ ]
1 @9 T- n/ c9 b, C        }
; w. T0 o* X* x$ M- U, _3 d" y  L
        clearTimeout(tID[id]);
1 s$ E+ M/ d5 g; U( I% U" [# a3 P& b( N' _2 H3 Y# h" ?/ D9 Y. F
        tID[id]=setTimeout('startFade(' + id + ')', rate);3 P3 a( w; ^, G7 p& n! M

$ m$ {5 S1 V3 z4 J% |) }+ m# u}2 L; C/ s. x. b

. F/ p  v; Z* R" \  N/ T3 Ufunction continueFade(id)
9 x! q' d# J  k8 |) ]3 L4 p' D3 T) H7 T. t) {
{
, B# ^  K" m$ B5 O" k$ M3 a
, i1 y/ x% D, S) F0 k        continuous[id] = true;
$ R* a) \4 W( i. O8 n  l4 m; j8 {" f6 S1 b) x% r, ]
}% u$ l- Z! g0 j- G& R5 O

. K9 i7 H2 i6 n! H( dfunction stopFade(id)& L; N7 {- c) V' ~5 o
0 L. z7 S6 B& ?6 c
{6 A, a. K+ g2 P8 R+ g

" y. P- l2 j+ }; L        continuous[id] = false;
* j  A+ K1 E- x' P
! s8 t! B) S4 t3 X2 D8 }2 L5 ]}0 E& v6 O6 l+ N) n3 M

3 _+ W8 x: I0 N. K" Efunction StartTimers()
( b: a' M4 e8 J
8 Q: O! t3 e$ g' }3 b{        //set up an initial set of timers to start the shimmering effect
, y+ Q  P: x3 `8 F
3 l7 x0 f& B/ S9 a9 l/ f! e( S5 g: \        for(id=0; id<numLinks; id++)
' j+ R( k7 U5 [9 Q
* m1 k' `/ S: W# s( O        {
* r" g9 L+ [( x$ L# }, j% K/ O1 p3 h
                t=setTimeout('startFade(' + id + ')', id*100);+ \# o/ @; O& F  e% M! Y2 A! Z3 A
- I9 ~+ N! F0 S1 A1 s0 R
        }
; m: }; b) J7 G/ K; ~- ?, s+ g5 u
}0 x% d  r: @5 n/ x6 a. e6 x. I

8 s1 Q9 _4 c5 |  w0 S//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')* C2 b2 O* @( a% g0 c& I

% u9 w3 H5 S" U. r  |+ E- ]' ninitLinks('#FF0000', 6, '#FFCC77');
3 B( x7 Y' t( y1 {6 F( P+ B: `9 |1 Q. Y( L7 B7 S* N: C
//-->" _1 u$ f8 {& ~8 B

6 @& ]! d" |; g3 E' W</script>& v  y) ~, M  M$ ^8 d, T
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元) k  H" a: l  l
</a>
3 x6 N7 u5 _: q9 b+ S) _" j- m<br>
3 u6 B' i/ A  s! t- l- S6 P<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>
% g9 n0 e* b3 j% \/ A<br>
5 M5 Y3 B# k: e$ ~<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
4 y, Y1 c) K9 ?0 R<br>          N8 p* x: D+ r; i' h7 Z
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
, [  W! `: V' I. O5 W  x2 A. F: m: ]<br>
( d- j3 G! s; L* G<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>" N. a8 B. K3 I9 L! [  J+ g5 h
<br>
$ q, ]8 }- O) ~6 f3 k( {# Z<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>, B  p+ F  F/ A* ~& |% ~
<script language="javascript" type="text/javascript">
" E  o- o" O! Q+ K7 I' W: [<!--! W1 h& l% s0 U+ v8 A% f9 I
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
4 Z4 d. n3 h# t6 N- Q//-->; r0 d9 ~' D# q5 h& X2 }
</script>