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

zw2004

<script language="javascript" type="text/javascript">& X& O) m1 q' j9 \2 F  t
<!--& H" A0 N( y9 l% D" H
// convert a single digit (0 - 16) into hex5 @5 s; M+ U- U5 O9 ^
function enHex(aDigit)5 \% |) Y$ u% G1 H
{
' a$ [! {) R3 R0 S! o1 n! F5 L' y    return("0123456789ABCDEF".substring(aDigit, aDigit+1)): D% b5 {  d+ p, p6 L: Q; ?2 B
}$ E# n7 e+ u. W8 h; {: u( ?! N
// convert a hex digit into decimal- F& N0 p. d% p* @/ g$ a
function deHex(aDigit)
6 _: D. y0 U) [* }' h{$ a. C' z4 V0 |9 ?9 ]% i- ^
    return("0123456789ABCDEF".indexOf(aDigit))
1 f0 a& n' a9 |' T+ d}8 O9 u8 c. }& }! `3 k: `
7 i8 r* @5 f& q! t
// Convert a 24bit number to hex4 L  u4 @; P6 ~& l2 v2 }7 D3 y) x, Z
function toHex(n)( }$ e9 x- R- x4 z. V$ }
{
+ R# d, j; s2 J0 _8 h# H1 f    return (enHex((0xf00000 & n) >> 20) +$ P$ \/ N$ c. ]0 C" W5 j
            enHex((0x0f0000 & n) >> 16) +
% d* f* i0 _) v* @& c2 a            enHex((0x00f000 & n) >> 12) +8 w# F( J' z# F
            enHex((0x000f00 & n) >>  8) +
! q0 ^) c9 a8 e; W5 a0 s5 f. C            enHex((0x0000f0 & n) >>  4) +
( y: N8 L! _4 P, C            enHex((0x00000f & n) >>  0))1 [9 o& F1 K" @7 Y/ C/ ~, I/ K) }
}& O$ T( |' e% P
// Convert a six character hex to decimal
/ }3 h9 D: @$ p: D% w+ xfunction toDecimal(hexNum)+ H3 n. Z1 {5 e3 h" j
{
1 u0 \5 x, W3 a4 m5 n' G           var tmp = ""+hexNum.toUpperCase()+ |6 b; Z0 K" ^; M: m2 l: e% L, H
    while (tmp.length < 6) tmp = "0"+tmp
* w) s9 }; N( U$ e- I5 r& G: f3 V           return ((deHex(tmp.substring(0,1)) << 20) +) w# X% S9 s, b2 ]+ K; N: ~
                   (deHex(tmp.substring(1,2)) << 16) + ; |3 ]6 T& c6 s
            (deHex(tmp.substring(2,3)) << 12) +" Q. C. {8 X+ Y0 s; N
            (deHex(tmp.substring(3,4)) << 8) +! t1 u+ G7 A& t7 j0 A
            (deHex(tmp.substring(4,5)) << 4) +
+ W/ u9 E3 E5 \' \0 U6 O                   (deHex(tmp.substring(5,6))))
* l) F6 Q1 p2 m: L/ C: N}: K2 m- s$ O& c* B
///////////////////Shimmering Links/////////////////////
( |( w. j$ k9 B+ C% T; D7 u//global variables3 T  w2 i+ Q* b% k0 z9 {' ^
var hoverColour
3 N# Z5 R1 m" S4 p+ S3 @/ x7 o" Ovar numLinks;+ a  |( o9 l/ M8 K; ]  K
var rate;
. T& S# w) @. E, V  nvar numFadeLevels;5 M5 s* s6 e; x, w
var bgR;
% s* D- l; ]% V$ E9 ivar bgG;* ?, [, a" f! @
var bgB;& T" j& M' I1 c7 |7 w
var currR;
- d% T+ A- A$ z8 S& yvar currG;$ _" k7 [) l8 g) O
var currB;% V8 j9 P2 _3 T: l8 d; L1 X
var count;
( b9 ~; L, n6 N/ lvar fadeOut;" v8 j6 p2 b2 L0 j, z
var continuous;
" R8 J, U% T$ tvar newColour;
5 b- ?+ n6 w4 Pvar tID;
) x; ]7 d4 h. K7 qvar redInterval;
! h( p4 @5 G2 s! o# n- Bvar greenInterval;
9 f+ ~7 E+ Y/ Pvar blueInterval;# S" Z2 e7 b" j8 q9 z
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)! Y) l. ^' Y+ Q& S- z& W' f- q" ~
{
3 y% Q4 T" N1 F+ O, {6 B6 K5 f        hoverColour = mouseOverColour;
  l5 T: d7 S& A! u0 e        numLinks = numberOfLinks;, u) Q  g& s6 d  ^
        rate = 1;" S4 [! Z: P. J! D
        numFadeLevels = 30;$ z* Q& T6 ?' w; k
        function initArray(theArray, length, val): d0 ?' ]( g" z
        {& z1 N6 R3 D- w8 M- e
                for(i=0;i<length;i++)" Y0 p8 |: b; f8 D2 }( U& t. h- I
                {( S0 {& O! t* }
                        theArray = val;
' S. O! \% |2 U* r1 ?9 E9 B9 |! o) F  f                }" i( v: L* b  x( p2 @9 F" z
        }
, |* J4 N: a1 ]& ~; G) b/ R* h        bgR = '0000' + fadeOutColour.substring(1,3)  O( R1 w. W+ y' s' ^
        bgG = '0000' + fadeOutColour.substring(3,5)
3 }, j& _! D7 v, b# r1 k/ h. }& B        bgB = '0000' + fadeOutColour.substring(5,7); V* ~+ o. O/ ]. d6 o8 B- q0 p
        currR = new Array(numLinks);
4 k3 B9 T' C. k8 k2 _2 N; T2 m        currG = new Array(numLinks);! A. n9 f2 l, o7 n6 N6 V$ p# L1 {! P
        currB = new Array(numLinks);
0 B# H/ k! \( M        count = new Array(numLinks);+ ]% T5 R, L% d3 O9 t7 j, z  J
        fadeOut = new Array(numLinks);, H" U7 }9 J7 \( ]4 z4 v  a0 b/ a
        continuous = new Array(numLinks);
& H5 n; U% C( q; c$ V/ n        newColour = new Array(numLinks);4 I* u, q/ J% {! W  C
        tID = new Array(numLinks);5 b6 R% \. L( a1 n9 @2 g; ~
        redInterval = toDecimal(bgR) / numFadeLevels;
. Q2 r  ~3 F4 p9 c- O4 v        greenInterval = toDecimal(bgG) / numFadeLevels;
( \) X* W7 M& p( u        blueInterval = toDecimal(bgB) / numFadeLevels;
# ?9 y$ \! L0 k5 `6 l        initArray(currR,numLinks,0);
% L% U2 F% Y& x        initArray(currG,numLinks,0);
4 L7 X1 u7 [. K1 ]/ t7 x1 H, Z        initArray(currB,numLinks,0);
0 M3 g, q& D; I8 @0 \0 P) p6 |! B        initArray(count,numLinks,0);6 |# s9 ^. R+ H
        initArray(fadeOut,numLinks,true);
/ R) H/ l7 G4 O# B, I        initArray(continuous,numLinks,true);
; e- ^0 U$ k( u/ b1 ~" [}        ; U/ E+ z  s8 j! V
function startFade(id)
9 K' t; n. a! S- e{
/ B4 U# i: w9 X7 Y        if(fadeOut[id] == true)
' r2 {( ^$ J6 w4 S$ M$ q+ B        { /*move colour towards background colour (increment)*// o% V" U, e: X  g3 m+ r3 }$ Y
                currR[id] += redInterval;
/ ~* m# M8 J) O                currG[id] += greenInterval;+ j) N  N: _+ r+ e2 q7 a0 @  k5 T
                currB[id] += blueInterval;
6 n  g' R/ S  u% t1 i3 M' }2 F$ J: u" p                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);  h: ?# R. Z3 x/ ~6 n
                if(++count[id] == numFadeLevels)
; o% x1 s  H. R8 }9 [                {
% }- |" u* r0 C6 ~" [% x1 d% [1 _                        fadeOut[id] = false;
8 \2 H# _7 G$ a0 S7 c4 Y                }9 G! Z; h; m2 k: g
        }
4 k0 `. m: k9 Z/ m) d" H        else# b' Q9 o# _. U3 H
        {2 J+ G' h$ `  J9 y; I3 w
                currR[id] -= redInterval;1 N0 T/ k5 r5 z: k9 w7 W% G2 B* W, {
$ S( M2 j/ P# }1 G
                currG[id] -= greenInterval;; Z  F6 S& {4 |! S

3 S3 y7 X: N' m                currB[id] -= blueInterval;
: I" y% E" p6 U9 }% [+ y/ e
' e, ]6 s; ^) x                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);9 S4 P5 v7 A9 J1 U* z
: W2 J# s  K7 |+ c
                if(--count[id] == 0)" Z' _& k: ^' p4 J9 I) B& L& e" I( h
* V/ h2 k" `' h7 w. P
                {4 b1 J/ s8 j1 K* m. w% @
3 d& Q$ p- D4 o' E! o9 D$ R
                        fadeOut[id] = true;
1 b  r3 o. `% c1 n" W
3 e$ k5 P! K0 Z3 \                }
' \3 T7 v! G5 v1 X  y; u; f0 C$ e' G% p& n9 C; a
        }
5 N3 u; Q  y; ^! H% i
7 |; g- P- T7 G" ]3 N7 L        if(continuous[id] == true)- p" g& u' u5 k4 M" \+ U
% U3 B9 d) s' q) q" E9 N
        {
) ?1 Q% u1 j0 H, X) u  v  A' B- T/ e7 [7 Y
                document.getElementById(id).style.color = newColour[id];               
8 j" t8 q" h, q. M! s8 N( Z$ h1 _4 E
        }  K) f  S) J4 I/ B( w
' L) Z6 t5 R2 Q, M3 k5 [
        else0 D! B" q2 u( H0 i% G- U4 G" A
5 \9 s0 v5 J6 _) E/ O% c  D
        {1 d3 l$ E8 N+ h/ U
2 Y( ~  w. U) \3 k
                document.getElementById(id).style.color = hoverColour;1 t5 [; R& @! g. L

4 l" w( o/ v# Q        }
  Z* V$ L7 Z! @: \7 ~
9 i- V" g6 [  D, X/ N' c        clearTimeout(tID[id]);
) ^! B9 s5 ^: m! j
+ x: Q+ f7 |- G. K& A) u        tID[id]=setTimeout('startFade(' + id + ')', rate);
5 G% U1 D4 ~. A2 m! F; f9 C- W6 Q" f8 c5 g5 n. G' R" g. R% {4 I8 e
}" Z& e/ T! L& U! O/ p  h
. t8 a1 \: y( a6 K+ k5 s3 u. [2 R
function continueFade(id), v0 z% o9 V" j' H. |
/ U- x) ^% r8 i% h1 V' v0 S: i+ M
{, [( |9 e5 O9 |! e0 j

  D" }- F" U. c$ c& x; j        continuous[id] = true;
# r2 g9 {8 K" X6 c! H( z8 f) ?
$ X1 v! M; Y$ Y" M' M}
+ [  z7 n0 a* m; `; N
( c( l  K# b* `& a9 tfunction stopFade(id)
+ `# L8 n2 j1 _. I; s( V
# C4 F+ T' i8 o+ o1 j{
; S; `0 M# h* C# b/ \3 ]! s/ k
. ]" R  q) z3 r! Y, D        continuous[id] = false;
  Y4 y- K( u, ?  F1 P6 x/ L$ W- j+ O  L9 F) N* c- ?& o5 K
}) |) ]4 u% y9 V) y% }( s5 H
" f+ o' S' o6 ^- e7 S2 A0 Q
function StartTimers()
2 e7 F0 n% `6 x* _( \  q' b0 \
' ~& n! T1 I- v: i; P" @+ z{        //set up an initial set of timers to start the shimmering effect' ~5 Y. m7 }$ D$ J; r6 X

1 v# v! f; i9 S# _6 M' g; X+ S/ |        for(id=0; id<numLinks; id++)
5 q7 F! g+ {3 t8 ~& R9 h+ x1 A# u
. \- H: V% y2 d8 v: I        {
* U) n, U- _6 ?% V
, |! a7 a) x( g. W, F/ C% X9 c; J                t=setTimeout('startFade(' + id + ')', id*100);4 y& Y' C5 {0 u; s9 ?4 |  @$ I

8 b1 z% A& ^! |) ^- {$ ^# o" x        }
1 m, e4 p# x8 z2 ]# k) j9 u! r* O8 l0 ~* [2 B' T. [
}5 k/ f/ x, t! b9 }1 c. |1 N+ U

, t2 k. y% i: g/ d1 B  u8 D//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')7 ^  {0 Y8 o( W$ M# I4 E( u

3 `8 _7 l8 j6 Q! P) minitLinks('#FF0000', 6, '#FFCC77');
# w0 d: u  p& X7 W) T
: J6 c0 O( w/ j# K+ u1 V//-->1 @3 E1 y2 a2 H
! v# A  n& v9 ~$ ]
</script>9 \8 B! D; |; i2 B- e# R
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元
7 {1 T: Y7 P6 t" X</a>
, z0 n! }: _6 D+ C<br>
! J: p* K* m  b" P9 j9 y) S. s<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>
  R0 g" C. Q! h3 U- w# E4 P<br>
; R6 D4 c  K6 ~<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
* l( \8 p6 \$ x9 D& N<br>       
( H& E6 T3 A% U<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
: F, N, V( P. O* g' ?% b4 s- S5 K8 m<br>2 {4 j; Q; _; Y# X
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
& \2 N9 ?1 s2 e5 x+ C& ~) H  J<br>
/ A- {( B5 L/ o) u* H, M+ M<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>
; Y3 l9 B2 d# O+ b, S8 y" q<script language="javascript" type="text/javascript">
; m9 _' P: D$ m0 u: {# B3 @6 ~<!--
7 D+ N1 @; C% |5 lsetTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering5 \7 H+ s7 e0 i
//-->4 Z6 H4 P* y6 _" R
</script>