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

zw2004

<script language="javascript" type="text/javascript">
) U  j% i5 P6 s! a<!--
' w' O6 d' }9 y  S' G' Y1 u// convert a single digit (0 - 16) into hex
" X  D* c3 M; b8 Cfunction enHex(aDigit)
/ X& t, r/ }1 d{
- G6 R9 T7 F: B1 s" ?    return("0123456789ABCDEF".substring(aDigit, aDigit+1))* y5 v  h% [; j
}" A1 z* O( A5 X; h) J+ Z2 [9 X
// convert a hex digit into decimal
. A' x8 _( A. ]+ m5 g$ `$ Wfunction deHex(aDigit)  F6 b) L: _5 |" p' o1 l, l4 ^
{
; i9 N& g) l5 E9 b    return("0123456789ABCDEF".indexOf(aDigit)). X# T$ P9 I# Q+ D! H
}0 D2 E& N5 ~- B

8 @1 U+ V; u9 Z// Convert a 24bit number to hex% q3 c# G9 l. r8 @
function toHex(n)
* o8 B1 l3 ]/ U+ q$ A8 a{5 z" E6 Y' j: P/ H/ e
    return (enHex((0xf00000 & n) >> 20) +
4 B# \, C6 D# ]0 h            enHex((0x0f0000 & n) >> 16) +7 d- g& K, a  N7 @
            enHex((0x00f000 & n) >> 12) +" g0 ?0 j0 m9 b1 k$ m# u  a. V
            enHex((0x000f00 & n) >>  8) +
4 p. U# W* c* H5 v! d0 u            enHex((0x0000f0 & n) >>  4) +
; u9 H, g! t. k8 G- Z; u            enHex((0x00000f & n) >>  0))% P' |) c2 W3 J* `
}: n) q4 n& Y' O" j* M. E5 V1 K' Q/ v% x
// Convert a six character hex to decimal+ K9 z" Z2 V. v/ ^9 _* J8 j
function toDecimal(hexNum)
1 O. y* [$ S9 i{, W+ M# v7 b$ L8 e, K
           var tmp = ""+hexNum.toUpperCase()
4 q- B& I7 l2 x; P  f! U    while (tmp.length < 6) tmp = "0"+tmp7 l1 s1 Y# L5 F: O1 E  r/ W4 w! d
           return ((deHex(tmp.substring(0,1)) << 20) +. F. E' R9 k5 |5 e5 I' a4 p* g
                   (deHex(tmp.substring(1,2)) << 16) +
8 t! E+ l1 G0 A            (deHex(tmp.substring(2,3)) << 12) +4 P3 v6 F( q. v3 y; r
            (deHex(tmp.substring(3,4)) << 8) +
' I1 B9 f! g1 ~9 J; ~            (deHex(tmp.substring(4,5)) << 4) +
, s4 p. Z* H2 c9 y. d                   (deHex(tmp.substring(5,6))))* g7 Q, O  s  |' I: B
}
' t$ S+ Y( j6 A- [( j+ u///////////////////Shimmering Links/////////////////////
/ n1 f( t' `5 t# a//global variables
. o0 r1 f! d. ~* ?8 a; Kvar hoverColour
4 r! Y+ P4 n* V5 s/ F) `var numLinks;1 p* l- h! H/ L; ]3 G
var rate;
8 T& G7 B" M0 D3 K4 Y+ r4 M$ ivar numFadeLevels;
' K3 a+ `2 k' w. v) cvar bgR;1 Z7 U; r7 L4 m3 r2 y+ v
var bgG;% @* k9 u7 t( \( R; V
var bgB;: h) ^2 q$ {; E- W  `  Z1 v( p
var currR;
. I/ _& b8 Q9 N% uvar currG;
' H. Z6 \, E! U: ?. kvar currB;
3 m' t$ r' l3 R. m6 Zvar count;& G6 }+ O/ K) t' H- y5 r8 b
var fadeOut;9 D+ c. N& Z1 R/ ^  e
var continuous;
# t) B, E/ j8 l8 G; e, uvar newColour;2 }: O/ p4 D+ M3 S
var tID;
! E1 n1 g+ |8 vvar redInterval;
' N3 ?- F7 l3 j3 U$ a; vvar greenInterval;
# ^7 H7 }% T5 q4 Y# ]var blueInterval;
1 [( k- F7 e4 G& y( b3 ?! y7 _function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
1 p* ?" ]9 }/ B{% `' I) y4 H4 t6 {9 h
        hoverColour = mouseOverColour;
3 t0 M. _/ q, [( F' j        numLinks = numberOfLinks;2 ?' h+ b" A9 ]
        rate = 1;# I, b# n, F4 K
        numFadeLevels = 30;. q- h) E# q  d1 }3 R$ I6 m
        function initArray(theArray, length, val)0 r' ]' M4 h4 p, i7 P
        {
; e. ?4 q# f, C                for(i=0;i<length;i++)2 c, t. n6 k8 M" P+ V% N- F
                {; p9 o7 z# Q0 ?) A; L  _
                        theArray = val;
+ E0 Z) z2 y$ d* A, a                }0 D! l, h8 |$ v5 a# q* s
        }! i5 a) Z) h6 `* M6 p) R
        bgR = '0000' + fadeOutColour.substring(1,3): O- t3 l1 D4 W" K! m, ?, u. R
        bgG = '0000' + fadeOutColour.substring(3,5)9 k9 F7 g! O7 O6 l" Y$ [# q% R
        bgB = '0000' + fadeOutColour.substring(5,7)
3 p. T+ a5 v5 |: G6 u8 c        currR = new Array(numLinks);8 Z  p+ i% Q0 a  a" C5 N
        currG = new Array(numLinks);+ }$ x2 ^4 ]. B! z
        currB = new Array(numLinks);
* i0 F& H# m9 [% K% c1 f9 l6 D        count = new Array(numLinks);2 p1 a3 z1 K8 R8 [
        fadeOut = new Array(numLinks);2 U3 f/ o/ q3 I* y
        continuous = new Array(numLinks);0 t4 r. G& F# w6 Q/ g
        newColour = new Array(numLinks);. B, u0 Z0 s/ V! d* q, F
        tID = new Array(numLinks);
: `6 z9 {& a) m6 x        redInterval = toDecimal(bgR) / numFadeLevels;
: _) Q$ q) d( c4 T        greenInterval = toDecimal(bgG) / numFadeLevels;
1 I/ K# P2 P4 j. b+ k9 N        blueInterval = toDecimal(bgB) / numFadeLevels;
0 ^9 Z1 t& q% F- m/ _# Z        initArray(currR,numLinks,0);. ^# ~/ @- P" O3 i! B
        initArray(currG,numLinks,0);
7 S0 }+ v) \6 i, E" {3 {        initArray(currB,numLinks,0);$ V/ a* R) ~7 l1 V
        initArray(count,numLinks,0);
5 X' Z! |+ p4 G* a4 s0 _9 `8 P2 S        initArray(fadeOut,numLinks,true);
# q* r5 Q% A; [8 a3 B7 y7 G) L        initArray(continuous,numLinks,true);' C( j* \+ ]( i$ p! q
}       
- k( `- N$ ^# a: D% }/ {function startFade(id)' @5 t$ h1 C% N+ B2 f+ y2 E/ Q" Y
{# ?  K" I, p8 D% c6 m
        if(fadeOut[id] == true)/ R' G" l7 ~  O9 ?
        { /*move colour towards background colour (increment)*// _5 Z9 B' r3 J: B
                currR[id] += redInterval;  ^& T/ S! M* r2 ^5 b; z8 Z
                currG[id] += greenInterval;9 l) \$ c( b9 F, \+ a! ~
                currB[id] += blueInterval;3 G( J- ?; {& z) R
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);2 G# e% ]. p5 F& P* h4 @/ L8 b
                if(++count[id] == numFadeLevels)
; Y  m2 ?+ P+ p, O( ]                {
) R* e& f0 u1 y1 l9 o+ I                        fadeOut[id] = false;
0 `7 a4 p. N3 z- K" R0 b                }7 E0 |: g6 w0 y* c6 C
        }- X' a5 J$ {3 x) \5 K5 h
        else
% Z1 |3 r7 \1 H3 |) |        {
. v! l8 R; g" B                currR[id] -= redInterval;% y& J7 j0 M6 N: D  c% q' I4 G  s/ z- @
2 g5 N7 M9 s8 F% \8 F* {1 X6 M  P
                currG[id] -= greenInterval;" T( X+ x+ ?0 r+ v5 O

  J) G# u) n* W1 Y                currB[id] -= blueInterval;
* n" N! q, f9 ?! k7 d# ], q( D* E" x. {
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
" ~5 T0 c/ [6 U$ N1 \. c$ I
+ f- u7 L5 F0 r* m8 o/ [, K# P+ a  a                if(--count[id] == 0)  \8 z+ w0 L$ E

  L6 }9 t8 p; X1 K( `                {* u# q& A: W9 W0 I

( i2 l. C& s. q  s. b! z- C  c  l                        fadeOut[id] = true;
1 g  [; ?+ l9 }$ v0 T$ q2 ?+ G& q: Y7 A4 l& N) F- d8 d! G
                }
& ~: t' L1 @1 ]) @7 i/ q; y' U3 T5 E7 [& \7 I
        }
# q9 q# r" S/ T$ w& \. x* R. e+ n
4 Z' R" T/ E4 e: ?7 z& d        if(continuous[id] == true)
  C4 g/ n1 a5 G0 U% z+ J, f; I
: N$ U8 {- g& a+ h8 z, Y  q2 G& I: d        {& Z  R* @+ I7 Y' p2 T) R4 B) s* k
/ d2 x" U: q* q4 w. O7 Y
                document.getElementById(id).style.color = newColour[id];                $ R/ d% {+ z- @6 {7 s; `

6 U# ~; P( x& d6 u+ H        }. K& O9 g  `* O3 _/ a
+ E5 g% O- [$ N5 B9 @- v6 u. s
        else1 D- ?3 ?! r. B

- F# d# b# V3 d: j" h1 {        {4 K, e+ n( {  O
& p0 v* e, g1 `1 L8 ?8 H
                document.getElementById(id).style.color = hoverColour;* I& R( ~$ A( v, L& L
* f6 a  r6 l; g0 B" `  }: G* V' T
        }- p" x( ]- O; a( z( G8 H6 M

  O$ C  s; H! K5 @0 d- Y" N        clearTimeout(tID[id]);: n' h1 |7 p$ C2 ?5 W1 I
: A) x% Q% B9 [; F9 t/ f; [2 ^
        tID[id]=setTimeout('startFade(' + id + ')', rate);- h0 w; _6 s/ V9 O7 m
- h' d/ u: r  Y$ F
}( L9 i: j. @4 ^; e+ e: m! L9 q1 D

7 t2 b! F6 _8 @3 N* h+ U' jfunction continueFade(id)! d! O0 t6 l' }% D8 `! r0 t
: J+ S" B& ]9 ]4 K0 [- i
{# a  C- h9 f  M  o) c

/ U$ O4 p! Q/ G# n0 p, X/ a        continuous[id] = true;% ]1 c; ]; ~* |2 p" f, R% p% Q- g7 |

) {2 }( f6 g# s}
4 C' W: R1 ~  x3 C# D
4 q7 P" W" t9 j* s$ yfunction stopFade(id)2 E3 p/ e/ ?) p. r! g% L- u
# X$ j# q( s* K* ^* o, E
{; B: _1 x1 A; T% O6 `$ s; H
. {+ [" R  O% j" X. z
        continuous[id] = false;/ e3 W' h* j" G- u! N2 j/ L
. _! q$ C: v' `' X7 S$ f
}9 o* n9 {! R# t; h6 L
% q6 F0 ]* H9 z0 P8 l
function StartTimers()
; E9 M9 k' H$ [* b8 ]2 i1 c( O* S) Y& a5 R9 b
{        //set up an initial set of timers to start the shimmering effect
+ F; o: S) M! q" ~& x$ v. v7 i9 F- Y2 l
        for(id=0; id<numLinks; id++)4 o8 _5 Y3 h# m
3 T5 ^! I) W" y9 w0 `' y3 b
        {
, B3 \# f9 ?6 C2 G$ t! J
! P0 v, H1 }8 x                t=setTimeout('startFade(' + id + ')', id*100);
$ j0 I0 D3 X6 n# d* U9 q
9 o5 \- L8 a& F        }5 ]" ~! v) C3 D
1 ]/ C: r* h* s3 o7 [/ n. k4 ?
}
+ s- ^- G. b1 b# d# |; R" Y/ }
% j9 I( m$ l8 ^5 q% b; ]! {//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')& X5 c( W9 P& h2 W( l! i
" ?  n, E1 L% M8 O+ u/ B' u4 b
initLinks('#FF0000', 6, '#FFCC77');
) C9 X/ {/ [4 B. F! q
  m8 V6 G; o% s7 r3 q* E7 l//-->& b; e) P' p3 z0 i# q
. _& B8 a6 B7 Z/ u. N$ `* J
</script>
9 S# q! W' J# u" F<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元
: X: d7 U/ u* K0 i8 |</a>$ ^1 @+ y  A. k5 m
<br>
" |2 y4 @! \% D4 A3 Q1 A<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>  k' s' C" ^. J  b7 g/ f4 x
<br>
$ C' _" Z( B+ r7 |1 F! S$ D6 C2 Z<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
0 \/ S" v" \- }2 |$ V% \/ Y<br>       
+ @- ^7 c8 t4 N- x- Q( K6 i# i<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
; F1 Z, {- ]8 Z' @7 j6 r<br>8 w5 i! E# O* `2 B! @7 o
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
; j$ K$ [. l9 O" v* ~<br>; ~3 e2 h. B6 p
<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>5 H; f$ w/ |3 P- w
<script language="javascript" type="text/javascript">- l) Q; N9 ^/ U6 j8 a5 z
<!--) f, u9 J0 }/ _; y) |
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering( c$ v; `/ O) D2 O9 s6 H0 q1 ?
//-->
( y% s- I3 D5 q0 ]* h( S</script>