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

zw2004

<script language="javascript" type="text/javascript">
5 }0 P* Z# P! }" P( W<!--0 F* j  f- q  Z! I) I( S/ }/ G/ A9 G
// convert a single digit (0 - 16) into hex
; q* a+ h( Z$ S2 Wfunction enHex(aDigit)
7 b! Y4 O$ X  b. c) y6 l6 W{& ^+ d( [( N1 i* r
    return("0123456789ABCDEF".substring(aDigit, aDigit+1))* |, i6 M$ z7 b6 k% \$ t
}9 f: R: n0 f: F, w
// convert a hex digit into decimal
3 N" I8 U: j6 M  v# V8 Z! d6 Cfunction deHex(aDigit)
  h# y; f4 K" G$ B# h2 U9 C{% Z- `7 b* F: N# R
    return("0123456789ABCDEF".indexOf(aDigit))7 R  x6 }& W- ]1 p& d
}7 E& b5 V0 p/ u) a9 @

; E  t. ]! Z2 f6 n9 u, B// Convert a 24bit number to hex9 h4 X, {+ {! [; O1 W
function toHex(n): r, }6 f( P  a3 X( v& n4 K+ M( ~
{; X! u3 o' r( U+ I4 B, G
    return (enHex((0xf00000 & n) >> 20) +
0 \5 h& H2 ~  B. d6 n- t* K            enHex((0x0f0000 & n) >> 16) +
5 q9 E7 R+ d3 E            enHex((0x00f000 & n) >> 12) +
6 C1 \/ \2 X1 {: C$ T% V            enHex((0x000f00 & n) >>  8) +
2 s+ {" x1 P# O' ?8 w            enHex((0x0000f0 & n) >>  4) +9 v: F8 o8 u. M  W
            enHex((0x00000f & n) >>  0))
9 [4 b+ g! a  W9 \6 v$ |" H2 y}
- Y  O5 l! \9 O  O( {// Convert a six character hex to decimal
, X4 q! S9 D# {function toDecimal(hexNum)8 B( i8 Q3 ]2 {3 J0 i5 E! n% F4 C
{
, Q1 ?; |! K$ K8 m           var tmp = ""+hexNum.toUpperCase()% w  O0 o/ q  g& }
    while (tmp.length < 6) tmp = "0"+tmp
! e% |& C+ ]) c' }' r* F: [1 f           return ((deHex(tmp.substring(0,1)) << 20) +; J. X/ x- O) F' P8 s3 c# O
                   (deHex(tmp.substring(1,2)) << 16) +
+ J- l( U7 d) K            (deHex(tmp.substring(2,3)) << 12) +
; G7 o1 r3 \6 p" |            (deHex(tmp.substring(3,4)) << 8) +6 x* n5 l( D2 G" @6 [  ]8 C
            (deHex(tmp.substring(4,5)) << 4) +
% R) G" U& P' L) ]                   (deHex(tmp.substring(5,6))))! y9 p$ `0 O# j/ \  A
}* l& B& @/ Y3 k! b' {
///////////////////Shimmering Links////////////////////// k  {) L6 N, q% {" c' ?1 f
//global variables9 J% o% ^) G! y4 v$ b6 C/ p) _
var hoverColour1 }8 d; @; b4 [. s1 E) \: n
var numLinks;0 M1 b! R! S. n( i7 R
var rate;& F  x9 _5 J8 i* c
var numFadeLevels;  M. f2 C/ Z& Z$ i- \
var bgR;7 _5 H1 j$ V+ h  b5 I% |3 n" R, M  d
var bgG;
( M% L+ l2 z: ]var bgB;
/ B, I4 c( s7 n' t  i$ vvar currR;# T$ J: h( {; x! Y! d
var currG;, R* D3 i, v3 p( c+ C% @5 H
var currB;
1 Z; G0 H) \4 R8 J6 d2 a2 pvar count;( w  V/ |/ h* \0 k$ a. t
var fadeOut;/ _- B. G& b) e1 p" l. q
var continuous;
7 g# G; \0 O# S) O/ a3 v# \var newColour;% o5 J7 E4 t9 ~1 H# G: O, Z4 I
var tID;7 g5 T. O% G% E% |1 h1 F
var redInterval;! T5 p1 a5 r2 _- r3 V& G( |* l
var greenInterval;
) |/ g1 V' D( {; Dvar blueInterval;
* n! c7 }3 _& S" ]4 M! Nfunction initLinks(mouseOverColour, numberOfLinks, fadeOutColour); {1 _. T2 O- ?5 l1 D; C
{
% o$ O9 P( [8 E% G$ @5 A9 z        hoverColour = mouseOverColour;1 _- |+ P' A+ A
        numLinks = numberOfLinks;, r& l3 t* H4 `5 E
        rate = 1;. |" D  S3 ^5 k+ S" b5 ~
        numFadeLevels = 30;% p0 l, x) f+ ?  X* l# Y3 N) [
        function initArray(theArray, length, val); ?' k! E- L1 `8 E- c, d4 X
        {
. N" h1 A) W5 s3 I" e  I$ O                for(i=0;i<length;i++)
2 A% H7 V8 C; {7 s                {, X1 A: ?. V% V3 {5 l& g, v0 }5 M+ A* W
                        theArray = val;/ z0 e% ^4 }. x  G$ [4 X5 q5 F
                }' w$ S5 Y8 M# u) ]) F  H4 d6 v
        }
. n- t  p* a& N) u7 Q( d        bgR = '0000' + fadeOutColour.substring(1,3)5 k8 {/ A$ M2 O& r
        bgG = '0000' + fadeOutColour.substring(3,5)
8 l% e0 Z* o! K/ z- k/ |4 y# V. D        bgB = '0000' + fadeOutColour.substring(5,7)/ @" I+ _& w, p
        currR = new Array(numLinks);2 y. A. [3 n! Q+ \' M8 C
        currG = new Array(numLinks);
$ e' q9 [1 Z' M        currB = new Array(numLinks);1 s$ Q& g4 F9 n. z, t4 r
        count = new Array(numLinks);
8 k  j/ L2 i) g4 R( Z1 Q) |5 j7 B: W, H, ?        fadeOut = new Array(numLinks);
/ H, B" l0 {4 K0 D6 g. j9 j        continuous = new Array(numLinks);
3 |# C; z$ p" {; G4 o        newColour = new Array(numLinks);- [" b- a3 |$ }/ B
        tID = new Array(numLinks);
, f5 @' \1 y) V        redInterval = toDecimal(bgR) / numFadeLevels;% l& r* i$ M& ~- \# A& U! o
        greenInterval = toDecimal(bgG) / numFadeLevels;
! D5 v# B; V8 n( y$ ^! E# ?        blueInterval = toDecimal(bgB) / numFadeLevels;$ B2 p8 H. n1 O$ f1 a5 Q
        initArray(currR,numLinks,0);
$ [4 _8 u% |1 r5 B7 i        initArray(currG,numLinks,0);
* D  ^2 }$ P7 r4 }        initArray(currB,numLinks,0);# \/ }( b; j: c( i. K9 p
        initArray(count,numLinks,0);# I8 k) V+ C! T: u+ I
        initArray(fadeOut,numLinks,true);
. m8 `9 d% y' }! D' a7 q        initArray(continuous,numLinks,true);, R" X# h/ N' ^( d# T
}       
; b  [  q$ q4 j! ?function startFade(id)
% T  q* p+ K" z" n; |{
* h( w2 a& t, J% m2 R& v& n        if(fadeOut[id] == true)
  I# W4 l6 H) q        { /*move colour towards background colour (increment)*/, S5 ]% z0 n5 G4 E# V5 Z
                currR[id] += redInterval;
  K. [6 n. }* ^* ~                currG[id] += greenInterval;
9 Z: W+ A6 e: M9 n( F" `* S/ c                currB[id] += blueInterval;
7 k; c  x  z+ ]& a3 O% p                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);0 Q8 u: L( w+ P7 _3 u& x
                if(++count[id] == numFadeLevels)
( c) z; _6 ]  C- @( `  W8 C8 J                {
8 V% s' n# O9 S! T5 b! _3 E& D5 V                        fadeOut[id] = false;$ C. S) W4 V0 p: I1 W) q: ^; `
                }' v0 E/ j! C! O, k( N$ W7 r# M# a
        }
# x  f4 e. j  }% M        else& h* Q: P- d) ~4 B3 G
        {. `9 z+ L8 X4 a/ f% `( h
                currR[id] -= redInterval;
" }; m- Q3 H: w' L! l4 w, I* J$ N- `# U" T/ i$ K3 P# g
                currG[id] -= greenInterval;
" N; N% T6 q9 J6 `8 S! B: d
. D: b  N1 A" A# m1 ~                currB[id] -= blueInterval;
' s0 d* A5 }. M% J' f4 d% r
- _% i) [; Z7 }9 K% y2 v                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
; x( J: k, o4 r9 I: y; D1 ~: u# B9 c, F
, s" m6 \, s: ^" L) [% ?' o                if(--count[id] == 0)
7 V9 ?9 [, {) T  E. Q) q* w3 L3 K  m2 t
                {$ w7 I4 O9 S4 _5 B

" k8 j; K7 u  R4 Y                        fadeOut[id] = true;
% q$ S! L0 h1 e( ~; [
- c2 d+ v' L, q; `                }4 r% Y; I, j4 D! K1 q/ f7 ~
  f. t# W3 c% b+ `3 h
        }
7 [/ x3 o% N! }8 p  ^
5 G  y# Q6 Y4 M        if(continuous[id] == true)
; H( J7 R9 l) {) h& y1 Z2 ^' [: |4 U. t
        {+ U) h) B- z+ {! F; f( K! o
" ?9 w; F! G' ~' \
                document.getElementById(id).style.color = newColour[id];               
2 g+ c% n3 ~, K: [, s/ ?6 h& C) l* C+ G& G/ t
        }
7 M/ l. ~- Q* Y/ r/ {5 `# B" \7 K% t( g1 U5 H( K9 D
        else7 |( x+ Q! }% C& t% \5 V" [
$ V; q- X$ {% R! e2 J- g. u
        {
+ R9 r, `) i9 z3 e7 e( T  \
: u2 }: \' u, Q) s* V- G$ J" s                document.getElementById(id).style.color = hoverColour;+ {9 B  o( `: Y% A4 o/ U; Z  `

- b: K) U" G: V+ m' g8 `2 k        }
5 A0 g3 m! g* c) S7 C1 }
1 E/ H( F* R+ p& q9 i        clearTimeout(tID[id]);# J2 g0 H3 U& {! g
7 d# V! H5 u, k/ |! _4 U
        tID[id]=setTimeout('startFade(' + id + ')', rate);! P/ |, F  A* R* v. k

: y" J+ v& F$ p# _6 z8 z" v: Y}
+ H/ F3 n! r) Z. x- l0 g
) M0 [5 M1 L) Tfunction continueFade(id)
; b4 C$ f7 W* E3 o: Y
8 `: O- K' v4 S% ]{
+ h% i( t- Z2 l3 c- o9 D. l8 B% E- }5 v
        continuous[id] = true;* i1 {" q8 X0 h, L$ Y7 R

- {) X  B( o  C7 o" b}* W- c, V/ l% t9 K8 v3 z

- L5 E$ j: l4 l9 Z" ffunction stopFade(id). l9 L) i$ u7 X4 |0 \" \/ o
$ O0 S0 ~) M" B6 O
{
, r. m" x- y: S: K4 e; X/ D" I, D; c4 |# H6 r
        continuous[id] = false;! S2 M, ~4 a9 V

5 `7 O4 b. ~- _, ]% [5 h* X1 b}; I" M# P1 b  z1 K
. H# l  h1 T4 [' W9 R
function StartTimers()
/ ~' a& A2 F& V4 M, |8 @; ~- \& ]$ i
{        //set up an initial set of timers to start the shimmering effect2 M8 p2 i/ m- ^. u( T

$ |! J& P3 x$ j2 e        for(id=0; id<numLinks; id++)
2 V( m# P: w1 P2 Z* N% F
/ K1 B3 Q& G6 g1 b3 X        {
: L" e+ g, a8 A: v4 l" i0 ^
. n8 Y) T: t( E' t* O1 N                t=setTimeout('startFade(' + id + ')', id*100);
# ^9 m( e$ c2 z, m; K( o0 i2 \$ T
) u- c5 a! ~1 S7 R5 e0 o+ [        }
# L0 B6 ]' d6 ~: n, y4 a5 {5 g* y0 j$ E. j8 o
}0 V( V0 i2 _9 I& F3 G: y
3 K3 Y! y' D% r0 ]+ [( H0 U: {
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
+ M  w& \. [5 p& R+ w- m
$ z* T( n4 a' X3 n/ tinitLinks('#FF0000', 6, '#FFCC77');, |/ b/ ]8 z7 w% t# p

7 h+ \) E4 ?/ u# K//-->/ m) b# g( O7 Q2 ?3 R
+ B3 G( _) B6 ^; f# x  h
</script>
0 i4 R! L6 ?1 r<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元$ B7 V5 O& P" k* i5 Y: q9 b
</a>
6 o/ j/ e) Q3 z" q5 u3 n3 z: c6 Y<br>
( W/ r% O& `6 i( A# |1 ?<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>2 g9 ?; K; S! x" b0 v
<br>
% G. `( r, n; s0 r<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a># @9 p4 c9 c5 F2 U) ?7 f7 ], D* e# U
<br>        & l4 r9 B: d9 |) {3 H4 I
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
) |- a2 K3 Y/ s; p6 [6 q7 U<br>
" Y9 Z: j5 X9 _5 @2 M# g, z<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
$ ?2 E5 I: G- b) k% I% Z; H<br>
: z) J) }$ _8 n2 q- e6 n<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>
. z! R$ j7 N, b( y- o2 }; q<script language="javascript" type="text/javascript">% ~5 v1 O" v1 W: U8 @7 ^# A
<!--1 C# h( [1 Q  ]$ u
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
8 S; X% m$ R5 _9 z) y- J% M//-->- {, Q. z, T7 }( J/ Y
</script>