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

zw2004

<script language="javascript" type="text/javascript">( i, H$ g2 v' {
<!--8 G& P8 W+ Y6 y) ^
// convert a single digit (0 - 16) into hex
' z  V4 O; W  H% Q1 s1 ffunction enHex(aDigit)- M' V9 W) u" [/ i" L: n" F
{0 t3 q. F2 f9 C8 L6 v
    return("0123456789ABCDEF".substring(aDigit, aDigit+1)): U( e% I8 ^2 R5 u
}# g/ N2 X% R, F5 }0 k- {6 ]
// convert a hex digit into decimal* j: @0 b& X  S
function deHex(aDigit)
6 U9 E; \: x0 d' G8 A% ^: _{1 ^- m, P5 r( Z2 L7 Y; z0 p8 ^& r( H
    return("0123456789ABCDEF".indexOf(aDigit))2 |7 C' t! z6 J: F- q% k4 a  K; n
}
- |, c. j4 M1 B! \( c# a) d! A9 s. \
// Convert a 24bit number to hex
, j/ L8 F4 B0 ^  i0 |function toHex(n)3 l/ v% M+ r8 a* \
{
- t0 W% `; Y! ], B" x" q1 ~    return (enHex((0xf00000 & n) >> 20) +  S, F* s" Z, Y# }% i/ U! `
            enHex((0x0f0000 & n) >> 16) +
1 x6 u/ i5 P  K6 L, ?% B            enHex((0x00f000 & n) >> 12) +
5 c. k4 @; @0 U& C            enHex((0x000f00 & n) >>  8) +
; H- G. N# y! K$ h: f- a            enHex((0x0000f0 & n) >>  4) +
8 b0 g4 \9 C- a' m5 a            enHex((0x00000f & n) >>  0))
5 }* e4 U& b1 V* F$ L}
0 [* W: D, f4 E6 c" y# E5 p9 S3 _// Convert a six character hex to decimal
8 q2 c2 k; ^+ }( cfunction toDecimal(hexNum)
4 A  ], q! U( t9 O9 k/ t{/ J* a! F* u- B: ?3 y2 U
           var tmp = ""+hexNum.toUpperCase(); S7 `$ @& w8 O5 {3 f4 s0 }, X) ]5 L
    while (tmp.length < 6) tmp = "0"+tmp
  e2 u0 U9 y! H" Q           return ((deHex(tmp.substring(0,1)) << 20) +6 T/ Y' h* n# T3 O6 F) ?; p
                   (deHex(tmp.substring(1,2)) << 16) + ' O% [  o* x# `3 T; n6 [
            (deHex(tmp.substring(2,3)) << 12) +; Z! J1 M5 n, [5 M) q0 _; K
            (deHex(tmp.substring(3,4)) << 8) +4 j! P" W3 H! K0 Z* T. Q! s+ ?
            (deHex(tmp.substring(4,5)) << 4) +2 ^3 N) d& Y5 j5 g
                   (deHex(tmp.substring(5,6))))
( s) K, e( j3 P. w: v/ N$ S}
1 N& ?9 o& C- T: l4 h///////////////////Shimmering Links/////////////////////5 L5 `8 X" k/ `5 J( J9 t( H7 a
//global variables
8 c( h: e" T6 m  ]! |var hoverColour& W. p8 E: W1 w" S$ R, z, M
var numLinks;% t% ~# a4 h" w8 F  {! v$ V
var rate;) w1 Q: B; N9 u+ ?+ C* ?' }
var numFadeLevels;" [" R+ y8 \& l* @/ ?
var bgR;- c' c+ Z' T+ G; [& ]
var bgG;/ m! C. P% L& |; R' z# c
var bgB;% D! n8 j( h5 \& ~9 L0 f, `+ S
var currR;
1 j$ r1 V; d" tvar currG;
5 q2 G" V$ J* g5 t9 H3 @0 ~var currB;
) C# v% e, n( S7 o# Z+ xvar count;
3 e) {* f: v1 b9 G" _4 svar fadeOut;
4 }! e% v1 s  Rvar continuous;
' w( m. B' Q( C( i; Vvar newColour;( ~0 d0 O3 l3 r; q2 m
var tID;
. I& Y' \5 ]! M) S3 C- W; yvar redInterval;
5 r# j5 [: J& uvar greenInterval;3 v$ x# h& ~( ^1 R" K5 I5 U1 R- \
var blueInterval;: n7 i. R3 \* h9 g: I
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)- x( t; G% Y+ Y/ y% B
{- M0 B' d5 ?  S) a2 X3 ]: `
        hoverColour = mouseOverColour;) i+ m) R" U* p# X9 f; z7 L8 J+ e
        numLinks = numberOfLinks;$ ~2 a4 m1 ]# R8 K% T2 L& i
        rate = 1;$ [( U) ?& ~' j
        numFadeLevels = 30;6 y4 a; L  c6 l, A8 n$ w( h( W8 u
        function initArray(theArray, length, val)
: C& Z/ v! y% Y8 g! R        {2 u4 }7 l9 S( K* I1 r! n
                for(i=0;i<length;i++)" f5 |. ~2 q' k+ O/ }
                {
1 V9 V  ?- J* h, M                        theArray = val;- f( R! |+ [. k: V% n7 h
                }
! }7 g$ ?( C2 P1 \: ^9 _3 K: q4 r        }
& F" H2 b/ j4 M. @0 B        bgR = '0000' + fadeOutColour.substring(1,3)0 s6 O, H& M  l/ B+ s* m( @
        bgG = '0000' + fadeOutColour.substring(3,5)# f0 j4 P. E" R% Z5 V9 z* j
        bgB = '0000' + fadeOutColour.substring(5,7)9 `3 z* |9 y" x! f, M7 I
        currR = new Array(numLinks);/ T7 [. e  \1 p7 X2 C2 _- J+ I
        currG = new Array(numLinks);
" H7 y7 @9 _+ z0 j6 o' U) U) l        currB = new Array(numLinks);
1 f* S+ q9 Y1 O( T        count = new Array(numLinks);8 O) ~0 Y* _- k2 N+ r
        fadeOut = new Array(numLinks);1 T8 X6 g! A3 w& n9 s  _2 y- i
        continuous = new Array(numLinks);2 M% z4 s4 N7 S, r
        newColour = new Array(numLinks);
9 i8 U* E5 ~" f6 h        tID = new Array(numLinks);4 r( @5 Q$ e  X2 E8 U
        redInterval = toDecimal(bgR) / numFadeLevels;7 r% A5 e* V* \7 V' f& Z
        greenInterval = toDecimal(bgG) / numFadeLevels;. Z$ Z7 U- o! h/ L
        blueInterval = toDecimal(bgB) / numFadeLevels;
$ t  v  J  r2 @7 x4 i        initArray(currR,numLinks,0);+ v8 t7 \) |3 B, t  q
        initArray(currG,numLinks,0);
: c6 p# H# m( n; K+ w4 z        initArray(currB,numLinks,0);3 A' I+ h6 k) R* Q+ R' f
        initArray(count,numLinks,0);
2 r- q2 ~! E( r2 ?        initArray(fadeOut,numLinks,true);
3 C3 m9 u1 w" a2 P        initArray(continuous,numLinks,true);
1 y9 w/ Y- T" U7 }7 Z}       
0 a* O- W+ d$ m3 ^; O  lfunction startFade(id)! K! l' q1 b0 M* Y* U
{
( S6 P$ N0 U+ I; f! }# p        if(fadeOut[id] == true)2 g# @( e% l4 e! I4 y; w# m9 m
        { /*move colour towards background colour (increment)*/
/ p6 A: v) B6 t+ s, U1 j                currR[id] += redInterval;
! F8 z4 j: C4 \' n                currG[id] += greenInterval;7 e% r$ s  A4 P. }' u
                currB[id] += blueInterval;7 i8 ?2 a0 m7 R: q
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
4 q' @8 Y2 j; ]/ T1 d                if(++count[id] == numFadeLevels)
- D! V" i$ y" ]- z3 ]" ^                {
- O/ \) E+ q& a                        fadeOut[id] = false;8 O' c9 C: D( i& T# K1 f/ b
                }( {3 R3 L; I0 \: W( `. o, ~
        }& ~: S6 j3 V" a6 m
        else/ d% E- m) A( U# }, t5 W
        {
/ M. p% [$ ^7 H4 b9 u0 K9 j                currR[id] -= redInterval;
- l5 g" q% o& V! [
7 j) J( d  ]7 T3 E7 h9 c8 Q                currG[id] -= greenInterval;, @& B. H3 Y5 S4 |1 L0 ]
0 r% k: F& i3 R7 p, K7 z
                currB[id] -= blueInterval;8 x! x7 K* z0 N8 }. U

+ t8 n7 K6 ]( u8 R                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);" p) z& m, x" E. \9 ^, z( i9 O
" n9 [) z7 W) X% y0 g
                if(--count[id] == 0)
' M  W4 |3 e1 P; m, ]. N: ?* ], ^/ l2 R* x2 C4 \5 V. ]; y6 U/ K# ?
                {# |2 s! X6 h, n4 [( F
7 H2 N3 y; b4 w9 j# S3 N
                        fadeOut[id] = true;+ o% V4 a) Y6 D+ {1 u+ n# A
: K9 L5 t2 Y  z6 E1 j- q
                }# N+ Q8 y; U- c$ _5 d1 |$ ^
$ E, x' V+ \( Y( D' p
        }& P& J0 j+ x2 z  h$ h, T! c% y7 u
2 `' X5 b( H3 E/ x+ Y
        if(continuous[id] == true)
9 L) J( K% m& I! r% b, d+ |
% }4 I1 ?, R  n. \/ h' p        {7 S3 k! k7 ~7 U& P; R' o

/ `$ D' A, g2 S# G8 r                document.getElementById(id).style.color = newColour[id];               
0 l$ s1 T7 _' d8 v! c: P
+ h) k, s5 U1 ~! U# Z2 j8 ^        }0 }' q( n! C3 _6 `3 E2 C

6 _) R$ g5 @2 C+ j( c0 A        else0 X: ?7 L. s& E+ r0 n0 E3 I* F

' ^5 x0 H4 K3 e+ O1 u        {
) ^- A' i( s- T1 n8 }
+ z) c9 D6 Y0 c# I4 g: j                document.getElementById(id).style.color = hoverColour;
, J  w4 \. |) g
* {* S8 Z% s; j" d* h        }
  v! F& b" _0 ~5 {2 l3 w
5 u; I, H$ I4 m+ M8 L- s( P* V        clearTimeout(tID[id]);2 f4 H+ x2 J6 q

4 l: f5 G6 I5 q        tID[id]=setTimeout('startFade(' + id + ')', rate);
0 k# \! A7 |! |! T: a3 z" _' @
$ ^5 N1 Y! M8 L0 S0 {, g}" V8 n, `9 \- l- {' O
! o4 A+ \+ N+ I# e( k
function continueFade(id)
$ b! K( A- ]4 {. t
0 U3 q5 r" o: T, s{
2 O- b* ?$ k1 c) X" R' v- [9 E1 R( }3 g1 T3 T
        continuous[id] = true;7 |) V/ h4 h! p/ q
! ^$ J/ {3 v! F# }/ n
}4 Q6 T4 m( z! n4 w
7 C, a7 h; n5 B' H, G
function stopFade(id)
# @& A: O. n9 e: D; ~) L: q) \' O4 D7 T/ c' m  j6 T
{3 N1 |2 ?! L! G" v, P* \

3 D% N  |4 A7 i* |& C( O0 t+ V6 L        continuous[id] = false;; i, v3 A* L) W7 T# B' y

- R/ ^. x6 e; `+ e. Z2 m; V}
8 a  H2 d( x5 Q2 r. l$ J  H( o  H- B- l. p; n; \% ]3 L
function StartTimers()2 Z) ]! j8 {* i" y5 J: Q

3 w- i* J- s+ m' ^{        //set up an initial set of timers to start the shimmering effect
( d1 f5 n- P1 \3 L2 R: z' ?% c6 E9 C" U5 y/ b1 x! Z* f( P
        for(id=0; id<numLinks; id++)8 p3 |; Z! \$ g/ K

* f: h. j- y& _* |( x% `6 ^        {# d$ L9 ^& I3 D

. \* B& W- K( E6 e  x/ S                t=setTimeout('startFade(' + id + ')', id*100);* g7 N9 I& J+ G' \2 H. E
# E% w/ K' {0 c, q* D$ z
        }! j* Y! M. L  M5 d

# v* C! c. w, ?/ g# E}0 E8 ?1 U  N& Y) t

% s9 [6 n0 ]8 [; w; Z5 K//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
( r. f5 z, ?; |4 h' i# D* c2 M
; H4 J! i- H/ \5 G* D- U( OinitLinks('#FF0000', 6, '#FFCC77');6 ~2 s  j% i# u4 \$ {
! W) ^; [' t/ \0 X# c; o7 J9 W
//-->
. Z7 r& W" C* X9 V" t7 s, q3 c' {7 P: E2 u. A6 k! _, C
</script>
& \6 l( j0 |( X5 _2 X2 Q% L<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元) B8 `4 `3 g" p8 k; _: ?( i
</a>
. M) G" J7 C6 `& g<br>
5 x, a5 r7 ^& r% i  d/ O+ q<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>
( U+ Q9 B% B+ [$ d% _" I1 r<br>% n/ h8 `; H- m# }2 n
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>+ q; W+ j$ o0 A0 v8 Z
<br>        8 l+ h) }/ r9 a3 l) e2 H" S
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
, e$ v6 @8 X. e+ Q% Q  j<br>* }! j  W9 v# N
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
3 r' _7 D% C- t+ }% @8 ?2 {<br>, Z* E" K5 p9 L$ Y9 m$ F
<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>
1 Y+ s2 P* m" Y: X<script language="javascript" type="text/javascript">
* F; i) S; U; ], M) \5 t. m) O: D<!--2 v! ^* W* u6 ?1 @& `, a
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
2 s) a7 Y1 R6 e//-->+ a1 t0 ?2 M: s2 n
</script>