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

zw2004

<script language="javascript" type="text/javascript">- y( F4 g/ ?6 P: z
<!--/ o  u. }# ^+ |0 K: N
// convert a single digit (0 - 16) into hex9 ^. [5 {8 R- e& Z
function enHex(aDigit)* G2 `. m9 {5 u8 q- v
{8 p% X& t! z5 H9 L$ b
    return("0123456789ABCDEF".substring(aDigit, aDigit+1))
  I3 Y/ z. Y2 P. u# Q0 A2 L}- Z9 o2 F, _& b. G" |4 U
// convert a hex digit into decimal% p0 V+ g5 j* \1 I) ^: W
function deHex(aDigit)
4 f1 [6 L3 Z3 M1 |& ^. v6 a6 {{
% m9 p% C# h) f' p( w: L    return("0123456789ABCDEF".indexOf(aDigit))
4 V* i% I2 F9 z}
5 u& X5 a+ Z2 K& u8 f- _8 l2 ]+ s  v# A" M2 n2 @
// Convert a 24bit number to hex. n& a0 o1 r& N. I
function toHex(n)
% g& ?; z( N% F0 }0 L{
- K* }% }0 e6 P8 u# u. c2 C  ^% P0 z    return (enHex((0xf00000 & n) >> 20) +
! y1 i! P  N2 I$ m5 Q  x            enHex((0x0f0000 & n) >> 16) +/ ^* [4 [3 Y/ ^4 `; g6 Q/ _5 ?  D
            enHex((0x00f000 & n) >> 12) +: I2 x' s2 I6 L/ {
            enHex((0x000f00 & n) >>  8) +
, F9 V8 F. V4 B3 a" l% n# F% @            enHex((0x0000f0 & n) >>  4) +9 S" D3 l# m; g# O6 `
            enHex((0x00000f & n) >>  0))
: z( L* u; P7 H}% ]5 L& j7 p" s7 C& p  D
// Convert a six character hex to decimal
/ a( \4 d1 [$ D2 M8 Wfunction toDecimal(hexNum)
" J! B+ j6 O; C: W* q{
: w5 G1 R( X5 w6 g           var tmp = ""+hexNum.toUpperCase()
7 o0 r. m" F. e* s8 P    while (tmp.length < 6) tmp = "0"+tmp/ p4 z7 {# J' a
           return ((deHex(tmp.substring(0,1)) << 20) +/ K7 ]. W) [* l( E1 P/ U
                   (deHex(tmp.substring(1,2)) << 16) +
. U9 D' ?/ f. J0 Y: _* \            (deHex(tmp.substring(2,3)) << 12) +
- X* h# q( M$ h. D2 S. e            (deHex(tmp.substring(3,4)) << 8) +, t3 I0 `1 n: \" ]# W- q1 _
            (deHex(tmp.substring(4,5)) << 4) +
& v! w) Y# K2 m# K+ j                   (deHex(tmp.substring(5,6))))
" ~4 ?3 w# N, x}
( q- ]+ y% P+ Y/ e6 w. y+ X2 E///////////////////Shimmering Links/////////////////////5 _- q# A/ g8 w& t4 k
//global variables, L" u6 B& a: b! u
var hoverColour
: w8 I& X, E# n# _, h7 jvar numLinks;. x2 @" H" ^1 o5 O
var rate;% i- _" a$ ^5 X. Z$ O% J7 }
var numFadeLevels;/ F! \5 q: c! q/ M
var bgR;
: ?, f5 @4 J9 Xvar bgG;/ F9 g/ w9 x. Y
var bgB;
; X$ C0 j  N" J+ K6 qvar currR;# h* e- F$ x! p0 I
var currG;7 s) r% b/ s# \) Q6 ]. S
var currB;
- P# j0 f2 b% x# t" S; F( svar count;& b' f& L2 c2 H& S' R( `3 s* w
var fadeOut;
1 I: O' H3 h! V7 i: _5 ?; V9 E. t* xvar continuous;
) v8 B% h! ~& n- X7 i% u8 @1 lvar newColour;
- g4 R, V2 a: T% ]$ Nvar tID;* @, q8 \" b, r2 ^7 Z0 @8 P7 u
var redInterval;
4 B* \, p4 j% \8 k( G( y4 p7 Cvar greenInterval;/ [) G7 v' A, T1 t9 d
var blueInterval;
& ?0 N2 g. I7 B8 Y  ifunction initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
/ m4 P3 l! I% c! r' O* |' [{
4 C; x9 R, s* r  G4 Q        hoverColour = mouseOverColour;
3 s# `0 @0 I! [1 n- P" P0 e        numLinks = numberOfLinks;
  z" i) ]3 T# f, }( ^6 Q# a        rate = 1;
; \8 I+ A# A9 t8 ]        numFadeLevels = 30;
3 u; f/ ]; ?2 w4 K        function initArray(theArray, length, val)
+ A. E5 Z9 F% h        {8 j' J; S: a  n  i( {. x7 e
                for(i=0;i<length;i++)1 f" H8 {3 s. j. J+ S
                {* P6 Y/ s# H/ v8 R  w! @3 M( x
                        theArray = val;
2 q. l# g9 T6 v& v" F2 \                }9 A8 j8 k" y  L9 }* @% j
        }9 t6 t4 D% t1 G/ {  ]
        bgR = '0000' + fadeOutColour.substring(1,3)
; @4 Z: F# ?# L        bgG = '0000' + fadeOutColour.substring(3,5)
; C5 @% c/ p3 h; f' n1 Q        bgB = '0000' + fadeOutColour.substring(5,7)
% f/ I/ o4 ]) m2 c2 K        currR = new Array(numLinks);
+ W# r* R9 ~0 l! _- m2 `        currG = new Array(numLinks);
  N7 h9 E$ s0 H4 j1 Q        currB = new Array(numLinks);$ O6 B* G$ T8 G; |; x
        count = new Array(numLinks);+ ]3 W2 O3 Z1 k: J4 p' f
        fadeOut = new Array(numLinks);- w. x9 Y3 [/ i/ A. ]
        continuous = new Array(numLinks);; ]& W7 F- G' h5 Z; J% y( Z
        newColour = new Array(numLinks);( H2 K2 o" T4 ^6 h# M; n: w0 o
        tID = new Array(numLinks);$ z, d4 g# b2 |8 a# V. a
        redInterval = toDecimal(bgR) / numFadeLevels;
! T; ~5 [+ o/ C5 H3 a- T  h        greenInterval = toDecimal(bgG) / numFadeLevels;& H3 ~3 E7 m1 M4 f* D3 Q6 I
        blueInterval = toDecimal(bgB) / numFadeLevels;
8 @  f  `4 F0 H) V5 ^        initArray(currR,numLinks,0);0 g4 c% |" |, }0 {1 Y' z
        initArray(currG,numLinks,0);
1 I& W% E3 n5 n) e' ]" Q9 V8 x0 A) k        initArray(currB,numLinks,0);
% O1 Z5 Q8 D( u( T8 d% R3 X        initArray(count,numLinks,0);
& g+ u/ U0 f/ B& ]        initArray(fadeOut,numLinks,true);
& w2 d' ~( A- n1 ]. X6 \+ y# p        initArray(continuous,numLinks,true);
, B) }) n) U2 ?9 a, `}       
% }# @4 D* v8 nfunction startFade(id)* V2 ]8 t# i8 a/ Y, g
{
* b0 x& ~# m- x" r        if(fadeOut[id] == true)
" Z% }/ d% p2 R6 F! n        { /*move colour towards background colour (increment)*/
/ J( N2 }6 `9 M0 v3 j9 `: Q# t, s                currR[id] += redInterval;
+ s1 O! a) X; N- t  y; }3 T# U. q                currG[id] += greenInterval;) ^! ]9 R+ E/ h8 y
                currB[id] += blueInterval;# A" w% ?9 ?- [7 N/ i* u" z
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
6 b+ t$ j- `( f                if(++count[id] == numFadeLevels)
1 C2 d( m6 Z/ b# O3 w' [# D                {. f/ w5 R7 O1 v0 |9 v7 B
                        fadeOut[id] = false;: c7 h- w. R. Z5 @" y; W' D
                }
4 Q( K% a- i! Q8 p: V% i        }
+ K! J; J4 J. \  k/ q+ p" r# s- c& {% g        else+ k8 y+ i3 W: x2 H( @7 O
        {& _! W: R2 ^' k
                currR[id] -= redInterval;+ a; \/ w9 r% x1 `) R/ M

7 o+ f4 Z' }7 Z/ y9 k. x5 @$ v                currG[id] -= greenInterval;
7 ^0 I6 r5 Y6 \8 P# B
: L* V& w4 ]- I; l# x, k                currB[id] -= blueInterval;- e& q; W* ~. M+ [7 M! Q7 W6 y! N! {( I* _
: R4 m* D$ o1 q. q; a  o
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);) g1 i) |$ X' ^% I4 ]6 g

7 O  i9 i- @9 g0 Z3 J( ?& ?                if(--count[id] == 0)/ l5 J' @  h  s/ D  C0 z0 E+ ]

* i0 D& p6 r% a! j* g8 y% s                {
/ c- d5 n8 |# z! r
3 H& ?* o: P, z/ i                        fadeOut[id] = true;
* M4 P& L2 w& c! o# o' u" O
$ n8 j: X! K6 g2 H3 H9 O3 l                }
! X0 z% h+ W' x& c; F# K6 Q) p7 W1 a0 {" }$ O% n
        }6 a1 s4 M) [. y1 E5 [# e+ T
2 u0 d' S- S# _8 N  C+ Q! g5 E# E
        if(continuous[id] == true)5 u. U' X+ [' Q3 n7 \* ^+ C

) k4 A' i$ E' W, L' {7 Z        {
$ N' ?) H" j9 {+ N) D
8 O* ~( @9 F" \, K$ f3 u% t                document.getElementById(id).style.color = newColour[id];                1 t  z- F. ]" v' c, ?3 X
- r! L" [9 c; e3 ^. C' B' [
        }; {8 ?7 [5 j' Z. ?$ n

- S5 q5 ?% {$ V- |4 c/ s        else, R8 g& y) P* r. ^
. C( o$ e" t3 r1 i
        {
- K) h! d5 N" s% s" Z2 @/ r! q" Z
: z, g  B7 y2 Y5 M+ \$ |3 [! ~                document.getElementById(id).style.color = hoverColour;
! ?' ^6 V- S: R" G8 O8 {3 O
( M' D& |+ R, |; o        }
1 g+ ~0 q& {) {( L: y% D
4 U0 W, l1 V' m4 N: G+ e" }9 ^        clearTimeout(tID[id]);6 ~$ @- T$ v5 N+ S( v9 c

0 s# I( ?2 {& b. K% D& Y+ [        tID[id]=setTimeout('startFade(' + id + ')', rate);3 Q7 ?# X/ k) i- l7 b9 E  j
5 G1 O$ o& }! ?# m' \5 ]: O  j) R( F
}5 v3 E7 f& `+ Y+ C  ?- M* a
  D4 F- N/ O0 h9 P2 u0 C
function continueFade(id)5 V+ g& {& P2 U& @: [

( u% [, j, Z) e{4 ^) H; x5 n. U4 \" ]  h
* a( M% q/ u( k: z0 }4 ~
        continuous[id] = true;& R+ t( @( j! M0 l

) W) b# m5 i3 c( [! R* i* p}
1 r( M+ I/ c+ i" H6 c. }6 z# Z" D. R4 h
function stopFade(id)' s" A) r5 V9 V0 G5 @
, ?9 b2 z" x! j9 x' m2 B$ j1 |
{
, y& G# w+ `3 z/ ]/ F  f% b) S+ c  R
        continuous[id] = false;
8 ^" {/ L; H$ a% I4 N: q: R/ y# T0 A& e/ Q- ]2 K
}
! k' E* }! ~" m6 m7 |' k+ S% T6 `3 T0 ?* ?: P2 d7 S" m6 j( _
function StartTimers()
- G; S9 ^* B. \, b& s4 x3 x# R1 P3 z0 p5 f4 e! W" f
{        //set up an initial set of timers to start the shimmering effect% ]8 o- ~9 p7 [# A1 G) N3 N
3 M# Q( Q7 N. h. `" L
        for(id=0; id<numLinks; id++)
" |3 c5 v8 M( D" d  z: T  D! I
. r# C0 I, k5 X: z# R/ O; s0 Q8 [2 C        {
5 H4 K1 _% e" Y
/ [$ I9 U7 y5 I3 [! D9 O                t=setTimeout('startFade(' + id + ')', id*100);9 o( a: L  \" W% W
; k( I8 ~: C8 A& Q* a& Y9 X! g$ K
        }
; C5 W" c  l- L8 h, H8 x
3 p, V, u5 ?9 T2 c}  u1 Q4 d5 A, |

6 o9 |& o5 k' ~& O& i//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')6 k) H; f* m* E

1 G- C, k+ D: D4 w6 Q0 Q% xinitLinks('#FF0000', 6, '#FFCC77');
0 s9 e, U- r( S5 D5 `" s; X  c4 I" J
//-->) b, I0 B% y" X9 {& F9 [

$ f0 |7 _* T9 e( w% \$ `, ?</script>/ _- U) ?* d  a
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元
! O. x* D- k, B) a; r# t</a>
% R6 \5 E  P( V! Y$ z$ F0 h<br>
' y% X% t8 K0 M* P, _% s( Q( v<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>5 w" H" k1 B0 s; _. h! a7 k& q' ]
<br>
4 M7 Z* E! L+ \' m9 `<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
) t4 y+ g1 g- a" Y+ S& U<br>        & h, G& Y  x; I: M; v, u" p; M
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>4 ?  c9 Q) z. y5 Q/ p8 J: Z
<br>$ k# [; G! X! j: O
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>, z  k% o4 q! b$ i
<br>5 J5 q  d% W$ C
<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>& O- P0 W2 X' P2 G2 R; k/ P
<script language="javascript" type="text/javascript">8 ~5 u+ d* C. c% @, F
<!--" D- D, K" _% K3 @9 Y
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
6 |) i) G8 P4 |//-->
% F+ u# H# e8 U2 l9 n  e3 O</script>