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

zw2004

<script language="javascript" type="text/javascript">* q( N( O! w, E% _+ A2 O
<!--
- m7 j8 M  _2 M6 {// convert a single digit (0 - 16) into hex7 |2 S1 {# l3 v
function enHex(aDigit)! ~  r# P. w2 z# ]
{
6 k7 k! ^( Y8 \. d0 w/ O    return("0123456789ABCDEF".substring(aDigit, aDigit+1))# c! T0 H; h6 H' O: Z
}. |# A8 y" |7 ~# ^) @
// convert a hex digit into decimal
* e- M0 M/ K$ M- O& F4 \function deHex(aDigit)
6 _2 l# f2 N4 k1 y6 t2 V{# `1 ?" Q1 I7 B
    return("0123456789ABCDEF".indexOf(aDigit))/ s- v/ |! k+ J# {% a( X) e: r% o
}
: V; Z# U$ T  x9 }# D) L3 F7 [* Y, N0 i' E8 _* w2 f9 \
// Convert a 24bit number to hex7 k( Z- ^: n! e( S
function toHex(n)
/ v' f* ]; T; [' a/ v{
- C7 n+ h5 O8 K: r6 w& H3 b7 ^6 R    return (enHex((0xf00000 & n) >> 20) +
9 ?0 }& x! [  [7 Y            enHex((0x0f0000 & n) >> 16) +) P. y5 a( l/ O, v" x) p
            enHex((0x00f000 & n) >> 12) +
% k( w6 X  V  _( J            enHex((0x000f00 & n) >>  8) +1 |/ f8 Z9 s" [/ _
            enHex((0x0000f0 & n) >>  4) +
1 G- D2 W. @$ o$ J8 I: O& j. m& K            enHex((0x00000f & n) >>  0))
5 W5 s# P* y- {7 M& e( ]}4 L: Z, b9 e$ S
// Convert a six character hex to decimal& P0 P9 T# |) d; e9 r2 e
function toDecimal(hexNum)
5 y5 o* P' {0 p  R+ U1 b{
: M9 |- z% {* h  A           var tmp = ""+hexNum.toUpperCase()2 B, {9 Q+ h: T, W. v* E0 r& r0 C$ x
    while (tmp.length < 6) tmp = "0"+tmp1 n8 o+ f/ r6 h, E# k
           return ((deHex(tmp.substring(0,1)) << 20) ++ M( ?- ~! g" {4 m9 B4 j) X- H
                   (deHex(tmp.substring(1,2)) << 16) +
1 Y0 @* I" a: H0 i4 b            (deHex(tmp.substring(2,3)) << 12) +* ^  L& e; _1 |0 e& ?
            (deHex(tmp.substring(3,4)) << 8) +6 h$ F( K* |7 T! I
            (deHex(tmp.substring(4,5)) << 4) +
3 t/ Z: e+ ?4 w, _. P* j                   (deHex(tmp.substring(5,6))))7 L, Q3 j6 c3 m- O: a
}, {1 m  o) |' R; j0 b
///////////////////Shimmering Links/////////////////////
. i6 P1 [( Y" N# q1 i* w% P5 e//global variables1 n! t% u- M% \9 a" E( c6 A0 j
var hoverColour2 b# {3 t0 }9 k- [$ D
var numLinks;
7 S+ f% t$ k- E5 Evar rate;
" z, s5 p+ h; x/ d  F* F! svar numFadeLevels;
$ N% b3 |- z# S5 M; C7 Z# nvar bgR;
$ S5 h: }& d8 a) c0 x8 D3 Qvar bgG;. u1 Y$ a8 C6 o; }# |$ e
var bgB;
4 s  E( C6 H+ k' n6 j1 Ovar currR;: e2 T" d7 @9 J; ?6 }( A7 b* d
var currG;1 _( k$ t0 U: |4 @) f
var currB;
+ t( J1 d5 D" a" mvar count;* s/ R* X$ X; D( H, P# ]7 f2 P! F
var fadeOut;+ o+ O# j. j, m6 [2 J
var continuous;
& u. P6 ^0 c' L) svar newColour;
( s. P9 d/ z) ?2 v$ Wvar tID;4 `: t: Q/ g# W/ w. }. L7 A; ^% m
var redInterval;
) @7 P3 I5 M; p, F" i3 t) m: ?; Tvar greenInterval;9 f9 B/ h7 `: p
var blueInterval;, r6 c& x8 p+ Z
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
, e. Z+ C& _! L& o2 D{) N% S) y5 R+ f, r4 i0 I
        hoverColour = mouseOverColour;
8 F1 o) |$ `2 }+ k/ U1 d        numLinks = numberOfLinks;+ n  }' R' O  {' g+ Z0 R: Y
        rate = 1;: Z5 g7 S+ W' S8 o
        numFadeLevels = 30;
+ C/ g6 T0 w. D$ {3 j7 A1 T7 T        function initArray(theArray, length, val)6 N8 y; M4 J6 @( E/ d9 o
        {
6 q( I8 ~8 v3 s                for(i=0;i<length;i++)
$ S# O3 o& J4 j4 g, V                {4 S; c/ O$ m! _3 W% {
                        theArray = val;; }8 K. {" t- D' ]8 E. p
                }
7 l  {" [: y! _        }
( z& l1 k6 c+ q' r( h% \        bgR = '0000' + fadeOutColour.substring(1,3)( [" \: ~: j  ?& n8 ], h3 b
        bgG = '0000' + fadeOutColour.substring(3,5)
3 f+ ]; S3 e* A: _3 u0 o5 m        bgB = '0000' + fadeOutColour.substring(5,7)
+ I: R( Z0 i- p) a3 ]7 A  B        currR = new Array(numLinks);
' x+ Q0 V0 Y. j% w        currG = new Array(numLinks);) ?, ^. {, T  _* M# }& X5 U9 i
        currB = new Array(numLinks);
  Z; J! [8 v* O" S9 x% n9 N        count = new Array(numLinks);
, I7 U5 q3 o4 k& A" _: b% @  g9 U        fadeOut = new Array(numLinks);
' c* Y5 E( l3 g  p0 Z/ w) m* b        continuous = new Array(numLinks);
! b% y! D! [2 W) {7 e* N        newColour = new Array(numLinks);
" p" y' m0 i' L+ @7 d7 x        tID = new Array(numLinks);! H( u6 A2 d% {  K
        redInterval = toDecimal(bgR) / numFadeLevels;
' j& n% k- T9 o( R. h        greenInterval = toDecimal(bgG) / numFadeLevels;$ [/ I" b4 }* h9 e# ~
        blueInterval = toDecimal(bgB) / numFadeLevels;- b. {- Y' {2 G5 J, L
        initArray(currR,numLinks,0);; ]( y1 Y( M! J) ?
        initArray(currG,numLinks,0);* t- I7 a8 _3 i* [0 P1 O
        initArray(currB,numLinks,0);- c; e  A, n2 m. p
        initArray(count,numLinks,0);- U  @. K: M1 d8 n9 M: Q
        initArray(fadeOut,numLinks,true);
( X1 ^. d' I4 v" g8 v        initArray(continuous,numLinks,true);& j* a3 ^( W+ k* I/ ~4 @6 [
}        ; A9 z- e2 I; f
function startFade(id), O- z! E' \% T1 T) ~
{7 z! ]) M  j1 t0 d. e8 D9 F$ G
        if(fadeOut[id] == true); U9 i' M! i1 F" D3 j0 S- A
        { /*move colour towards background colour (increment)*/
" m% j. B/ Y4 Q8 s8 X* p% z                currR[id] += redInterval;
4 z; [- R) K$ b, p/ S% I6 M% ]1 H                currG[id] += greenInterval;
2 s3 g( C, g6 F; L                currB[id] += blueInterval;
5 t# {8 _' z9 T3 g4 a                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);6 ~) k7 p/ Q; `: S/ D
                if(++count[id] == numFadeLevels); _* O3 p5 }4 R! Y6 ^5 ?4 R
                {
3 X2 a1 z; n4 A% e8 U8 N9 t                        fadeOut[id] = false;( N$ f1 ]. w8 X) s
                }
, m1 E2 k# l9 U8 f( A) l' V        }
* g9 P5 I  S( `! j" a        else8 c  D8 I- l/ @
        {( Q% q4 _! H: H1 W7 m) \% y; p
                currR[id] -= redInterval;) @2 d" h1 n; o8 d7 `* o
2 W6 b3 ~, l6 Y- [: F& r
                currG[id] -= greenInterval;3 n) ~; }& ?5 e  C0 z; y

& N  d. g9 B4 g: }/ a                currB[id] -= blueInterval;1 B) h$ ~, d; j/ v) ^

2 A1 b+ H- c- R$ d& h- W                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);! g0 J9 H  x" }1 G3 S

: k  d& v. g; M% R1 S                if(--count[id] == 0)
4 N' z0 Q* Z3 w8 c  ^! j. w1 _$ I0 a0 w" U0 {7 G8 B8 K% A
                {
7 p4 [% j& C" b7 k$ V! K* P  ]; l4 b4 \
                        fadeOut[id] = true;; p* O5 B6 Q8 g% ]/ P
* s! U, s$ L& m( [
                }" _2 A' K. g! J/ Z. `3 `

8 P9 p+ e4 k* d" Q! I        }7 A" @& Q* I/ M$ O- @& _1 H

- w0 B" y# b3 F5 K4 Z1 T        if(continuous[id] == true)
; _* f3 _4 p4 J' `1 o5 V. p6 K3 @& d' Q" c/ h$ ]1 v0 @7 c1 M
        {
- z, e5 b+ b  j5 ?( |9 D
  ]; U2 J  _, ?( @                document.getElementById(id).style.color = newColour[id];               
- o$ D2 X0 G% R2 a+ a6 b0 G3 c, x( Z! l! s5 T; m
        }  B: f6 z, r% A# a- j8 _5 ]6 O& {- S

+ v2 ~/ Z0 P* i0 p" j- H2 z  O        else/ A# \4 l$ p8 s6 h6 d4 j* F

8 d6 [& [4 C/ |) m0 B9 U( w        {4 n" W% a% `  v. M

* i4 T8 L/ o6 ^( ^/ U: A, ]) \                document.getElementById(id).style.color = hoverColour;
9 b' D( S3 @# W" Q0 V/ X2 [4 d% g! u% n9 c/ }6 E) s$ D  w
        }, c5 O; b: X2 W1 E5 @
% ^# U; j( N# ]) F# R$ B7 I
        clearTimeout(tID[id]);
, l2 w) C1 z' g0 C# V0 \9 a' d3 H' Q3 ]% r
        tID[id]=setTimeout('startFade(' + id + ')', rate);
( |# e0 c- r$ z# Q- i8 }$ J+ X1 \, M( O+ u% r% f* O
}
' F) q) t) I" {4 `5 ?. G' l' j( O0 C% h( _/ m) {6 T. B
function continueFade(id)
% _% |3 j5 P7 |1 K( ?  @, O( C/ E6 T. M+ d" Z( D
{! Y4 {. T8 `9 S& h$ |

/ s( P6 w9 q3 a, Z& s; e# Z        continuous[id] = true;
2 w" v/ ^4 i% g( p  I$ h, R- c3 e
# c/ d1 ~* K0 G+ v# T}
$ [% n; H) S, Y9 I' L0 H& r3 [0 W  {( o8 X) m1 ^! R& K
function stopFade(id)
) g, P: L6 f7 W
* }: T# P6 P# G# V! f" V{
$ }) b6 d5 k3 R  H; `/ X) `
, H2 t5 I+ J' U- G" M        continuous[id] = false;
/ `6 M" c( s& n0 @: @- x& \; e- P3 b  i. }: R5 u3 Y0 ]9 z& A
}
3 t+ S2 X( Z6 \8 n$ q6 t! M$ M4 C& @  F' H9 C
function StartTimers()
: D) k, N" z' U* b7 b& _
0 E* p" s) U: t3 W{        //set up an initial set of timers to start the shimmering effect
5 I3 d, F# ?4 n! B  B" u$ [+ U
% }1 g( @* ]$ l7 S2 s. H        for(id=0; id<numLinks; id++)
# y+ B  @5 _, @+ X6 m3 Q# h- [1 b+ |& I1 ^: a+ k& S5 G; _
        {" y( |- b& n$ |* u- z+ t4 n1 U
) k! b  x8 G5 E# h4 ^3 d1 i5 ~
                t=setTimeout('startFade(' + id + ')', id*100);
) P; m1 S, U7 {6 K2 l
" j% f6 g  \1 b7 O        }$ ?* q0 [9 ~3 V9 R" Q

' w2 W- w' ~, b7 ~4 n}
4 J& Z# {5 P% U7 @
& t+ G. d# f1 ^* Y! c. T//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour'), H+ [' q: I2 G, i

5 K0 g+ F$ V% _$ L% W! UinitLinks('#FF0000', 6, '#FFCC77');
- l! |" `* N: n6 f7 \; {1 w2 j" Y$ b( m$ U
//-->  C1 }0 B) a9 y( {9 Q5 z+ t

: j+ ^# o+ i6 ~% K; [; w" d; V</script>4 i* S. y( H! F+ M" t
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元
6 {( x# A+ H( E% b# I9 U+ k* \</a>9 Z$ d. X% K$ U$ N1 Y% i7 x( P. [$ y
<br>
0 e- O3 T2 E- F9 J4 W<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>6 r# v3 a1 ]! _$ y! Z
<br>7 `5 g* b0 Q9 y; i% l  c# g, R
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
" C" H+ G( n5 t2 Z! Y<br>        6 B5 x% _5 f1 @0 j
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
% J9 [; q& ]2 U. r<br>- H6 ~, h' D, S4 Y+ Q1 m; @# k+ a
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
. W, m( j5 O; |  S/ i& B8 Y<br>
! {8 b" o3 ?7 x<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>5 c2 H+ Z& c' L; _! c* D
<script language="javascript" type="text/javascript">! e! |0 ~4 }/ W% S% M# }# j6 @
<!--
& |3 C1 ]' W5 F* F, ]# E0 i1 _setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering2 u$ j% N/ V" J- S/ N
//-->
# E0 S5 c& ^1 K</script>