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

zw2004

<script language="javascript" type="text/javascript">8 q. q' S/ ]# j* T( c7 V
<!--; ^3 `$ }3 D* c! x" U( W1 t
// convert a single digit (0 - 16) into hex
9 f4 S! q7 C' jfunction enHex(aDigit)
: Y' x  K, t7 j) M{
- s3 k  D; J% q& n    return("0123456789ABCDEF".substring(aDigit, aDigit+1))* F: x* C; x2 L( y4 U5 p3 y$ V
}
. `; h% y& [& C" s5 l// convert a hex digit into decimal
; O5 {& A+ `. f# z9 ]function deHex(aDigit)
! y; B) H( E; h/ w{
0 F# f# ]2 |* h; [, r; i    return("0123456789ABCDEF".indexOf(aDigit))0 k+ N1 Z9 v, }
}
- x4 \# L5 [9 z% n6 k' Y% r* A1 |9 [( @
// Convert a 24bit number to hex
: n) H0 Q2 H) d3 z9 g  E8 p) afunction toHex(n)  _( w' [7 _, q5 m
{
) @" c8 R0 C3 T1 p; k, ]    return (enHex((0xf00000 & n) >> 20) +
6 @/ t. K) G2 u( r2 n            enHex((0x0f0000 & n) >> 16) +; f2 X$ G9 A+ W( [5 S
            enHex((0x00f000 & n) >> 12) +
0 Q. E7 K- Q- E, ?7 `2 c7 [            enHex((0x000f00 & n) >>  8) +& N, D' s; w$ l, k* [2 @+ ]; H$ |
            enHex((0x0000f0 & n) >>  4) +- E2 x  S+ d  q9 F1 u
            enHex((0x00000f & n) >>  0))
; V- h/ K" i: w8 [( B}* c7 p* }  N) m3 G
// Convert a six character hex to decimal( M- U9 q0 m1 l8 g
function toDecimal(hexNum)
( z) r& ?8 z0 X6 t: C! |, m: J% p+ s* G{
1 r6 h1 t, b: e1 {; u           var tmp = ""+hexNum.toUpperCase(), Q; y( a, {9 U" `! S
    while (tmp.length < 6) tmp = "0"+tmp+ Q6 P5 {( p  g1 M3 A- p: b0 H
           return ((deHex(tmp.substring(0,1)) << 20) +3 L2 P# S. i& m; e
                   (deHex(tmp.substring(1,2)) << 16) + - D3 Y" n& N. i% y- M7 }
            (deHex(tmp.substring(2,3)) << 12) +
9 l& ~4 }# `: k4 V; G" B            (deHex(tmp.substring(3,4)) << 8) +
( J7 k3 ?* J9 T3 X9 C* q- y  v            (deHex(tmp.substring(4,5)) << 4) +
4 h4 R# H+ H3 |, {3 ~' D                   (deHex(tmp.substring(5,6))))
1 h* l& M7 J7 r0 R}
2 ]$ _6 p; K- p. k6 Q///////////////////Shimmering Links/////////////////////% U9 H6 s, h8 {! y
//global variables
. X  v9 ]/ n* j& H- G% nvar hoverColour
% q8 y2 d% Q" S: K- s+ Xvar numLinks;
' Q6 y$ x: f$ b7 E4 W" ]9 k" ]var rate;  ?0 \* S( Z; N, s; I" @5 ]
var numFadeLevels;
1 b* _' p8 ~8 m3 n! @3 S" D& f( H9 bvar bgR;
  O. f# y& [& q, z, \, }' o1 m  _7 Jvar bgG;* r1 b9 r5 P- s
var bgB;
/ j* ]1 z5 j! S+ v- V; ]% {/ ]var currR;' x2 @* v" s- Z1 E  r4 ]9 Y
var currG;
+ H8 g# g1 p6 p; b+ y; Avar currB;
% r" M. T7 @( P4 n* @/ ]var count;
( ^1 n  o1 F' S- L: a' s; mvar fadeOut;
, @) U2 Z) B3 X; @# q  {var continuous;9 \/ U$ a; H, P$ x) X3 A# h
var newColour;5 }% a( ]+ A4 f4 w8 |$ V/ p5 F- |! F
var tID;% }1 g- p0 R, R0 x: F' s
var redInterval;
! }/ b! O! \) m4 n: A9 lvar greenInterval;
7 l; S1 E- `5 A, }8 B( lvar blueInterval;
/ l- `, y; \2 j; H4 j+ G* bfunction initLinks(mouseOverColour, numberOfLinks, fadeOutColour)( H4 w: O( m; M% `9 C  D4 X
{3 z- C% `1 |+ ^; e  V
        hoverColour = mouseOverColour;6 D! O; T+ F  }; c0 ^
        numLinks = numberOfLinks;. T- t: h! ^% N7 m3 ~. H1 H
        rate = 1;
( D! O& v, `! c0 W4 |7 D        numFadeLevels = 30;
5 x+ p5 U1 b2 c6 _        function initArray(theArray, length, val)
4 t7 _+ q" S" Q5 \0 a        {+ V' @  B. x8 D' |
                for(i=0;i<length;i++)
: e9 V) N/ l. H* U                {- t8 |6 f- n5 k  c: Z9 a
                        theArray = val;5 v* \- G" u9 g
                }* y% v: Q, o5 X
        }3 R' M: J  q1 f9 I
        bgR = '0000' + fadeOutColour.substring(1,3)- I9 Y) ]3 V! v, C5 T
        bgG = '0000' + fadeOutColour.substring(3,5)6 A! G* A6 `3 F* A2 L; _. F5 {7 P
        bgB = '0000' + fadeOutColour.substring(5,7)" R: F6 D* ~- w$ n
        currR = new Array(numLinks);* s* `: ^0 p3 D0 \7 Y
        currG = new Array(numLinks);9 x5 s$ [5 V( w+ Q6 E+ Y
        currB = new Array(numLinks);
% ~- _' Z( G7 X* A        count = new Array(numLinks);
. Y! {: K6 B! U& g* }1 {! ~        fadeOut = new Array(numLinks);
5 e7 Q6 U8 C9 Z  K( t8 M# o; p        continuous = new Array(numLinks);
4 ^% W/ |, h. h4 ~/ z        newColour = new Array(numLinks);
! k- M; v" x7 N/ a/ p# j+ e        tID = new Array(numLinks);, g5 n# E9 K1 `
        redInterval = toDecimal(bgR) / numFadeLevels;( {8 D5 b# S" P- W0 L) t4 N) r" }
        greenInterval = toDecimal(bgG) / numFadeLevels;- W! K- Q. d7 {* x/ C- x3 F! j
        blueInterval = toDecimal(bgB) / numFadeLevels;
3 p, S" `+ I, X* N        initArray(currR,numLinks,0);
& {) _6 N$ T2 _8 B: v! s8 w5 h        initArray(currG,numLinks,0);; j2 n0 c0 L/ ^# }1 j
        initArray(currB,numLinks,0);
/ @7 E8 c& K" R( {/ F1 }        initArray(count,numLinks,0);  B3 V, H. K! V* V+ a, ^
        initArray(fadeOut,numLinks,true);2 ?* V& C: t* |* h* I
        initArray(continuous,numLinks,true);! n* n9 ^% P. S) ~5 V6 ^0 v
}       
+ U8 a: r% _2 efunction startFade(id)& ?6 G/ W- w7 T( X, t  i6 t7 Z
{; a- e8 A0 G6 l$ _7 s$ C
        if(fadeOut[id] == true)
6 }! |# p: |" \: T7 ^! Q        { /*move colour towards background colour (increment)*/1 T9 h& o4 b2 Y' D
                currR[id] += redInterval;- ?1 m8 K# }; O" E& [) c
                currG[id] += greenInterval;- @( }( b  N% `
                currB[id] += blueInterval;
3 D! `( Z! k. x* V6 m3 v' b6 k                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);7 E- v+ G; r/ L" F& j
                if(++count[id] == numFadeLevels)
2 F) ?8 [$ B$ z# |4 Z) L                {
: @+ j/ D* y0 W                        fadeOut[id] = false;$ L; m6 u' R2 E" {! i
                }
& \3 x9 [1 ^- d# a        }
3 a7 [& \) q7 j4 s: Y        else# g* F3 L( h  H( I: b, R# B9 E
        {7 r/ V- _. p* _2 {, K
                currR[id] -= redInterval;
: r5 s$ ?2 O4 c9 R
3 |: d0 P/ |; ?: I                currG[id] -= greenInterval;+ @$ {! O$ L! B) f

( G5 ]$ e& i2 @3 E/ h                currB[id] -= blueInterval;* T( D) A" a8 V5 z/ ~8 T% l: `

+ N% w7 N# `" i: c* S; q) g+ V1 A                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);! D4 y; h" A! X& E
( R6 d+ D  N: Z, h4 ~& U. l
                if(--count[id] == 0)
* ]* D+ Y* U8 |4 ?1 F' Z
; b! d0 S3 c( ^                {
$ B6 h1 F5 ^& r, R5 |
8 C1 z' g; R' |2 D/ h                        fadeOut[id] = true;
  _+ Q0 h8 r9 U) ~. z' T' M/ h4 f4 C$ O4 y+ j7 ~. W/ D6 z
                }
* c# y8 ~7 y: U+ F  I; U0 S, Z8 s' B
! s2 Z8 l( c" q3 H( _' d+ F        }5 i) G2 I, T" ?" t" U1 Q( F7 b
* P4 y! @6 L  J% |, ^0 h
        if(continuous[id] == true)
5 H! R% H  [. W* B
5 ]  l, v: _7 C$ U2 q3 e        {8 o! E1 p+ i  ^+ e1 H$ E3 |' d/ z6 X
- {: H8 w: O! ^7 A) o8 Y$ q
                document.getElementById(id).style.color = newColour[id];               
+ i4 L, F' d' j
1 M0 G7 X. \5 |        }
: l0 o: \; `9 y7 u6 X, \) ~# [1 S% m
        else) _! a7 }' l4 e! ?% Z

$ e. o! `& _5 _4 Z        {* L0 U, n' c# E0 P* |

; u8 Z4 ?3 L& \1 H7 Q                document.getElementById(id).style.color = hoverColour;
( ]: W7 O$ |& z- x* X7 P! m
' W1 x1 T' q+ j- }        }
# r7 v6 _; G. I* d, v$ ?7 s; H1 u5 X7 g/ S, h: }4 `% _) M5 q
        clearTimeout(tID[id]);
- ]7 O# ?6 @/ i( [& O! E* u
# @2 M# K( L8 a* d) v$ Z1 |        tID[id]=setTimeout('startFade(' + id + ')', rate);
: ^1 \0 ]+ e1 D( F# u; J; s3 D/ G$ I0 ^% _. g
}
! v: T0 Q- t, \9 [% o! P. F& p  }* ]% y( r- y
function continueFade(id)! d* o  `- R9 w& Y  L6 l' f! k2 B

9 x3 v% k5 R. ^4 s" t& @) a{
; C# b( j: h7 g' x% C0 \8 H
9 _% F9 O" v/ ]- V$ o        continuous[id] = true;
% i+ x  R# g: i7 o4 N% V" M  k+ h5 K5 b) N2 m3 s
}
9 j/ L) x0 I4 m% x" F- l
& z, O' y' S) ]  d) V# \+ Xfunction stopFade(id)' r. A9 I8 w( y' q. w/ O

2 S$ ?  d* C: P' F0 b; S" m{
6 w7 ]5 D+ x7 l4 A; a( R# }$ y/ K& U) z: ?! J
        continuous[id] = false;! Q7 s7 {6 r: L1 N% r
$ h4 U6 g# Z9 ~2 F; `
}- u; j0 o7 p, z! d# w4 r1 F

+ q9 e; g  [0 o' Mfunction StartTimers()
; n  ]* }: M% j2 F3 q; a  ?  j: y& Y: H- [) u
{        //set up an initial set of timers to start the shimmering effect
" T, o" B% M8 G$ D: z5 G. r) ^
* X8 j- R& K2 f+ r  B  E        for(id=0; id<numLinks; id++)
9 L; ~- W4 O1 ?) _0 w6 [- k7 y3 H+ J( R0 D
        {$ d# O4 X& l( y& p- {

/ h& ~0 e7 f3 C0 l6 G9 \                t=setTimeout('startFade(' + id + ')', id*100);# _+ E7 _' K( O$ w
& s9 J" B3 {) J) P- k+ G
        }
; m2 [8 [$ i9 o" _7 X$ y7 C3 f' f# A( J" W
}
$ t  d6 f+ F* U+ l: o" I9 t8 L* }: x' m1 ~
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')* h# W- [" t! h

% _* C; c) g2 K' k) F1 hinitLinks('#FF0000', 6, '#FFCC77');
7 y) G' D/ i' ~( \2 w
  \# ?1 ]3 ?, B* X7 m! ]//-->
/ z5 F2 |* R) y& Y: @& ~3 a6 U( z1 z
</script>  @" D% U( H1 f% }3 `0 V, a2 s& {+ L
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元4 ^7 ^0 G/ u& i; _0 ^: r% x
</a>6 s9 A( W- B) ]- q7 n: y
<br>8 N4 k5 G8 u1 p" g2 ]6 I: z; P) X1 T5 o& _0 P
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>+ D) A8 D8 A- K
<br>
  n9 O; v/ O6 _) ]$ r. u; V<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
1 O" p9 @8 c9 D2 k8 l<br>       
6 B, Z4 L! `( m0 F<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
3 y, P: X. l! ?* @<br>/ }! c" x; x! ~+ s3 ?; f
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>$ Y6 T5 q5 Z. f$ c% M9 l9 h% f
<br>, P  f  p+ _% l6 [& v0 d! d
<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>
# j: }9 D: R9 [2 K<script language="javascript" type="text/javascript">
. S8 {8 d, W7 l/ }<!--
- E1 @' F4 H5 f$ ~$ Q/ e) D% wsetTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
1 Y1 A; Z/ }* V) b//-->* O; B0 [, P4 M# A3 z1 O6 i7 u
</script>