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

zw2004

<script language="javascript" type="text/javascript">, O$ f* o" b8 ~; K1 {
<!--6 M; N+ q4 P  U3 x0 @, |; x4 O; I# E
// convert a single digit (0 - 16) into hex
8 N: k: D! ^8 c3 e6 b& |- |function enHex(aDigit)4 C: E( I  Z6 h0 _7 R
{; `$ j! ]/ ~! U) j+ o4 m. T
    return("0123456789ABCDEF".substring(aDigit, aDigit+1))
1 b9 H  A* v# c3 }" z$ M* Y9 H}
  u+ \; i/ S0 m/ y// convert a hex digit into decimal
3 W2 t" e# C9 s# p' v" ^function deHex(aDigit), q# }2 {9 a4 T" a! `! T
{
1 {7 O' C: @1 Y$ ]+ N/ o# b( W6 Y. W    return("0123456789ABCDEF".indexOf(aDigit))) U, r  T1 l" b  ^
}4 j5 s1 t) S% q! u- ], e

  B+ g3 r4 O! i// Convert a 24bit number to hex
& w7 Y0 w4 j: P% H6 @& k5 Pfunction toHex(n)3 H  C; t" t/ F/ |2 h
{* y  J. n: U! |8 l) v
    return (enHex((0xf00000 & n) >> 20) +
" H7 Y. ~* L+ Z4 R$ M! Q; [            enHex((0x0f0000 & n) >> 16) +
+ y1 |: w6 l1 Q' f# m& Y5 M            enHex((0x00f000 & n) >> 12) +
+ B6 }) f4 M/ `8 M6 |            enHex((0x000f00 & n) >>  8) +8 ?/ G% {5 t' [/ [$ Y" T" V
            enHex((0x0000f0 & n) >>  4) +4 L% c9 E' T# D( f# t2 x: P
            enHex((0x00000f & n) >>  0))
' n8 x+ P) h. Z% M}& g; b. c* p$ m! P
// Convert a six character hex to decimal6 O+ P  I4 O5 O
function toDecimal(hexNum)
$ h  `) T# R) J$ u0 ~{
1 l$ M% Q1 B. a4 g, \3 R           var tmp = ""+hexNum.toUpperCase()
/ v! H9 [# h- I0 V- ]    while (tmp.length < 6) tmp = "0"+tmp1 U7 q7 d+ [7 V# I  k1 `
           return ((deHex(tmp.substring(0,1)) << 20) +, j2 E, O! T5 U, h! }& E0 w
                   (deHex(tmp.substring(1,2)) << 16) + : \* r# t) O, h1 x( U' k- n
            (deHex(tmp.substring(2,3)) << 12) +8 c+ e) h$ T5 \' f
            (deHex(tmp.substring(3,4)) << 8) +# ]" J; o; K, w7 `9 c1 T1 G9 Q* @
            (deHex(tmp.substring(4,5)) << 4) +" ?4 V3 ]. p( v# J
                   (deHex(tmp.substring(5,6))))
: s1 I4 p7 y! R3 \, U, `7 \}
9 i) ~3 |+ |5 Q  r///////////////////Shimmering Links/////////////////////% }9 ?9 F6 b/ d. v& ?- O) y7 ]' m
//global variables. w( g6 g" _: }
var hoverColour: o5 Q% I' _- e7 A4 f+ @9 x9 u8 ?
var numLinks;- N, k% }- }. n+ T& F" Z
var rate;/ D) \" I  W1 k% u2 A$ g
var numFadeLevels;
0 y* B7 d* a& W& E) ]var bgR;
  {3 l; R5 @0 K2 v3 f0 g* B' {; e7 jvar bgG;; v: M& A7 E5 m; \8 {
var bgB;* G( b0 p) ~; i8 T- r* [: J$ c
var currR;7 g# b3 g  s# b/ }. b/ w
var currG;9 N' b  b9 Q" s" `" E. s
var currB;
+ E' Q) w* S, B8 zvar count;/ L8 O, L- Y/ A1 N9 ~
var fadeOut;* V  c7 j1 x3 o; g& `& U2 q7 D
var continuous;: k0 h" Z+ ?: _
var newColour;- Z/ P: G( t- U3 R  y
var tID;/ p6 d/ ^+ y* g+ {* u
var redInterval;
6 w/ D* ~5 {$ |6 `2 T8 c& ?6 i6 lvar greenInterval;: ^9 G& V; @; }" U
var blueInterval;
# m% B6 r2 B1 ?8 {( F- W4 \0 Vfunction initLinks(mouseOverColour, numberOfLinks, fadeOutColour)% p9 ?; Z. m# _- r% V3 h4 G
{  u5 r8 a5 ^; ]8 N( U
        hoverColour = mouseOverColour;
4 H; q4 z% |9 G& m0 H' a0 ^. m2 b        numLinks = numberOfLinks;
% V& b' q, K0 j, ?        rate = 1;+ B$ t7 y% P% n8 O7 }& V
        numFadeLevels = 30;
! c5 N' O, |" P6 j. \* P- Y        function initArray(theArray, length, val)
  m  u; `0 M: ]/ ?2 m3 \        {/ s) `$ L) [% Q: b- e8 b
                for(i=0;i<length;i++)" g1 v9 \8 W# O( Q* b  N; E  |
                {
4 {) U7 I" H5 Y  Q                        theArray = val;
4 K$ O, Q$ v% S; p9 b' H                }7 O; k# h9 F' s: T5 o; Z; P# q
        }
) d$ x5 x7 I+ ^        bgR = '0000' + fadeOutColour.substring(1,3)* U& l0 s: V* _! l. |4 s3 k/ l$ f
        bgG = '0000' + fadeOutColour.substring(3,5)2 r. X% L% f9 U8 C: p
        bgB = '0000' + fadeOutColour.substring(5,7)5 T3 o: T" d* g9 l
        currR = new Array(numLinks);, f& z5 G" L; ~$ G, T. v  o: J$ K
        currG = new Array(numLinks);
8 q$ T1 |/ i: Z, c6 r        currB = new Array(numLinks);" e# J6 y% I6 T! q2 f& _
        count = new Array(numLinks);
) H) B" z& N. A; H" a# v( \        fadeOut = new Array(numLinks);
5 d& l& p: U. p3 B        continuous = new Array(numLinks);+ E8 f2 l1 j1 V/ n  P
        newColour = new Array(numLinks);
! I. m: G* f7 c4 L# j5 q# l        tID = new Array(numLinks);
9 w% {% z: j4 N8 y  `0 \1 g" v        redInterval = toDecimal(bgR) / numFadeLevels;
2 G; p* y0 X0 g- m. `1 e  s/ t9 I        greenInterval = toDecimal(bgG) / numFadeLevels;
5 z1 L7 x/ m) W( B- ?3 {        blueInterval = toDecimal(bgB) / numFadeLevels;- P9 F$ H5 e' Y- _
        initArray(currR,numLinks,0);( W2 J: \% o3 Q, x
        initArray(currG,numLinks,0);% `8 j4 f% Y+ b
        initArray(currB,numLinks,0);
+ u, w0 H0 x, X$ G6 o1 J6 n        initArray(count,numLinks,0);
5 ]# J: G) r; a! G. a" `7 s        initArray(fadeOut,numLinks,true);
8 w5 ~& {! u% Y1 m' R2 ]        initArray(continuous,numLinks,true);. @- C9 _/ b6 q. M; ^2 t1 n
}        4 ?8 i/ c  q" `* B# ^: b) d
function startFade(id)" S( d! O2 n  e- E' ~
{
" o- z* N: Z/ _( A* [        if(fadeOut[id] == true)
$ y$ I2 x, A1 `& R& |        { /*move colour towards background colour (increment)*/! c+ u/ c% t5 B. O- e1 j
                currR[id] += redInterval;9 V3 @: C. z5 C! s4 B
                currG[id] += greenInterval;7 g4 S1 {; i+ T% V
                currB[id] += blueInterval;% _+ J, ^9 G  I3 i1 o+ Z
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);5 H$ X/ u4 w& u' m4 _9 @5 f
                if(++count[id] == numFadeLevels), ~! Z+ B5 b1 v" t. U
                {
+ z4 G! n1 }$ c                        fadeOut[id] = false;% |  c3 r/ U) H" b, E* c7 B
                }
: |- c1 S& M* U1 r        }  z( N. A6 |' ]7 C
        else
# U% {" b" n# S8 X. o, d        {
+ e: n) G2 Q  u, B& r7 N                currR[id] -= redInterval;+ l, r1 f' N; y+ a. h

8 n7 S# \# P: ^' x+ _& M8 g* _8 c0 e3 s$ h                currG[id] -= greenInterval;& m$ ?$ V3 ^; u9 ]4 P2 x- @
5 j0 Q' w5 K( O. d$ ~
                currB[id] -= blueInterval;
$ m. q# J% C. I3 z8 D# q6 [8 {) M* f8 a2 r% @: o
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);/ w+ |5 n* Z* j/ ~; w

, u1 u5 H% K' L0 K4 L                if(--count[id] == 0)  h$ u3 K" y) @3 ~: F+ Y& M

$ |8 E8 H% o( s) Q$ O: I                {
1 X* D. Q) Z) |, y& X7 s6 H, v. o  b" `( M: @4 t
                        fadeOut[id] = true;! a: n# m; t4 v
. _( E  J& j# O+ Z7 c" t
                }
* ]' v0 i7 ?. \! k' m) q6 ?
8 r& ]! v3 u3 j        }/ Z( ~4 Q$ v& h4 v- P0 ^8 C/ P

! s) K/ l2 `! B- l% [        if(continuous[id] == true)
8 j+ q4 G/ `( e) k0 B9 @" t
! C$ U  @4 W$ }# e2 A# E2 v        {
1 X4 a. m' ^# D2 a0 a
- `. K7 ], R! R. D                document.getElementById(id).style.color = newColour[id];               
" ^6 O1 i9 I/ g8 Z) V6 n* O+ T( ^4 r4 m/ X% Z! Q
        }  ^6 c, {* }- ]
0 j' j4 u0 }' X: v4 r
        else' ]( A9 H  z7 V+ z% r& c  R

: A  h1 z5 @+ {7 [5 ^; ]7 ~8 C        {/ A3 R& E- ]; d" y
3 y) d3 ~# U: B2 `% A$ j
                document.getElementById(id).style.color = hoverColour;& H2 q0 P9 r/ c+ |

7 B$ w3 M* _8 H' d        }( |; P/ p* |3 `1 ^  X1 T+ G0 t

6 k+ M( @- L: K5 Q( S) \0 W        clearTimeout(tID[id]);( \' T/ g% q# Y  z' z
  C2 M: o6 q# Y' h4 W) s' ]- j! `
        tID[id]=setTimeout('startFade(' + id + ')', rate);8 K* j  n1 W* l" _9 ^1 U5 A

# q( x" C9 D' e* _}
* E( l9 `6 z' F$ C6 Z  {# p3 Q; y+ i
function continueFade(id)
& @! Q8 }6 Z9 A- c% U/ ~1 f+ d/ T: V, E% u- ~3 }7 w  T
{
! f: T! I; k/ y4 t8 D1 U% D, p; U- x0 [3 Z- p7 R! t0 ~
        continuous[id] = true;
6 a) E8 h9 Y: T) I  j, b; j6 K7 u) E5 J- l+ H6 A0 q
}6 n# I. D- t) v
- D4 N# i; \/ m- s  d9 H7 t/ U
function stopFade(id)
  A3 o* z! ~, p5 C  W
) k/ r9 `4 Y! ~# `. X( [{
- o/ e) q! u$ y0 w4 H$ @: P4 V/ n
        continuous[id] = false;. t9 d9 t; O& J: M! X$ `5 {
% a& y( }+ H2 j* l3 h
}
! r& T5 `& |8 b2 T. r2 Y" e
4 X4 F5 I$ x5 ?% d0 x" Bfunction StartTimers()8 y: {8 w" P0 z  `

+ m' j0 x8 M" T& g& u4 m{        //set up an initial set of timers to start the shimmering effect: D" o- I/ j# R7 _5 R
0 N  u" m% w7 e. Z. ]
        for(id=0; id<numLinks; id++); S0 p, u' c/ V
8 m/ t9 c0 ]8 y* _0 e. R0 X" S
        {( G- Q1 z: J5 W7 b
" G4 b* k8 m" u1 {5 `
                t=setTimeout('startFade(' + id + ')', id*100);1 a& k; H2 n" @6 I) c6 H0 l
  `, p% O( e7 q. j* A5 Q; Q6 [
        }* o* C1 Y1 ^% R$ S9 o
. J7 e9 O! @+ |
}
7 a7 y! {# j# E2 m
% H& h) Z" G: E. }6 \; S" B- d//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')4 ^# U1 E0 w5 S% @" }

5 F( X+ V9 N/ L; j0 G/ c( {initLinks('#FF0000', 6, '#FFCC77');
0 Z* C9 g& a) f& c0 L3 C5 E' Q4 O- |; Q, z- q
//-->
" t: I1 j, z2 z: D9 _2 X- Q
! }$ T4 ~# Z- w( f( V</script>
; k( m4 w% t# y<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元
- O9 v, E7 ?0 F# u" r; T5 L1 @</a>
  i1 G' d3 t  {( Z; @: ]<br>" ]! n/ m7 h- y( W
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>
4 z% ~$ f7 |; e  D+ g* M<br>
" y& c! P7 X+ q2 `* b/ L<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>  l/ P: |4 v. d2 k
<br>        ) {3 B6 R3 e! P: ~- C0 [* t& f
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
& C7 S9 Z$ A' U<br>- X, }, P' Q& G3 Y: l
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>9 K6 [4 Y0 A2 a5 U5 i  r! a; X3 w
<br># [3 z: A& b. k. F: H
<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>
. f# G9 X! J$ t4 q) x7 a& K<script language="javascript" type="text/javascript">- j+ M& \5 p; [, \) R7 b; |
<!--
7 K: r: `/ M) g, E3 |setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering3 Y, j4 x7 {# ^9 T4 K. o
//-->3 X3 ], t( a: D$ Z- t' ]% U: {! R7 r
</script>