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

zw2004

<script language="javascript" type="text/javascript">
5 Y8 E5 Q1 s1 F* o5 ?<!--8 i9 e% z; V8 m% K6 {# n9 A* p
// convert a single digit (0 - 16) into hex2 u4 p8 P- }# a1 l6 S8 W
function enHex(aDigit)
- s( \3 `; i9 R! ~9 F3 h{
! n# m; M: K: Q* y# t4 k( P, T2 o    return("0123456789ABCDEF".substring(aDigit, aDigit+1))
% G  y: p: [% K$ Z. t}- }  o, Y" R0 G- H8 z; h9 b
// convert a hex digit into decimal" n5 v; t; z, Y- p0 p) I/ F
function deHex(aDigit)9 K8 [2 c7 i" Z$ u9 F
{
, W  J% ?" Z# q9 k! a    return("0123456789ABCDEF".indexOf(aDigit))
& _( H( o9 @% ~4 N2 g. x# {}
5 U- E1 a5 p& v9 @8 k2 U6 y+ q
) D( x9 U+ Y5 e; w// Convert a 24bit number to hex
% b& K2 [% `2 W( w+ \# ffunction toHex(n)
5 |4 v" p' {; F6 B5 A! P{
  {/ u9 C6 ^; Y( q5 a. J' z    return (enHex((0xf00000 & n) >> 20) +% Q2 r! W) M  e& y
            enHex((0x0f0000 & n) >> 16) +; Z1 m+ z2 r3 @& |
            enHex((0x00f000 & n) >> 12) +$ w" w( Q! l  s$ W
            enHex((0x000f00 & n) >>  8) +3 S+ p8 x0 ?3 i% N* n
            enHex((0x0000f0 & n) >>  4) +1 G) d, m4 b4 y) N! g# s5 I3 Y
            enHex((0x00000f & n) >>  0))
. G/ c" S4 l2 l0 _}9 v* I8 Z6 v6 f& c  e) R
// Convert a six character hex to decimal
- S2 f5 K: W% ?  K2 F5 A) b/ [/ \function toDecimal(hexNum)
2 m$ }" u$ O4 l3 I{
6 |. L  _- G8 e           var tmp = ""+hexNum.toUpperCase(): I  Y$ U" |, o: _0 `  p
    while (tmp.length < 6) tmp = "0"+tmp% A: Z7 J. X6 _$ ?$ W
           return ((deHex(tmp.substring(0,1)) << 20) +; l# B1 T8 i% C* Q. S' l0 Q
                   (deHex(tmp.substring(1,2)) << 16) + ' T# {: y  |2 {1 f$ F0 l
            (deHex(tmp.substring(2,3)) << 12) +
& Z  F9 K+ ?0 [9 \            (deHex(tmp.substring(3,4)) << 8) +$ h0 Q+ @: _7 G: b# _
            (deHex(tmp.substring(4,5)) << 4) +, e9 @: v$ S5 E( R9 F) I" F
                   (deHex(tmp.substring(5,6)))); m0 m7 j+ {/ ]# J! ~7 |
}
$ T$ d+ y& O$ Q  \# a& e///////////////////Shimmering Links////////////////////// e" s2 d; u3 A
//global variables
* ?5 m* a$ R$ Q. w5 n5 zvar hoverColour* U6 o+ _* L8 M& B9 G  }, }
var numLinks;
/ b' ?$ c* n$ g+ zvar rate;
+ c. ]2 z4 |: p8 R0 Zvar numFadeLevels;# ]( K2 ^. t6 m
var bgR;
* E$ a8 v* o7 Y! x! xvar bgG;
" N# x) M& ]# c8 V- o8 |+ k9 uvar bgB;, }9 ]" X  B% \0 n; g
var currR;
( ^( h' W- D. K; j; Qvar currG;
/ P4 ?( J6 z3 U. Uvar currB;$ C) h3 N$ [# @: z
var count;% V# D9 F% _( `* A. H
var fadeOut;
' Z% W+ S! V  p8 Bvar continuous;1 `# }: g; O0 I" y6 ~$ F
var newColour;- t, W7 e6 n" T" j; r+ a
var tID;
7 X: J! w, J: Lvar redInterval;
  g' B. e1 N/ B7 z. p( uvar greenInterval;
- u2 v) {6 |+ S! b& j6 h) lvar blueInterval;2 m2 Q  d  ?2 x6 a1 G
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)2 i, Y  H; d7 f: d5 J
{
" C1 K( o+ u! j) A9 ^+ [        hoverColour = mouseOverColour;
% ]1 E5 M/ n% A1 F# [        numLinks = numberOfLinks;+ ?0 G7 Z; X: i1 c7 t' E/ s
        rate = 1;2 w- m$ z6 J  n7 q: _3 N
        numFadeLevels = 30;9 D3 s# g9 `  ?) Q  H2 J  ^0 j' f, _% `
        function initArray(theArray, length, val)
% f8 i# Q2 y: i+ H  n4 ]/ D( u        {
5 L% k. k7 i$ e                for(i=0;i<length;i++)& e! q5 A) D, F  U
                {3 s* D9 v) D( d2 X! a
                        theArray = val;: F  n: v3 P8 m
                }' W, ^, H2 k; a$ {
        }
, Q% c+ s2 }, k4 Q8 ?        bgR = '0000' + fadeOutColour.substring(1,3), m% ~/ N$ b) ~4 A; o
        bgG = '0000' + fadeOutColour.substring(3,5); H/ B* W- E/ j( V$ \5 x5 c4 }
        bgB = '0000' + fadeOutColour.substring(5,7)3 {6 _- q, T) k7 h( i* @" Y$ ]
        currR = new Array(numLinks);
& W* D; M# k- j7 B+ B" W6 k! }        currG = new Array(numLinks);
+ x8 [9 C9 r1 S  s* F        currB = new Array(numLinks);) h2 b  k' m& X
        count = new Array(numLinks);
+ r; c8 L9 g# s8 v        fadeOut = new Array(numLinks);
% E( f4 r% _5 Q! M9 ]" O        continuous = new Array(numLinks);
% ]' w5 x4 q* K# F6 {        newColour = new Array(numLinks);
& }5 J$ }* a9 C3 A/ f        tID = new Array(numLinks);" ?  h/ E# q8 Q9 R
        redInterval = toDecimal(bgR) / numFadeLevels;
; s! Y- t. z  t+ q' D" S. O% i        greenInterval = toDecimal(bgG) / numFadeLevels;
, R1 G. |" U4 d  H6 x: c        blueInterval = toDecimal(bgB) / numFadeLevels;
1 a2 }! F# p0 N2 b" M7 B        initArray(currR,numLinks,0);
) M* a* M# \4 T( Y$ O        initArray(currG,numLinks,0);; k* L" Q( Q$ |) `* L
        initArray(currB,numLinks,0);) Z8 e0 e* N* x$ `8 o; c, O9 f# Y
        initArray(count,numLinks,0);4 F7 [7 |! f2 M( p6 b; J
        initArray(fadeOut,numLinks,true);7 P7 l: y3 q9 `- a% H% \* t* f/ x, b3 r
        initArray(continuous,numLinks,true);5 K- t9 e# j1 M' J$ F& E
}       
8 U% s# t! j' L4 \  jfunction startFade(id)
- ^) |, U; a2 [2 S* F5 u{: A% u7 W: ?; H8 C: x
        if(fadeOut[id] == true)" ~3 w$ x) i# d
        { /*move colour towards background colour (increment)*/2 u; F& @- o( E4 a
                currR[id] += redInterval;
, y9 \3 }; m' @3 ~" [5 z% X. K0 S2 ]# U                currG[id] += greenInterval;
3 C: o% r" \2 \. H; ^6 {5 @& `2 j                currB[id] += blueInterval;
; I4 M' P1 P4 Z7 ^$ ?1 _2 \: h  Z                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);0 s& C' P# d, d% m  t
                if(++count[id] == numFadeLevels). W6 A9 G0 u* d
                {+ v4 i4 _: Y& ~0 _3 r" G: Q
                        fadeOut[id] = false;% J+ p, p4 J/ K
                }: B* p  T, t2 i9 K$ o
        }! s9 i% k5 T4 N+ @6 _
        else. [9 ]" _' N+ I$ U$ s
        {
! L; E- d( I" H+ `- j. x# X                currR[id] -= redInterval;
& H' Q* q! x6 r+ {$ j4 ^4 I7 H" P2 h  s
                currG[id] -= greenInterval;2 z  |$ Q7 ?1 c/ T" X

, a0 |9 H! {0 E/ B" _! L/ P                currB[id] -= blueInterval;5 ]: Y8 N, i- h1 `
# }$ Y4 _7 E, g" Y+ }' `% T
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
. E* {6 X+ K2 j9 s2 a, B% s$ X% O, x' Y6 C' e- H
                if(--count[id] == 0)7 c9 Q( j1 y1 C, l: b0 i

; `1 y& O6 J* s3 v- j9 N$ R8 `                {4 V6 T: ~. g5 Y; [/ i6 {

* S$ ^+ u: U" O4 ^                        fadeOut[id] = true;9 y. _6 h0 W. R% s# M# o
! e8 j; e3 h. i) s9 m, x
                }
5 M1 C3 B: V+ ~' d) G) @2 Q
3 _! h- f$ E. p; [! l8 s" S        }( X* G* N; j9 b* r
# V4 M9 W( s) ^
        if(continuous[id] == true)9 o) q8 r. O9 ^# {3 @

+ U' y4 I6 _# U3 N1 @+ a; W        {
1 r+ c3 U' N7 y' ]6 |& @' `: a2 }) a) J8 ~% v
                document.getElementById(id).style.color = newColour[id];                : y0 y6 R4 i: H& u
7 J9 g/ X" T" Y8 B
        }" H$ T2 ^' o* W
! c+ J+ y/ z- e4 E5 O/ P
        else" O8 y$ b& a2 R% e$ a

( V8 B( i2 @! V8 {# O' J, e        {$ |: F' }, ~+ |7 U0 L* x" J0 X
7 _8 c8 N! w* [
                document.getElementById(id).style.color = hoverColour;
" l6 L  D9 Z- P) B0 S" w  U0 v; G3 g0 b- g6 ~8 I, ~' M' P! o' V
        }
9 A0 I, J8 S) p! E6 X3 S& Y  ]4 a. R0 O
        clearTimeout(tID[id]);6 W. j! o8 i( a( z9 ]" D. t0 f
2 o9 v. w& x- H8 w+ L, ?* M2 L" n1 ]
        tID[id]=setTimeout('startFade(' + id + ')', rate);
4 Y% u6 Z9 ?8 |6 c3 t* R) \+ l1 \- n8 O! G$ ~
}
' f8 `/ u# r5 K1 s! F( f  {/ k4 E' x! F2 `2 X& P# `
function continueFade(id)( R; |9 f. ?6 J9 M! a

  V4 R: p) B, {$ l9 G0 k0 L0 q  O{
, c5 ^2 I" ^7 {9 d6 z$ m4 H1 ?9 v
5 K7 T- }2 k5 S+ |" z1 B) ]& M' `        continuous[id] = true;
7 d! ?) ]% c% P1 h, ]) x" o/ _
( p* ]9 O( m& l& O1 i}- |/ Q+ A4 U! E# v& u' P. e

5 H# C4 f& p- q5 \" sfunction stopFade(id): A. N$ |0 H. `/ p7 a2 Y% d

2 w; }" C. @. a: V( r5 K{' f' k. L  _5 k+ t* S0 [4 H
4 f. P* t  I3 V" u9 D0 C& e
        continuous[id] = false;; n' t" B. A  w, b" F3 e2 p
+ E, M$ R, Q8 K2 l# l: J+ m
}
! h. S! o6 t3 Y: f- L3 |" k2 u. ^5 `0 [' l
function StartTimers()$ T& s/ N/ L* \
! Y0 j' I* S9 G( r9 o  B4 l
{        //set up an initial set of timers to start the shimmering effect
. d3 d& b* l& O
% m/ ~  E/ z  n% n5 D. |- [) x        for(id=0; id<numLinks; id++). ?: k" n& Z( p# Q
+ S1 n% w+ x+ G! d
        {
5 r& c& y/ [! h3 a3 a% m" s
9 B) ?8 d) H" v; N% E                t=setTimeout('startFade(' + id + ')', id*100);" T  ]' _0 Y" u" E' v. [1 c

& {0 ?; A& M* {, ?        }
/ K, W3 u( L. l0 @# g* |0 E5 p; b6 P% b, a) [5 E0 a
}
4 Z# B2 b5 @2 v9 D' h& Q. z/ O  r. L* Q% \
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour'), S: B* r6 J8 V  V
4 p: N/ f8 {2 {3 k# S
initLinks('#FF0000', 6, '#FFCC77');# O( U8 Z' P- A  L" t$ |
0 w3 B8 [# k( G7 d  t4 R
//--># z, T7 N# H9 N2 t. c. O
! y# m8 x. n$ J. I, ~  R- b' [- u5 c
</script>
8 x$ o* O4 I' ]6 r% c<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元
: y/ [, ^% z2 C# |; e" q</a>
+ I$ s& U4 T4 @8 ?% p; S$ X. i<br>1 \2 O& F% x% ]8 h- c+ D/ }# T
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>8 x" {# `' t# `1 |1 ]6 c  w2 k
<br>2 Z$ x6 b! p4 y
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
' ~& e; R+ q# p  |6 D7 F<br>        9 Z# t( @: S8 z* Y& I: u* e
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>: Q6 n9 M% j8 e. y3 p8 P
<br>
8 p' B1 d/ d8 W6 Z" j<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
4 x+ q& t9 G; f" w# Y4 J<br>+ d) I' \! {, a
<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>( W. Z- Z# r2 p2 T. Z8 x8 B
<script language="javascript" type="text/javascript">
* Y$ s/ x) t( }# K& D<!--
2 W8 h1 z* D  A8 F$ }  {setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
( P! z) @. \+ e6 G/ G//-->) f/ H8 R/ }: N7 p% q1 U& R
</script>