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

zw2004

<script language="javascript" type="text/javascript">. m" B2 O1 g: E7 I) Q& T
<!--6 D% [- H! H0 a; h, i1 P/ A) w
// convert a single digit (0 - 16) into hex" K3 E" R: I) u2 e! m' p& n
function enHex(aDigit)
* u6 e- j. ]. r! x8 R; P" Y{1 K4 e/ M5 |/ i! |* J+ r& {
    return("0123456789ABCDEF".substring(aDigit, aDigit+1))* m. @" l. M. |* M9 M* M- J
}
& F* D( A5 o: T* Z3 L+ p, W1 d// convert a hex digit into decimal" K4 G: R  z0 {( O8 H* H6 Y- v5 S
function deHex(aDigit)% K& c. j0 y& N& A2 X. d* O; _8 @
{. d) O/ E0 N& x( e
    return("0123456789ABCDEF".indexOf(aDigit))0 u2 s/ u8 G3 K, J9 D
}5 `, E8 ^2 X1 S/ I2 E& Y

  M3 l, N# _  `" D+ r- z; @// Convert a 24bit number to hex
" K0 ?" R  K0 |% R" [( {function toHex(n)
8 y8 N, n8 t  B8 c' R{
0 O# T# I/ W, S7 d3 Z' d+ j    return (enHex((0xf00000 & n) >> 20) +
9 R- M( \' s6 W  b8 H! J+ v            enHex((0x0f0000 & n) >> 16) +
7 G0 h. I, g* Q# }! G& `            enHex((0x00f000 & n) >> 12) +
. j  h- t8 c  c# x            enHex((0x000f00 & n) >>  8) +
$ G( z% F3 v/ _; |! B) R            enHex((0x0000f0 & n) >>  4) +
! k% m4 c# Y/ b4 h# t            enHex((0x00000f & n) >>  0))) B* O' C1 ~2 k, m& e1 @
}
" s$ s) O% i& O/ t0 V2 V// Convert a six character hex to decimal/ }0 V- `' Z9 w3 D1 Y
function toDecimal(hexNum). \5 M  ?: [$ }: {) V4 j( J
{+ _9 `! o2 t# l! C7 C
           var tmp = ""+hexNum.toUpperCase()3 Z; M7 N! E- l9 S
    while (tmp.length < 6) tmp = "0"+tmp) n6 d; t( `/ p( `( l
           return ((deHex(tmp.substring(0,1)) << 20) +6 n2 _. j* ?  D( i; x; i
                   (deHex(tmp.substring(1,2)) << 16) + $ {6 Q' D9 d9 u! a+ s0 |
            (deHex(tmp.substring(2,3)) << 12) +0 \+ I- r& j. Q4 Y' E2 L: u
            (deHex(tmp.substring(3,4)) << 8) +
5 l! s+ p6 c- n# t$ p            (deHex(tmp.substring(4,5)) << 4) +' \0 S0 ~: \' c! W
                   (deHex(tmp.substring(5,6)))): E0 K- b; D% e& P' D$ I$ j
}0 o/ ~5 c# g5 X% B
///////////////////Shimmering Links/////////////////////6 i  o+ n6 u" s& G
//global variables
' H! [; D1 g+ v6 ]6 g- P- rvar hoverColour/ H. i5 T& b, _/ ~6 \; q
var numLinks;7 c: \3 a3 r+ {$ i" a
var rate;  |4 O( y1 \! _/ Q* U; G
var numFadeLevels;
4 g! J8 f) g2 B8 o, ]var bgR;
9 [/ k2 m" X1 h0 y/ F+ tvar bgG;) ^, S- ~% n( u/ F
var bgB;
0 ^, ]2 j0 I# ]3 t3 lvar currR;
6 e, @/ P1 z2 z3 {. S" M- j8 Ovar currG;
# q0 B) S  M6 s  t2 }/ Kvar currB;
) y/ t8 h) l: p+ Y* g/ Q: f8 ]# ]& `& jvar count;& v" j# W4 O% O& Q- ~
var fadeOut;0 f. C/ K" p' U% Y# m4 N
var continuous;9 ~; L) Y5 w: k
var newColour;
. ]+ o: n! T" {3 ?var tID;  j/ F/ d3 a, n; Q7 y
var redInterval;) X* L3 h  L. p; v# V
var greenInterval;
, E' U9 M! b7 u2 z# G9 e% Xvar blueInterval;
7 V1 x3 U- \# Z9 z& ]5 cfunction initLinks(mouseOverColour, numberOfLinks, fadeOutColour): G# F  K  |3 B0 ^9 i6 a3 O! y1 ]) u9 \1 O
{
+ @9 C# N) g( b( z5 y" W# e        hoverColour = mouseOverColour;
5 S' h' g: d$ o3 Y        numLinks = numberOfLinks;
: U8 W  B8 i# b* ~0 X9 s        rate = 1;2 n& d, x/ O$ y4 u- _
        numFadeLevels = 30;
. x3 B9 F2 x3 \        function initArray(theArray, length, val): q! D& F3 `* H" S  Z/ n
        {. E( B! s8 S: I% Y  i% f, F
                for(i=0;i<length;i++)
2 w9 E1 {7 t5 i: ^) X' f                {
7 \7 q% g8 E3 ?/ w9 y7 }                        theArray = val;
% g3 Q6 d* s- f                }
- ]  X0 K$ h# {4 m/ Q* o/ j        }
0 c% ?& h4 f' `        bgR = '0000' + fadeOutColour.substring(1,3). i# }7 u& o+ s
        bgG = '0000' + fadeOutColour.substring(3,5): P) K- e2 s  c- b9 E) y% Y
        bgB = '0000' + fadeOutColour.substring(5,7)
1 v$ F- F9 M/ y- }% {; Y        currR = new Array(numLinks);" [4 |; K* {4 ^6 E& o6 o$ O- i$ W
        currG = new Array(numLinks);
2 n; Y3 ?7 N9 i        currB = new Array(numLinks);9 W# B4 n3 w) v
        count = new Array(numLinks);' ]) c4 ?% J1 \+ L& z
        fadeOut = new Array(numLinks);- f/ Q5 k9 }% v  g' m
        continuous = new Array(numLinks);
; S5 R' K5 o2 e" h) X) ?' t- A        newColour = new Array(numLinks);. ?) t6 C3 U5 ]9 M1 A# b
        tID = new Array(numLinks);
* s7 X4 _, o# Q) ~9 w' v! S        redInterval = toDecimal(bgR) / numFadeLevels;
+ F6 O# Y; t1 W) q7 j        greenInterval = toDecimal(bgG) / numFadeLevels;' R. z9 [3 p* I4 G$ f
        blueInterval = toDecimal(bgB) / numFadeLevels;  z$ u0 n8 f- u6 L" V
        initArray(currR,numLinks,0);* s' W: F5 h0 ?0 ^% A5 S
        initArray(currG,numLinks,0);
, V- I* `/ }) `$ H, \% ?3 {; N, k( E        initArray(currB,numLinks,0);
% K" U4 S7 r' M" H        initArray(count,numLinks,0);
; U2 q5 x; _$ G4 L8 l1 W0 L' l        initArray(fadeOut,numLinks,true);6 V  T# B4 m4 k9 {( O8 ?: K4 o
        initArray(continuous,numLinks,true);
! E7 J1 G' I' ^+ U! M9 {}        - a/ I+ N% u. B4 Y& t5 Y$ J
function startFade(id). m4 {. N! g0 ^  e/ e! N
{1 }; p4 W1 E9 m; X$ [9 t1 e+ |
        if(fadeOut[id] == true)1 R( U, e- D" X4 f& q1 F
        { /*move colour towards background colour (increment)*/' |( D( a  \1 G' m3 d( d
                currR[id] += redInterval;
0 z. T. q/ x7 d  v% `8 V                currG[id] += greenInterval;
8 ]1 @. M. Q2 q  H' c! d                currB[id] += blueInterval;5 ]- m" N( S" E- [0 F
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
- i3 U- x. I5 }; B( [                if(++count[id] == numFadeLevels)1 |" P: ~8 L. ?1 l
                {% \( P" ^: B0 H( G( [* z+ v
                        fadeOut[id] = false;
" J: \& c; r' @& Y1 e( i% w                }
) \6 x6 X) X4 S! x$ D        }9 b1 F: e, Y7 A
        else" o# A3 u# g6 Z
        {
3 l" v2 N  N) I0 F; y# |2 B                currR[id] -= redInterval;
. G# W: B8 n/ K; |9 q2 J
. H1 P6 f* c! ]( ^                currG[id] -= greenInterval;
* |6 O7 z' K/ x+ z: N+ Y7 b2 d6 N# R6 h$ B* U/ T3 M" m" Q) E
                currB[id] -= blueInterval;
3 h1 g4 f" s9 j: m4 A) q5 X7 C9 H& `, U" @4 ~1 f
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);$ Q. r) ?5 ?. I
' L8 g- E4 n% |' f7 k
                if(--count[id] == 0)  d9 t  g! K- X
3 W0 D0 s  B0 v4 e9 U) `: g, f
                {
  t/ q* g' Q( p" [: b" S8 r4 M$ R$ t  R" g4 ~3 ^
                        fadeOut[id] = true;
& [/ U6 W+ t9 k
" X& z: b0 F1 v! C/ s                }1 J: W4 ?, I$ ?4 k+ z+ |

7 [; |) {# L; @" B        }
/ t, ~; h) f. t' d! R' q: f9 O2 d. a% S5 t! G! {
        if(continuous[id] == true)9 C: n$ D# d, U% t
6 R: H" P1 g  z. U
        {
9 [# q" ^+ D( o! U& c
/ t6 ?* ]6 w) T                document.getElementById(id).style.color = newColour[id];               
% x9 g+ ]6 ^0 [! D" V! N7 h% Q8 ^; v4 z/ h7 l8 f2 q5 {
        }
% ]. D' \4 l, u- @5 i9 @
7 {; Q* g8 t8 j2 @, R. {        else
8 g0 N4 \3 K. X0 V9 ]  N& e1 L1 {7 @7 I
        {
+ b0 T9 p9 x; |: V& ]# l3 \/ d
4 N3 p2 ]5 e7 k/ H                document.getElementById(id).style.color = hoverColour;) Z. k6 B5 I: `* r' m
/ z6 K7 A' H. t/ W0 {
        }7 v$ V* Y5 {& y1 A2 D* Z1 j1 e+ c, b

* c+ Z+ D* N, D4 k8 }& V        clearTimeout(tID[id]);/ S2 U% H5 a, M" W

; Z( Z; `2 g9 P        tID[id]=setTimeout('startFade(' + id + ')', rate);0 u# m. {4 |4 V* @2 w

  Y4 E" _& j% ^! E1 O& L! E  |}. p! `3 G" l  t3 H( n2 y* E
8 d( Q9 |) R- Q
function continueFade(id)2 Y  O" P* S& B" N: g

: a$ K( Y$ p  I{( x  m3 z; }' `
  B0 B& z3 [, n
        continuous[id] = true;
% a) S3 D5 h$ k' @1 B- O! q# I3 I" \. _
}
/ o5 a; A9 ?8 ~1 L  ~% t  l
  K6 `, ]" k( d' D( ifunction stopFade(id)
( F9 |/ c7 ~6 {+ i5 [
6 ]# N$ q$ F8 N{
; [  o3 |6 q6 `/ C0 m, e
, @3 V( _  R) g: {5 n7 z* \        continuous[id] = false;8 j! e, J# y% y

* F$ ~/ L# b! O' y# ?2 b}6 [1 u' {6 T: \; }

" p# g8 u# W- \1 hfunction StartTimers()! c4 Q8 a( }/ H  O) [
( u' I& Z0 w9 t9 ~
{        //set up an initial set of timers to start the shimmering effect# r; y) I8 m5 P- L9 R& p4 v  l4 d

' R" E4 V; M! _- y/ {+ q/ y7 L- q        for(id=0; id<numLinks; id++)" U6 ^- F7 x7 T% n
6 [. a2 U/ E* R( S" p5 _
        {# c; I* b; W: c9 O) X+ h
& t3 f" [  d  ^* g
                t=setTimeout('startFade(' + id + ')', id*100);
8 p" T' g$ d* C0 h% N
: j; a! q2 Q* ~3 u2 D* Q        }
0 R  F: @( n3 K9 k# z- p1 F8 p6 m3 U1 G) j2 T9 |
}
! a' V' K" J4 ^( a5 x" R4 k+ K7 D' s
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')% N1 o. Y; M2 s8 r0 O6 U# K; [
- }9 V) z4 N9 {3 l1 M' l4 V
initLinks('#FF0000', 6, '#FFCC77');
( T; c$ z9 @5 f& p3 T8 \$ j
. Z! S! P: b/ t4 q//-->
4 q8 k" x" v! E7 |! s$ a% G' I% W! m: ]; v9 J
</script>. \) X( c/ j! L4 o( E
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元
$ e; E# S9 F, `  T5 D9 A</a>/ w/ c1 i4 E5 s4 K, \
<br>5 s4 T( s9 W, I1 [; ^. V
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>8 m/ C% W  D* e
<br>
& `: t( U/ m$ @+ i# y: u<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>: I, O* v; S$ Z- \: d- j
<br>        ; e" A# i( \1 D% ]
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>! D  z7 k/ R2 t+ N' ^7 ]' t
<br>9 b$ ^- ]. q; s0 E' `/ g
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
4 Q9 n+ {; Z% v% B<br>& V  S& C( S5 y& j- Z6 R  f' J6 o
<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>
& m% P- E2 T' u; i' q: }<script language="javascript" type="text/javascript">
" r7 I0 T* P0 C3 e7 `  M<!--
& ^$ X. P2 I7 M) J' {. TsetTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering! O* h+ Z4 e5 E' v- F) h  N
//-->$ I+ F5 O8 n, e6 p) c
</script>