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

zw2004

<script language="javascript" type="text/javascript">
2 i' j& j5 I* s: g2 [# e; Q6 |" ]<!--, g+ ?- z/ ]6 V6 i1 y
// convert a single digit (0 - 16) into hex
9 l4 t/ t. G' h; x  {function enHex(aDigit)
+ l7 O% `! h# Z5 T% ^{8 M8 B. U8 S# p5 ~8 o( s7 n  P" l
    return("0123456789ABCDEF".substring(aDigit, aDigit+1))9 O; d$ Z1 }8 e7 g- X" m9 D+ H- C
}
2 q: o% W3 p1 c& G) y3 G1 O// convert a hex digit into decimal
7 U0 |" J2 c& A/ l  g- S( xfunction deHex(aDigit)0 m3 D8 r, C, h# G; [$ _! X
{- m; i$ s8 h) \8 N
    return("0123456789ABCDEF".indexOf(aDigit))9 c2 B. [! W4 z3 Y% T
}
5 ?: x2 u2 }2 R) d
2 V, O% i: \' S* h4 R1 J; o5 a// Convert a 24bit number to hex. V; x, ~# L! e" j  F
function toHex(n)
, M( f0 i- Y0 T4 V0 O4 I{/ U' F1 @' D0 ~2 `7 H
    return (enHex((0xf00000 & n) >> 20) +% a& r8 t  r; U3 f
            enHex((0x0f0000 & n) >> 16) +9 [7 `5 `- S# L: ], b. G: e; k
            enHex((0x00f000 & n) >> 12) +
: U* m7 ]! c. `) r: x+ z2 H1 z            enHex((0x000f00 & n) >>  8) +% S! |& e1 k9 j! ^$ S" x
            enHex((0x0000f0 & n) >>  4) +$ ?5 F% e: c+ S! ~$ F& K
            enHex((0x00000f & n) >>  0))4 ~2 ]* B5 h' f) z# r7 \9 u
}, E  q, ?* m( N3 J, J' w5 d, L
// Convert a six character hex to decimal
% Q* x7 q/ B; q7 L. B. [4 a8 b. wfunction toDecimal(hexNum)2 c8 p& B' H( s- o+ C/ y6 w
{
6 l6 O$ N' L' L, u7 A/ a1 n$ a           var tmp = ""+hexNum.toUpperCase()
0 v) M9 G9 g2 h    while (tmp.length < 6) tmp = "0"+tmp* S: u$ U9 K! Z) r& W+ _
           return ((deHex(tmp.substring(0,1)) << 20) +- `, }' z; z0 J, t9 |0 C7 O/ @
                   (deHex(tmp.substring(1,2)) << 16) + ; h3 g1 g! k0 H" ]% t8 Y
            (deHex(tmp.substring(2,3)) << 12) +
4 ^! u1 x& v1 L4 Y& b            (deHex(tmp.substring(3,4)) << 8) +7 T5 k- b6 M# m$ L; Y# }
            (deHex(tmp.substring(4,5)) << 4) +  p; h2 g4 r+ M/ _8 l
                   (deHex(tmp.substring(5,6))))
  _- x7 ~. e4 h7 B3 [}
) }, x# b7 J7 D8 W5 H, w  u///////////////////Shimmering Links/////////////////////
4 T, |$ K7 X9 ~//global variables
* z3 C' G0 K) h- s; F. k% y" B7 W" Wvar hoverColour
7 \% X. J; S; U5 g" J% avar numLinks;
9 _3 N6 `/ B6 W; z9 a6 gvar rate;
* y! l0 d/ a% A2 l* y8 Pvar numFadeLevels;3 t6 c/ w1 j9 Q9 g
var bgR;
8 p" ^( ]6 s( `' h# @' Fvar bgG;! Y" k, P* {- i) X
var bgB;) I' m4 `) P# S
var currR;
- O2 M! C5 ~; W: i- Avar currG;
# n& k/ p/ P2 Z! p. K+ S6 ~) V* }var currB;, Y) {1 u6 Y. q) @9 y3 H
var count;2 \9 K+ l' h6 j0 Y
var fadeOut;( m: A8 {! Y4 M/ z% J
var continuous;
8 ^! A8 a! Y5 u! ~7 U. B* ^) j8 Svar newColour;
0 R0 Y* ?: l6 z6 E# T1 M3 }var tID;
$ P% D! S4 N' T/ U0 O- {- Gvar redInterval;9 w4 `0 y: H8 J. z2 R( j) t$ N" t
var greenInterval;+ c* l+ P4 `. b& X% |0 J/ H) Y6 ~
var blueInterval;
( K0 a6 B4 r2 [3 Ifunction initLinks(mouseOverColour, numberOfLinks, fadeOutColour), ?. b* I: H. F: {# O$ f
{
$ K; D; o9 y8 z3 G( G0 G9 j, Y/ `        hoverColour = mouseOverColour;
6 M% B7 C$ N1 `* K. D9 S& N        numLinks = numberOfLinks;# i( r. @+ f8 t
        rate = 1;
2 [& `+ B; V6 L8 Z        numFadeLevels = 30;
2 U+ c; b% O9 o$ f9 ~* [: h        function initArray(theArray, length, val)% @/ ?+ U/ Z( K
        {
+ O. a( f8 M9 U( w7 q. d% L                for(i=0;i<length;i++)
& t2 G7 `3 B0 I. Q+ x                {
2 V! W  c# ], U5 z( e                        theArray = val;
( `, ]/ V" S+ P                }# a9 ?% ~+ I: p7 R8 F: Q
        }
+ m1 U, F. Z4 l0 U        bgR = '0000' + fadeOutColour.substring(1,3)
5 G/ }  d! S, C+ f        bgG = '0000' + fadeOutColour.substring(3,5)
3 F# w" Q4 X* }2 [: y        bgB = '0000' + fadeOutColour.substring(5,7)" p1 G5 p) h$ M" t
        currR = new Array(numLinks);
$ t, o5 b$ x( M% s        currG = new Array(numLinks);( F3 x" s* ?% F/ v! f( }5 Z
        currB = new Array(numLinks);
& W2 l5 i8 W, T1 f5 b* b$ a$ A; w        count = new Array(numLinks);+ p2 b, l( h$ l0 ^" P9 V  L
        fadeOut = new Array(numLinks);/ s0 ^7 W. Q1 v3 E+ C+ T
        continuous = new Array(numLinks);
- T5 j! c; t9 s, F; Y        newColour = new Array(numLinks);8 v4 k; p9 ~  C4 j
        tID = new Array(numLinks);
3 r! O! S5 [- W3 S2 {+ y8 C        redInterval = toDecimal(bgR) / numFadeLevels;; D2 ^& }4 \; g0 s5 b) D+ K5 k
        greenInterval = toDecimal(bgG) / numFadeLevels;5 A1 _+ V# `% h
        blueInterval = toDecimal(bgB) / numFadeLevels;
: A/ R: i' E( i$ ?        initArray(currR,numLinks,0);1 R) F/ |4 J5 `; n- N, }9 _
        initArray(currG,numLinks,0);& x/ ?& b/ ?4 ^
        initArray(currB,numLinks,0);0 Y# Z- `) r2 \  g/ Q! ?5 _
        initArray(count,numLinks,0);  K9 i! B. B* ]5 O
        initArray(fadeOut,numLinks,true);' g' [  K5 P3 h1 E; g7 N: k
        initArray(continuous,numLinks,true);: t% u! l1 w; g6 }
}       
2 G$ i- w  Y# {* h, `$ j- Efunction startFade(id)9 P$ b6 I* |5 E, q
{
5 ?/ a; ]- o) I6 u        if(fadeOut[id] == true)
7 v6 t) ?$ \5 J4 _- [3 R        { /*move colour towards background colour (increment)*/
6 z. q3 A- o8 `                currR[id] += redInterval;
  N4 o) W+ T6 \* G                currG[id] += greenInterval;
; |+ }3 y" O# d8 a. H: O2 G                currB[id] += blueInterval;/ I* K! P5 ]* E! [" h/ x
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
8 R: R# |, V* |- g( F                if(++count[id] == numFadeLevels)
+ U2 e" g8 L: X                {3 T2 r" j4 i6 i' j
                        fadeOut[id] = false;
3 \; U" ~' e+ U4 b* [                }1 F, v) r% l- |) y& u$ h$ x
        }
. `0 E% K9 Q+ }+ Q8 b8 t8 S- O        else
% @' b. \, Q1 B, F/ t        {
+ S7 t$ h' X/ g0 N. z) z- l. \0 I( s                currR[id] -= redInterval;& {6 \& T, x# _) p; q
5 a5 z! v* c2 k7 |
                currG[id] -= greenInterval;2 ]; S# }  u; c9 p

" Q0 O5 A# p% E, ]3 {                currB[id] -= blueInterval;# Z" T- ^* ~2 u1 C' @
' n! ?! {  T$ o8 P# j
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);; I5 b. S' u7 b8 o6 J

. R+ g+ ~( r% j! B7 w3 K* N% T3 ?                if(--count[id] == 0)3 y3 |3 c5 \- Z; D; U8 K( U3 v/ [% t
. T( y& x' W1 ^6 e) P0 r/ A
                {! N! k( c# N  I1 u
$ r; q4 c0 J0 Z( y  m4 u% M
                        fadeOut[id] = true;. V* U5 g3 ?0 J' S$ S0 A

1 t$ d# g- @" Q6 S                }3 l* R- }& Q. x7 n5 S2 |
$ V$ ]6 a7 q( \; D& M
        }
& f! b8 `- d+ [6 y5 I
1 U  D: _% j# L, c8 B4 D: L        if(continuous[id] == true)
+ G& g( l3 j8 c. I) B
* c# Y- M$ `( u/ G- L4 _8 P8 j* l        {
. H0 c; I! n, i) ], R  F' j; \
# D# c9 X0 m+ a                document.getElementById(id).style.color = newColour[id];                ) l0 C% W. R4 f' E6 h- y

  d1 v8 z% D) L, \3 z+ K3 c) h/ U! ^        }
3 [8 A, y+ ]" E% z& d% Q# k4 e" j8 [
        else
* C% B6 ]0 A/ X( B+ C6 u  ~7 G# M0 V( |- L5 r( \/ G' D
        {; B4 D+ x) R$ Y6 o
1 C; Y( s/ D* @
                document.getElementById(id).style.color = hoverColour;
9 T% G6 e7 n2 {( K) ^
) Y1 @% L6 S# P7 v0 K( e/ r        }( N# d# l2 P- \7 h
/ f, U( @, G2 ~
        clearTimeout(tID[id]);8 M$ n: d; p* `4 D" S. ]9 B

/ T# b! n7 J# c$ G! U, G3 g! r        tID[id]=setTimeout('startFade(' + id + ')', rate);9 L, O) w8 w" B

6 ~# w6 M8 s+ v- R: X3 J}' d( V& w0 i( H- t3 @
: P  F0 ~! x! F% K
function continueFade(id)8 {  k  ]0 U+ i3 E4 y) X* Q2 J8 N
2 N1 p. @; }! H1 ]
{
0 ?2 l' Q% u4 y, ]
. q9 g/ \) |6 P/ e        continuous[id] = true;/ z! c0 c  q7 x+ w" Z& ^' B* t
' f) W' m9 O4 J
}6 Z/ [9 H5 Y5 I. o" J

" n2 {+ h7 V4 g0 k/ ~" N+ \function stopFade(id)
# f% E4 a/ j# |2 q% W; y0 p" p/ q7 A
{
) u5 s) t; s* b( M; @2 V% R
& l  O; B9 p2 P8 N) F# w' F, U        continuous[id] = false;6 y" V: n( R5 ^- U4 B$ Z
8 c. [6 e3 \: |$ }1 X* z  }
}
9 V, \7 B; L  [) g% ^& i( X7 |
, |6 m& F3 R% ]* S- l& Q( zfunction StartTimers()
5 m8 e. e/ O3 g* C$ B/ L2 c% ^9 q) r4 R/ ^7 w7 k4 K/ s4 S( V
{        //set up an initial set of timers to start the shimmering effect
7 r0 k4 ~! l+ ^, A7 j, g5 O3 M: M. H$ o* _: ^0 @  z
        for(id=0; id<numLinks; id++)6 v& j% C% `9 G2 l8 ^  x
' g* {  Y" f6 q
        {
2 i, B* `* R% _  O+ L) Y+ ?9 y0 g" f: |$ s
                t=setTimeout('startFade(' + id + ')', id*100);4 a  D6 L: n/ N$ a" t2 @, h

6 X$ s9 J% ?5 ~+ [        }
5 s) ~, E  J4 S' M1 M% Z8 p6 u, i- Q! ~: J9 j6 x9 T  N) M0 k' p( |
}
" Y; R! M' a2 n  A! o
" B+ l7 G$ x7 `8 _) ?. a, Q//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
- [# ^) ?7 |7 y8 G1 C; m
& o. R" a4 V  K2 r; {6 I  rinitLinks('#FF0000', 6, '#FFCC77');: }7 s1 A' S6 }& Q

3 t# X! O; P1 }2 \7 Q+ D' c//-->
; o) o% X* u) G8 h% O
/ E. {( t2 O4 S5 y( H8 U% K</script>4 d- K0 \2 c4 y' u. j  n) {
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元
% ^+ D0 ~# z4 |: G7 C: p) V</a>
# y1 ?' E2 o' \4 v; l( ^1 `8 z<br>
- z/ o# R$ y& H$ H, @1 H4 W! X% u<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>
* p; L% Z8 i( m9 I& P<br>
; M7 V- m0 J# u<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>1 u9 ^5 }4 \7 D. k8 k+ ?; T) w
<br>       
( }/ N5 g) d) n  B5 P6 G- A* p* e<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
9 s( O) Q, c5 X  |# s/ G<br>7 H' r" a: l1 p% B4 _( A
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
/ d7 t+ q* W, a) T0 O5 ~<br>
. v% b4 |& |5 f0 m<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>
1 K9 L! e) I+ o8 D, f' W<script language="javascript" type="text/javascript">
) ]* g+ M4 t$ W7 }  }' Z2 d3 b( U<!--8 Q. b4 y; Q$ v9 V+ I' P
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
# ?- U% P1 D* v3 s% r& I6 R2 L5 L//-->5 s& b6 L/ B8 q$ }+ d: A  T
</script>