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

zw2004

<script language="javascript" type="text/javascript">
$ ?- W( {+ @  o<!--- ^! X0 D) t# I, D, E6 C/ }* ?
// convert a single digit (0 - 16) into hex; t( E5 [/ t) K* b
function enHex(aDigit)0 \( d! `" `# Y1 q, l; V- t  \
{2 S1 r6 R: d& A% ?
    return("0123456789ABCDEF".substring(aDigit, aDigit+1))
# [" N4 g( ~" z1 v}: T: d/ E- o2 o2 C. Q
// convert a hex digit into decimal7 u# r( K# S) Z$ H& U! G
function deHex(aDigit)9 \& ]6 e7 J5 d  J' d& C+ E
{
4 L, F/ t: J! J& N- ]* J    return("0123456789ABCDEF".indexOf(aDigit))
. L- w+ A& l* o$ ^4 h1 I, u}8 p% C  h* q" `# N
9 u5 H) U) U4 X8 d* Z
// Convert a 24bit number to hex
. D2 \) c! y" e8 y5 q  Nfunction toHex(n)
4 I8 B4 B- y) [{8 f0 T2 F+ M. n2 d( \
    return (enHex((0xf00000 & n) >> 20) +( |- }  w. Z: |0 q! h0 g7 ~
            enHex((0x0f0000 & n) >> 16) +; m' \3 C8 F: a2 J
            enHex((0x00f000 & n) >> 12) +2 Q" H2 L# E, J4 v2 B3 D
            enHex((0x000f00 & n) >>  8) +' I% ~3 C1 a4 `4 R( z
            enHex((0x0000f0 & n) >>  4) +
. ]7 A2 `9 P$ A            enHex((0x00000f & n) >>  0))
1 |! k0 K. A7 C7 D$ r. ]0 N( [' K2 r# o}
: F* I' f- N+ B7 B% B0 z! w( U' b// Convert a six character hex to decimal9 P" @/ J# F: H
function toDecimal(hexNum)
- W9 W7 ~4 c& ~% \# X- o{# [8 j! v6 B0 _- E6 W8 x7 |
           var tmp = ""+hexNum.toUpperCase()/ f- A# J) v- K; y1 e+ N, U6 w) m
    while (tmp.length < 6) tmp = "0"+tmp
  W) R( m( {; G, ]           return ((deHex(tmp.substring(0,1)) << 20) +5 f) m! J9 T3 F5 j7 ^! Q; D
                   (deHex(tmp.substring(1,2)) << 16) + * F6 f3 X! m5 g
            (deHex(tmp.substring(2,3)) << 12) +
) [; p6 Z- _5 O& O. X$ n            (deHex(tmp.substring(3,4)) << 8) +1 m, |& G6 x7 g" s4 m
            (deHex(tmp.substring(4,5)) << 4) +" |8 G; o+ a& G& h4 L, T2 e
                   (deHex(tmp.substring(5,6))))* ~4 v5 V' M0 Q6 @& u8 [& a
}, O) Q  q" p# g! [0 h
///////////////////Shimmering Links/////////////////////
9 P" Q5 p' d( T; [//global variables4 V( }" k/ g- |4 L( G. D
var hoverColour5 N* S5 n7 }' U$ \6 W3 `1 x
var numLinks;
( `2 T0 H- E' wvar rate;
5 f6 r/ [7 n' rvar numFadeLevels;
1 I  I" |  P8 dvar bgR;
* N$ |1 r4 j1 b+ T/ c6 Kvar bgG;3 X! }0 R% m! d- F: Z% t
var bgB;
5 a# X$ E+ s4 f+ R  n8 kvar currR;$ K( o; [9 A% W$ Q$ c: n
var currG;
( h) ~. D2 H5 y8 A6 H* m2 [0 g7 Dvar currB;
3 L  e) [; `' @7 i: evar count;& U# H( L8 j- ~6 z6 f5 A! |8 L2 S
var fadeOut;
5 E5 H, d0 f; m* d; a  ^6 vvar continuous;! {7 c' G% ]( x
var newColour;
% u! S/ b0 t0 m# r( R, C5 N4 bvar tID;
* }8 \3 c6 U! x3 _7 [var redInterval;. `5 o6 c8 t* ~* U9 Z
var greenInterval;
7 w+ u6 Z. l) i& `# v$ Q4 V6 ?var blueInterval;. E: Y. i1 t8 e' I
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
5 Y- N# x  g! s; U3 l4 m1 H{
& T0 c/ B; J" _. g* J. M5 t; ~        hoverColour = mouseOverColour;
; o8 _: S- o, z+ B* D' p1 N        numLinks = numberOfLinks;
1 G8 N, v- n) }4 B( d. |: Q        rate = 1;9 v% B7 O; S* H: g" C' ^+ k: F
        numFadeLevels = 30;
& ?7 {0 ?) H# K1 f' x1 }1 S        function initArray(theArray, length, val)
+ C+ ]; S  q# Z6 z/ T* ?        {
3 t, N1 o. O9 D. v: e  O, L" s                for(i=0;i<length;i++)
. j2 |' r1 T" U0 Z$ e" i                {
/ n1 F' v  G% k! s) Y3 {  x9 B                        theArray = val;
6 O6 c$ ~9 f, @6 m* u2 Z$ L" |4 Y                }
) I% V3 F; j1 j        }
+ U; E' I  F* z; ]. z0 l3 h        bgR = '0000' + fadeOutColour.substring(1,3)3 @) ?! M. i, |+ `% ?: ?- X5 K
        bgG = '0000' + fadeOutColour.substring(3,5)
1 e! k/ a7 S0 m' r        bgB = '0000' + fadeOutColour.substring(5,7)2 f+ f( h9 R$ `
        currR = new Array(numLinks);  q2 s( K! ]$ f
        currG = new Array(numLinks);. V, k; [# T" r. e# T- p8 U
        currB = new Array(numLinks);0 F5 b, ^9 g. }1 X4 ^
        count = new Array(numLinks);
+ ?3 c6 m+ Z  Q0 R8 s        fadeOut = new Array(numLinks);7 g$ ?* }. V0 ^& R' G
        continuous = new Array(numLinks);. v# P% H2 z# d5 @+ p/ P
        newColour = new Array(numLinks);
) ]" T2 e" E$ P+ y1 P* ~        tID = new Array(numLinks);
0 M% B* f9 T5 y        redInterval = toDecimal(bgR) / numFadeLevels;( ^6 Q( X* C) \6 R5 [" p
        greenInterval = toDecimal(bgG) / numFadeLevels;/ i/ ?) O9 x. {0 A; x
        blueInterval = toDecimal(bgB) / numFadeLevels;
2 D; E- D. k$ N5 W/ Z+ T6 h9 V8 f& n        initArray(currR,numLinks,0);7 G: @* e9 g7 [* \3 I$ }
        initArray(currG,numLinks,0);. B# p8 u2 i# m. O: b4 c
        initArray(currB,numLinks,0);5 n. E$ r- C+ A" p
        initArray(count,numLinks,0);
* @4 W. w/ \9 G. S0 o$ V        initArray(fadeOut,numLinks,true);
) Q, u1 g8 v5 R/ y2 c& ?# b5 P# \        initArray(continuous,numLinks,true);) L: I  Y! B9 v2 E$ `
}       
4 }4 L. O4 ]0 P# kfunction startFade(id)
2 ^7 Z8 y* n9 Z{, o5 O- B* b0 z% r( F6 {2 |
        if(fadeOut[id] == true)# |2 P9 j2 X" w$ z' ]4 W( N
        { /*move colour towards background colour (increment)*/. {& c# c  W! N$ I" \( S- E
                currR[id] += redInterval;
0 O7 o: w# g$ A0 g                currG[id] += greenInterval;0 F- E( w. k( [
                currB[id] += blueInterval;" ?, g. w& v3 {- V4 e) ]  ^
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
0 b9 m% S$ M( i' I( Z                if(++count[id] == numFadeLevels)/ f! G+ l7 L+ l0 i8 F+ F
                {0 o" t7 O4 @% |$ p/ v( S' H7 J
                        fadeOut[id] = false;
) K2 E3 p  i/ g# t7 ?+ k                }
3 C3 R8 k* S1 p- A" C        }
6 N: w6 q& y/ {( Q# T  n! {        else
& m& g, K- q7 ]+ h4 {- o        {
! |% O' q& F, c                currR[id] -= redInterval;. n; H( [6 y1 X0 W+ [& ~

5 w7 c8 @3 N$ H3 A. z! N3 c7 k1 ]                currG[id] -= greenInterval;
% _2 ]: x; p1 M
4 g5 e& Q0 d; J5 }4 i" P! V4 f1 X% N                currB[id] -= blueInterval;
" j( u2 g* K9 [$ q2 [. v, I0 ?2 h0 C& U. W' v) a
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);# T3 K, ~* h" o% t7 A

: e4 c$ r, ~# x3 X; d& ~  v! y. O                if(--count[id] == 0)' m2 e' {- Y; i3 L- W% \; o/ ?
6 ?1 C, y4 O0 e3 n$ g, i# Q
                {$ Y/ t- ]+ X4 w# y6 U

( {' W. i+ l$ v9 [                        fadeOut[id] = true;2 H" R' M- \" [3 T

, H" O$ S6 ^+ S5 |: j                }
( r) U. C4 j/ I) N  T: D  N! \6 z; Q6 S# j9 F- H: z
        }3 t/ q1 }7 v# \" G  M

% \0 L' L9 V" n$ P) J$ d' ]3 W        if(continuous[id] == true)
3 r6 g+ L- M% ?3 p4 N% L* s0 K( l: L5 z7 D
        {
$ N9 V9 u0 M% S3 h% H( N1 K
8 G" Z9 i3 }, Y0 A0 w2 ]: Q                document.getElementById(id).style.color = newColour[id];                9 g% K3 d; S3 o) F& D  S

: ~' H' ?& O) y        }; O; u8 q; Y8 u  n- j- @

* L, m/ c; G* B0 [, b( w  g" i4 M        else* g* V; E5 f  u" G  W

3 Z5 w. A+ q* c4 o9 Z( {+ m. E1 X0 K        {- W# q$ K0 o2 {. y7 Z4 Z

. c# V! c8 w6 o7 m2 r& I                document.getElementById(id).style.color = hoverColour;+ w! N* ?! I- M) W
; v( ^% X0 r! d% q8 g
        }
3 |+ W0 B& u" O0 n' p* y% `. x  d6 N/ t* d/ x9 ], m
        clearTimeout(tID[id]);
$ _3 l! L5 B7 j) [! X  y9 }) _! j6 r' N  L- x8 x! O8 v1 |
        tID[id]=setTimeout('startFade(' + id + ')', rate);2 L8 w0 |9 n6 O6 T# x9 M
; ?; E! e; f' J: E* u" v/ L
}  E+ ^/ J3 b* ^2 L2 [8 r

- F* |' B3 u5 ~  p: N  t' m8 Pfunction continueFade(id)
# d0 c& p, U& D  E3 w8 y
7 b8 M9 B, t' u  e! O- s& N: |{. i* [; r/ }# f' R
; S% z! ~. E& h9 d' Q4 ]
        continuous[id] = true;
6 h+ O% u. S. N) M8 O0 y; i
3 l- m" o1 ~) q! W  a+ \}
* u6 U' B3 n8 L: r& u8 B3 Z
6 @/ T' h1 J/ C6 i! ]! u% Pfunction stopFade(id)1 t* k8 U3 m3 ~) J% h. p+ M4 @2 s
; ~) x  e1 ]9 Y* [( o( W
{
6 v) v3 q4 n; `' W0 k5 ?' `2 R0 C* ?! T: @" K
        continuous[id] = false;) B, E. d+ n9 ^

9 v* Q. l7 ?  i) L' b}
2 q& t% h$ ]8 L2 r/ i! d( V6 c) o' \+ @  Q4 b- B
function StartTimers()2 Z% ]0 m8 r4 B+ r; P) p' c4 a

' d% Q! v+ {" D{        //set up an initial set of timers to start the shimmering effect1 D* }% O% Q1 E: D9 q7 t$ P

; b* B! h6 m7 f        for(id=0; id<numLinks; id++)
% v. a, T- |- I" A6 [8 f: U+ Y$ A; M. T, A8 @( e
        {# s" ]9 L* i5 U; ]7 z( a& T

0 J' O$ _$ T( k- Y/ y! }% Y- k+ F                t=setTimeout('startFade(' + id + ')', id*100);
/ O8 q/ _4 Z# a' [
- G* j3 y: z3 V9 r3 K0 b* O) F        }7 q7 K/ _- t& g: x, T

2 B$ z4 O+ a) @. o}
4 C: G/ O( i6 y! F8 X
, W) p, v0 H; @" R+ V//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')5 b# f- T8 ~" l5 c$ L" t9 m
5 t7 D- `$ W- u& K' j2 q
initLinks('#FF0000', 6, '#FFCC77');9 o' ?7 ?9 w7 m/ l8 b
: V; @2 z' p' m- B4 u: P
//-->" Y; v! x% b: f; l7 z1 _

2 E2 c: C# _- m  b# T</script>. h7 r/ Z6 l& ?- [2 c) M
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元/ c$ q# E' f5 q; a0 P# E
</a>) n' n) X; T5 R- [) m0 |% Q
<br>
4 J. G! z+ K0 L. u<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>1 H. {' e  C1 d( y; X( D* f# n0 v4 u
<br>
) u, h7 D1 i" h; |4 `) h( U; ~<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>: ~6 V5 A# U4 V( P
<br>       
; e+ l" y3 r0 d" h<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
0 B) z' G& ?, I- S% b% d- g<br>
3 d9 ?1 u; U4 `- R<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
2 k$ q; ]5 w9 W0 [" r7 }# n5 U<br>! [- \0 o7 _( k% R, ^; \, A+ {* S
<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>
5 Z, Q3 G0 |9 w9 a<script language="javascript" type="text/javascript">
: C( f6 \) _1 ^1 k<!--: o. o/ V  M' n4 R; c! p3 E
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
. o9 n! [) j) P3 b  y/ |8 V) r: L//-->
1 J5 T1 Q$ h; b& c/ b</script>