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

zw2004

<script language="javascript" type="text/javascript">
9 R! ~$ |; y, ^5 {2 v, a/ |8 I3 g<!--# ~# u! K- ]+ o7 }
// convert a single digit (0 - 16) into hex0 N: J5 x) a3 z- N
function enHex(aDigit)
! V! p3 f  `. G{6 v' R' y$ l  v) |
    return("0123456789ABCDEF".substring(aDigit, aDigit+1))! g2 Z- o1 W* X+ R7 J9 P
}9 ^  z- j9 Z* c: |! J7 l6 z) P
// convert a hex digit into decimal! J  c$ i8 g8 o6 {* x* s; [
function deHex(aDigit)
% }; u- M& \" u" q+ S' f{
% l& ?4 d* e0 ^9 z8 A  I6 e8 r    return("0123456789ABCDEF".indexOf(aDigit))
( V9 L( Z& t3 \5 a4 ~/ d9 Q! W$ \}
* A, S, T; t0 d& q) R3 }& y5 p' t" }/ I- E: ?% F
// Convert a 24bit number to hex6 ?* z4 k8 o* |
function toHex(n)
4 s) ^$ s( c$ L% Y6 {4 ^, l{
6 B* x$ {$ Z! t0 @9 z" b    return (enHex((0xf00000 & n) >> 20) +; ]# m7 `3 `, m2 L( n" a$ q9 z7 @
            enHex((0x0f0000 & n) >> 16) +& G/ w" i' B  p. k. f
            enHex((0x00f000 & n) >> 12) +$ D1 w* X! l+ ^/ O# X& ]& ^
            enHex((0x000f00 & n) >>  8) +
' O, t. F8 c6 t. ?            enHex((0x0000f0 & n) >>  4) +3 c, `9 m% y, e/ ~5 D3 ^
            enHex((0x00000f & n) >>  0))
4 [" T  G6 i+ w" A8 M9 S: x}4 X8 X, N( B, K. A
// Convert a six character hex to decimal
7 ~! S/ p9 Z0 P' e" [8 C7 k' r# Wfunction toDecimal(hexNum)6 V' d) d- H; X' g' c7 i3 t
{
1 a( b. i! b: c8 X4 ]9 ^( A& a' Y           var tmp = ""+hexNum.toUpperCase()7 S: _* K# k  L8 ?. ]* k
    while (tmp.length < 6) tmp = "0"+tmp
5 d' v7 x! e/ ]7 |           return ((deHex(tmp.substring(0,1)) << 20) +; [1 x1 p, w2 b
                   (deHex(tmp.substring(1,2)) << 16) + - X+ {9 P2 H. K+ V8 ^. F0 n0 J
            (deHex(tmp.substring(2,3)) << 12) +
% H" }* G! R1 z4 Z; E            (deHex(tmp.substring(3,4)) << 8) +
; R0 ?9 z. x( `* ?+ `" o            (deHex(tmp.substring(4,5)) << 4) +
6 A+ Q0 n+ l, N                   (deHex(tmp.substring(5,6)))); Q: i$ f$ C. q, y
}$ E, @1 G( }6 c8 ?1 N; v
///////////////////Shimmering Links/////////////////////
1 i4 q+ g; ~8 E% F' L  E7 `/ u+ `//global variables
5 m. j$ P! \; |9 [  Yvar hoverColour
, m7 `9 H+ q" Zvar numLinks;
' l! P, D# h! r4 Dvar rate;
1 B$ \! ]# V' r/ m3 J6 X4 M% lvar numFadeLevels;
! s- i3 m2 i( t+ l0 ]2 I) Cvar bgR;$ I4 t( \; E( k
var bgG;
8 p# V8 O9 \, x  P2 E/ \, T# qvar bgB;
& K2 L, H* Y4 C( gvar currR;. k" Q' m, K$ H8 d- @7 n: G
var currG;+ \& I  e7 A) {# v6 s
var currB;5 q! X1 }! m. [/ X0 q3 j) J) u
var count;
, J/ k6 @5 i) n/ R7 pvar fadeOut;9 D7 }0 T4 J" M/ j, a& c* P' g
var continuous;4 i5 h3 N& f! x: e
var newColour;
- U! r+ p+ u$ x3 X9 Mvar tID;
! t% r( }9 \: |9 J) a' n. wvar redInterval;
; Z( u0 g$ E) v7 P! h$ V3 ovar greenInterval;3 M& C  g, _$ h1 ?6 \" c% I* W, B
var blueInterval;9 z( v7 u  G/ d# }4 S% @2 I2 U1 J
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)9 Q, v0 a* P' x# z& j5 x6 k
{$ ^2 w% A$ ^8 f! `
        hoverColour = mouseOverColour;  F8 I7 L9 U8 L
        numLinks = numberOfLinks;
; b8 s/ p' u. v; Z) n1 @        rate = 1;
2 H1 X) m# g- G5 A! j; N        numFadeLevels = 30;
& x* P6 p+ ~7 n1 |# P. p: j; ^; K        function initArray(theArray, length, val)) T; J% E0 ~- Q" c" G
        {
3 R! T% T3 Y. [, m: J  N                for(i=0;i<length;i++)- U& Y( ~  h) e3 A# j9 n
                {: s+ L3 A+ z# P, Q$ Q5 t
                        theArray = val;- f5 K4 D( t1 H% e: }
                }
: N  c+ Y) c) Q4 @: l4 ^7 W        }) G+ i  y; y. x1 c1 R3 k( W/ j4 K
        bgR = '0000' + fadeOutColour.substring(1,3)8 ~' K* k3 S2 w$ E5 ~# P& G
        bgG = '0000' + fadeOutColour.substring(3,5)% j5 k, F, E& C2 `$ w
        bgB = '0000' + fadeOutColour.substring(5,7)
1 D$ M$ z2 V% A; A2 e7 f' V3 O- O        currR = new Array(numLinks);5 [  E) a( z2 q5 C' o
        currG = new Array(numLinks);0 h- L  N+ F3 ?" Q9 i
        currB = new Array(numLinks);: J# K/ b# R8 l# K% @$ Z3 N  I/ a# q
        count = new Array(numLinks);
! W8 A. m) K; K0 E  z0 d! Z5 z" r        fadeOut = new Array(numLinks);
, L  A$ T  p2 h        continuous = new Array(numLinks);* n( d) D5 H* i# `, ?8 v
        newColour = new Array(numLinks);
) t: g) M" b; T! z        tID = new Array(numLinks);
. n1 `' G0 Y# n: P& ]3 B        redInterval = toDecimal(bgR) / numFadeLevels;9 J/ c& _0 \) f/ ^6 {6 ~) n/ M
        greenInterval = toDecimal(bgG) / numFadeLevels;
( Q8 o& `" N4 K5 z8 i        blueInterval = toDecimal(bgB) / numFadeLevels;
, S* ]# v4 t2 G1 u3 H1 K        initArray(currR,numLinks,0);# [  d: ^* P2 X; r" B
        initArray(currG,numLinks,0);; ^! H- p2 x: e! ]' j
        initArray(currB,numLinks,0);6 \. q9 h- Z$ @4 z6 l8 u# ]/ v
        initArray(count,numLinks,0);! j. C' m' ]2 i$ ^! H# J6 Z
        initArray(fadeOut,numLinks,true);. @7 ?+ O8 o" s5 U* E4 W5 x( F
        initArray(continuous,numLinks,true);& [6 k# B6 t+ S9 i! c9 @
}       
$ Z: T6 M) ]2 L5 l0 Rfunction startFade(id)) p, [* [9 w0 E% q& h! z/ ?
{
/ m/ O. k) e. |4 H+ K- R. I        if(fadeOut[id] == true)& t8 J& N- G5 C7 e. t" l
        { /*move colour towards background colour (increment)*/8 _7 A& C5 S- X: @9 [' j* W! G
                currR[id] += redInterval;' M* o6 C6 d: o6 F
                currG[id] += greenInterval;: l6 |9 T) K% N3 i$ H' }! l$ I0 J! x  Y
                currB[id] += blueInterval;- L' Y* G) v$ [  z2 I0 _: I
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
9 I) _4 J8 T, Y8 H: e; l9 r                if(++count[id] == numFadeLevels)8 [* a8 m+ p9 e8 _' ]
                {1 Q6 Y5 D* a+ Z3 @% [
                        fadeOut[id] = false;) O$ b) F2 I0 Y7 c2 @* c5 V7 Q9 f5 |
                }
# k0 x3 `8 d' X        }
; M. {2 \: c' i* C6 a6 B        else
! o5 `7 o6 M  E- {) N/ Z        {1 A! s# e! n- e4 d( j7 p
                currR[id] -= redInterval;
: J1 Z# V! a+ |+ }' M) E: ~
( T8 [8 E/ I9 L- U, h; e# f( ^                currG[id] -= greenInterval;
* @; z1 \- G0 ^8 q+ o$ f, z3 r
" I; H# M+ C4 J- o# t                currB[id] -= blueInterval;# M0 O0 t8 |8 D! K2 \  d3 ^

7 T8 m( P/ a: [# I/ E+ `6 V                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
! ~$ j3 p0 v1 b! c% @! b. l/ t# D" N8 n6 P2 E
                if(--count[id] == 0)6 U: |1 c2 Y" g2 _' o+ ]  d
1 U' d$ C  G$ j+ m1 Y. d2 [
                {- R/ ^' J7 W6 v
1 I( u7 @, x1 ^
                        fadeOut[id] = true;
( T1 i* a6 q2 Y7 }# Q: {0 a* C; h5 C# Y3 a1 G( T0 m/ t
                }
. E/ F, e+ ^7 h7 c$ o- c6 O8 I9 Z6 [) r4 v% a' S
        }% y4 J# y) q. k- k  s

" f- O: @: x5 m2 }        if(continuous[id] == true)2 S2 k4 i, c2 q7 k; d' `) E

; p  t5 K4 g2 L. B; q9 A5 k+ p: t        {
& h5 ]4 |4 s0 B. f# C
% k$ g5 L* u1 p( Q7 G3 G5 |                document.getElementById(id).style.color = newColour[id];                8 b9 S" S6 h. U  L% O3 r% b- s

' h) }/ E: [% E9 T        }2 m4 N3 i: F0 j' ~  f8 f6 [
" P) D7 r+ o) g0 K
        else
4 y) s& ^- d, a  m7 S! r( y7 J
        {
3 q4 M5 `1 }% W% h6 Q. Y) L5 s# {' C4 N7 Z
                document.getElementById(id).style.color = hoverColour;
! e, }1 @3 [: T0 F; s7 W2 q
4 i7 \7 p; F9 l1 D& H1 \3 l, s) _        }
9 o) [0 X, T, b+ r$ _0 X" ^* \5 N% l( v* G. H
        clearTimeout(tID[id]);' N* j4 S( E( \$ }' U; G( s
' D# W/ I& y- [5 V
        tID[id]=setTimeout('startFade(' + id + ')', rate);: k2 `/ L  `8 ~6 n

" v1 W. e- l9 R' S}
  |' n$ j" z8 a+ K* _6 A# x/ q$ X1 T
function continueFade(id)
2 C9 n' U2 j. R* M# E8 H$ S5 m1 S( P. z
{  |- K8 Q& S8 r( {$ ~

* ~- F7 d- h- X1 O: M        continuous[id] = true;
+ x' e, i' U* T( b3 \
+ o( k' U* y6 F( R}
- L( V: k2 w6 Q2 G: v) H% P4 V/ V
function stopFade(id)' C9 Q! z7 e- {" u9 i% }
- e2 ^: J) ]+ P2 g0 V
{+ g7 Z9 Y$ w% m

  G8 X' ]7 T7 V; U# l& k5 p# O1 c        continuous[id] = false;5 u2 ~  R, N, ?6 z2 D  }9 i

( t2 K  T! ~: `1 S* \6 d}
3 s0 a1 j/ s% p! O6 G1 ?4 \
7 }. x7 K* ]  t, V* f- i2 c5 r9 W: vfunction StartTimers()& S2 |. ]* _2 w+ d8 E. e2 T3 Y3 N

5 S( N3 ]- m  q0 ]8 N+ v{        //set up an initial set of timers to start the shimmering effect( y0 [4 Q( d5 r# T% D( v

5 J; a9 Q, b) o2 S" M; Y        for(id=0; id<numLinks; id++); c( g3 o2 d$ j" B) R8 m
' x& l0 s5 P% Y1 l+ R  d5 y
        {
( s# D  b3 k$ W0 Q/ o6 D8 H  L9 [0 K0 N" o4 v2 }6 _! n
                t=setTimeout('startFade(' + id + ')', id*100);
. X: ?0 o/ j& f' U0 g9 T1 x6 F  n  {  z8 {; J& T# \
        }
; ]. ^$ W8 d6 U/ X  g
5 b4 ~  j, c, {}; W% R/ n$ m, H6 Y" z. U

6 W; A' [7 L0 @1 j//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')" E/ h; Q0 j3 n/ j+ k5 X

- f  o. F% r, U4 minitLinks('#FF0000', 6, '#FFCC77');
9 h  y! u) _7 s7 V# a
3 Q' Z# A' s* Q4 X//-->, u& Z2 ]9 g2 R( I

1 ?7 G: g+ @7 ?* l# S0 q</script>
7 r- I) Q9 i  [2 h<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元7 P, [# ]# j/ U0 A4 q) p3 c' G, i8 |& R
</a>
: {+ F) H& K$ n9 P6 S9 A" {<br>, Y* i+ }" j7 t
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>/ w' S, [' m/ Y- T
<br>
" F6 \# U' H* ~$ v9 Q& J4 f# D! O<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
! u; u- o3 H& n<br>        0 q6 [1 M" h: E! p1 }" F' p
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>/ U& R9 h: e+ L- v
<br>& P! L/ @; Y+ b* f! e
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>8 c/ C0 V! v+ i6 X! `! E
<br>
$ o) o( f  o" I# Z5 t<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>" g( {: |; ]- `! ]' L( P: P4 h4 w
<script language="javascript" type="text/javascript">
( f$ N2 K# W  I3 |) T" C<!--
2 J" u9 c( b" o# v+ J# {setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
2 {, K5 u5 |1 F  X& |! y! [//-->6 G( ^0 B3 g1 {1 Y2 g& I
</script>