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

zw2004

<script language="javascript" type="text/javascript">4 B! S4 `2 u: S) _- b
<!--
% |7 t$ B2 m+ ]' Z// convert a single digit (0 - 16) into hex
& @( V( i- |& cfunction enHex(aDigit)3 z* R) m$ S3 o$ f
{
! {$ P. i$ @3 l    return("0123456789ABCDEF".substring(aDigit, aDigit+1)): ]; d3 D1 r) ~! T3 s
}7 G$ s% h# M  v; O! X0 }( A
// convert a hex digit into decimal! m: P# e3 k4 D" a9 ~# K
function deHex(aDigit), Q5 [/ S' w5 e" X
{& \3 P- G) `' e4 {7 z
    return("0123456789ABCDEF".indexOf(aDigit))
. k( Y2 a3 r  a8 g6 l}
* v* E& f) y( J3 D8 C: k
# O, `& p+ r# t$ k5 p// Convert a 24bit number to hex
3 Q% z6 J5 K) Y$ L: ]2 W+ Dfunction toHex(n)6 d: ~+ `3 i( r  k5 f1 P, T4 o
{, p& n3 j6 A/ I0 e) v. q
    return (enHex((0xf00000 & n) >> 20) +. B6 Q1 s) A4 l; _0 P' z5 x
            enHex((0x0f0000 & n) >> 16) +
4 z9 f8 p8 f7 P. |& X            enHex((0x00f000 & n) >> 12) +, w( j# D5 U% K% J
            enHex((0x000f00 & n) >>  8) +% n/ c/ x0 f/ R4 I
            enHex((0x0000f0 & n) >>  4) +7 s) p$ x7 {$ ^0 H
            enHex((0x00000f & n) >>  0))
: Q: N. W# G& d' v}
" w8 t9 T; [2 _// Convert a six character hex to decimal
4 E3 a* p( ]5 ?; e. ^) Dfunction toDecimal(hexNum)
. S2 c' f( f  V{
: u3 S: q/ S; D( E4 _3 P/ z           var tmp = ""+hexNum.toUpperCase(): m: A6 z* @( S5 S* l
    while (tmp.length < 6) tmp = "0"+tmp
0 M3 a) S2 |/ f; H* r  ]6 C! Z           return ((deHex(tmp.substring(0,1)) << 20) +. c& m" h+ F& _, g* K3 t1 K
                   (deHex(tmp.substring(1,2)) << 16) + 1 Y' d, q, U4 a& z2 t$ T
            (deHex(tmp.substring(2,3)) << 12) ++ i* Z, z7 O9 h7 w# c
            (deHex(tmp.substring(3,4)) << 8) +
2 D7 b3 X" U* ^8 N- }            (deHex(tmp.substring(4,5)) << 4) +
& N8 A! w( [% J8 d                   (deHex(tmp.substring(5,6))))$ g2 ~/ R# r- ~; o  c) ?) U
}8 ]' f! }9 b9 u. @
///////////////////Shimmering Links/////////////////////
, X' ^/ g. I6 |1 ?- o4 N" R//global variables1 F9 k/ T9 `# u
var hoverColour* Y; D. x2 x: N& w
var numLinks;! e2 F3 n5 F  s. d* ^
var rate;# A) d' P% X+ Z+ K" B2 l
var numFadeLevels;' O) a, J/ _: S( [7 o" _- g
var bgR;/ e& |& F) V+ W* V+ {: l
var bgG;$ Q% a5 }7 \7 a& ]$ u
var bgB;
' m) K; `" N' L; e# s/ z+ l9 u( @var currR;
! O' F6 ^+ j, ^: t8 w  D( ivar currG;
$ g  W- p9 X: J" a1 O3 N, Svar currB;( D" B% q/ c2 P6 C7 ?! k
var count;
) O0 k; ^; i' u, a5 Ivar fadeOut;+ `5 I( u% R; \; {! i) m9 r+ S& q$ s
var continuous;
# u" t  I$ ~% \: J. rvar newColour;
9 |% Q, S- Y: ~9 Z  gvar tID;2 Z5 v/ G8 q. z* v; {- F  s- |
var redInterval;
; j$ t" V& R! c( Q6 svar greenInterval;7 ?' }5 `5 `# u9 p* O& W% O* D
var blueInterval;2 e  ^7 A4 I! `1 O$ U6 ?/ L) f
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)5 m6 y/ K$ d* {- D  b
{4 c, X' z) }# k1 [8 y
        hoverColour = mouseOverColour;
* b. `" v' F+ g# J' z' b8 t* n        numLinks = numberOfLinks;
  b$ ^5 l7 V9 n' V* k" i        rate = 1;
8 ?; ]+ P0 _$ ~        numFadeLevels = 30;5 b) t! o1 U1 s, f
        function initArray(theArray, length, val)9 o) [4 }7 m! Y' o9 w/ l
        {
3 q& Q3 ^: z8 _! [                for(i=0;i<length;i++)# ]; v* i" l* W. }7 p  L1 }
                {
, E) p( z( H5 |- B8 ?                        theArray = val;$ D1 r1 q% I6 s9 T4 v+ C7 |& T9 O
                }
3 e9 ^, n9 k. T" V$ E$ j        }
6 G" T% R  r- D2 r; v- ?7 o" |        bgR = '0000' + fadeOutColour.substring(1,3)- N6 k# e7 E; P" X1 X  \( j5 A
        bgG = '0000' + fadeOutColour.substring(3,5)
  t  d4 x- \3 `( U        bgB = '0000' + fadeOutColour.substring(5,7)( }! ]& T8 b% d
        currR = new Array(numLinks);
5 R; N: \) b' w4 t/ V- m" [        currG = new Array(numLinks);
5 W/ F  T  L) u( o$ [5 r7 c        currB = new Array(numLinks);" i! r# L% {0 T- i- ^
        count = new Array(numLinks);% F- V- y2 i1 r
        fadeOut = new Array(numLinks);" C$ k% e, t/ m: G
        continuous = new Array(numLinks);
- Y  i- }" T) W        newColour = new Array(numLinks);
  s% k; b5 T* P% j* Y& F( \! v        tID = new Array(numLinks);
5 o* a& j) M6 O* V- Z' Y        redInterval = toDecimal(bgR) / numFadeLevels;
( h" r1 o( V* N5 S8 \! M        greenInterval = toDecimal(bgG) / numFadeLevels;
+ C( J0 }  \# G. l! [' L$ |. R        blueInterval = toDecimal(bgB) / numFadeLevels;
3 v( M$ _' f4 L2 h  R        initArray(currR,numLinks,0);/ r1 M) E" [* H0 `6 w
        initArray(currG,numLinks,0);
/ `+ Q: r( q$ S- a1 E/ t        initArray(currB,numLinks,0);
( \2 Y! C& o" \/ T        initArray(count,numLinks,0);5 d. _) C. e- @/ f5 W& U8 Y! w
        initArray(fadeOut,numLinks,true);, W7 p" `9 z8 m8 G/ i* T
        initArray(continuous,numLinks,true);
9 A- v2 _) l& `" ~* w3 q+ ]1 s}        ' `" r2 t/ {1 y/ q5 s" B
function startFade(id)0 V+ o  g# |0 I: l4 t' W' r) z
{
8 m) v5 i2 p' K0 ]. w        if(fadeOut[id] == true)/ _) A. y: G& d+ y
        { /*move colour towards background colour (increment)*/
7 I6 e3 I+ L# A9 F2 U4 b; k                currR[id] += redInterval;
% T% G* P8 n9 r, [                currG[id] += greenInterval;
  V" E0 |0 ?& Q4 w2 e( K                currB[id] += blueInterval;' w' }$ R2 N0 T
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);6 Z% V" O2 Z2 Y5 L' t
                if(++count[id] == numFadeLevels)' Z9 {# Z3 h5 E' |# S
                {
/ u6 P+ v* N9 t9 P, l1 c+ `) t                        fadeOut[id] = false;5 w6 S# V, c3 L  F" S% P! l5 D
                }& z( G3 |/ e* [7 Y+ l9 F5 {
        }
. U4 {, b4 ]2 M9 d% {0 e/ n        else8 u' ^# h& Y/ q3 U" ]
        {  g) W1 ]' O3 ^5 A
                currR[id] -= redInterval;2 g2 K; j  Y, ^. {

3 y/ P' E, x! G9 Y, w                currG[id] -= greenInterval;( a3 t2 r# M* C4 v

4 t2 U" F' l4 p! e% k                currB[id] -= blueInterval;
$ R& f+ X! N7 S  U1 _, M: C
) p4 V0 d& S$ @/ u" p                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);* l* n" U2 t5 Q$ M* j% M$ E

' ]4 r/ Y: I3 {9 {! e- c, S% B$ L                if(--count[id] == 0)
7 q5 s% |& E" C: Q0 `9 D
0 J* F, X0 `0 n( E0 T& [6 N' y6 k' a                {
9 q- T# ]! T. O: ?1 V; V. _. o  F0 g1 Q; r
                        fadeOut[id] = true;
. E$ q* E2 b: s
* V" I" V0 _2 P/ N+ i7 C                }0 y0 ~9 _+ Q" _: }" y. _1 ~# S

2 j9 x  {  }) y0 s        }: q+ C# t  w' S* B

% [& ~' [6 U/ l5 [        if(continuous[id] == true)
6 \- [- s  S# Y
( P8 B$ p5 M2 J2 V        {
3 F) \  b9 {% Z) }+ x1 i! v! q8 e& P+ P
                document.getElementById(id).style.color = newColour[id];               
9 w) q- Z! n5 t- L- c8 g( i' g) ~0 f/ z: S5 M
        }
7 e- x# m* }1 I: h& a
' _& b9 ]& `9 r2 ^3 z        else
- x) O; K& e+ l/ l" |; F/ s/ f) Y7 N' t; J
        {1 {# q/ }  y, g8 j

! p5 X5 i: b9 S) m+ ^8 J                document.getElementById(id).style.color = hoverColour;
( B4 ?! @/ q4 e, U) M
9 }- W  V! @  Q) t2 f8 B. ]- N        }
% |* s1 H. n8 c- `) @' ~8 r% k3 |+ Y+ j+ y
        clearTimeout(tID[id]);, ~8 i$ f  h% i3 r& Z8 f7 q# h
4 `) M8 |5 h& s& F! k: N+ S) V* J. t
        tID[id]=setTimeout('startFade(' + id + ')', rate);
7 ?- E2 Y0 ^. F6 a/ J; [( t  S+ b0 r( U$ `
}8 S1 `+ N) i5 w% P: D' ?% Q

/ h7 K" b& Y/ O# Z* D$ Afunction continueFade(id)4 }/ q' {7 ^7 E: C
2 r- @, X, c# E( r* R5 |4 q
{
- g4 Y6 |: @# w) D, D3 n
) {6 m' ^+ s( b# z        continuous[id] = true;9 t3 m% f7 w- w0 @0 {4 Z! P# O

, ]' Q* I+ l! W}
" }0 b# F. Y, t: S4 {/ g7 J7 c# n- e. z- p: e+ j; h* B
function stopFade(id)
" V# U5 V* W  b% Z9 `6 L# M
3 `# c* g: n8 i{
7 E4 c8 V" ~7 m9 q5 O$ s7 v; c0 R3 O4 Q; O$ t1 ~$ S6 Q
        continuous[id] = false;
  v( N3 Z1 }" n/ C0 l/ p% U$ q6 ^" U4 S; p6 N! K* b2 @
}
0 p: }) S: m7 v" y. u7 k1 [6 ]8 T" }1 v; I
function StartTimers()! }2 {8 F/ |( a1 l0 q6 p6 w
; q1 _. z- C0 i) d- N) X. {
{        //set up an initial set of timers to start the shimmering effect: o' A( |4 s4 Z, D7 T

* F/ t. g. |# Y  p0 C        for(id=0; id<numLinks; id++)
' c1 D: O' f. `; l  b$ Q3 ?' Y
6 a+ n4 _, ~: s# X& {        {4 `/ l& f6 i/ D
/ p/ g' k& ~9 Q+ M3 w
                t=setTimeout('startFade(' + id + ')', id*100);- q% q- A5 z, @, e* V$ q' T( ?, }0 H
" k* N1 m* [  e- y2 M% `  Z
        }1 {0 W$ \6 |5 S/ X6 e
5 }8 a1 V2 \" g, ?! q+ n) o
}3 b# r& W& \7 Y8 A+ s

: S- B" n  i# w6 W; g) D//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
$ c7 x5 i1 W- f- W' V: q# R% E' ~$ M
initLinks('#FF0000', 6, '#FFCC77');8 R; R+ \. [$ I/ x

' x$ ^% A3 |* ?% V# q; k//-->! @0 u& g3 K# K1 E

. |; y& b- D+ Y! Q4 _  H</script>" z# E; W8 t6 e
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元9 ]* {, a$ G! W3 t, X
</a>
( {; f# `5 A& D1 |3 s! b<br>
) x' v1 \( J- J- D8 S8 l( Q5 z, }<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>8 f0 C. t$ r, h8 A0 `
<br>, N2 r  z! m3 u1 s- e
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>3 D7 F6 w3 W9 x0 E; ~. G
<br>        # D1 K% C! V- u3 O8 j9 X
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
' w5 J+ m/ O5 H  h( I  O<br>
. i! ~; m8 T6 P- Q<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
9 t" h% f1 F* T, \4 ?<br>' |" O3 F% B1 y
<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>
) O  }& g/ [# G: X8 ?' j<script language="javascript" type="text/javascript">
; A1 R2 z+ G9 M. K& H<!--
/ Q( j# [# o. B. U( RsetTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
! p: Y2 l; x/ W$ m1 |1 F" G3 ]- i//-->4 ^1 B0 b5 [5 O
</script>