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

zw2004

<script language="javascript" type="text/javascript">
/ b$ C3 m  K5 ^  c<!--" [5 t5 w$ J) e0 B/ j: v; g# c
// convert a single digit (0 - 16) into hex
" M6 e% w7 m/ ^. nfunction enHex(aDigit)
0 v2 S( t% a) E& n5 u{& p- `$ o) w+ H: k7 Y. ?
    return("0123456789ABCDEF".substring(aDigit, aDigit+1))/ i( v( i- b4 z* z  a
}
4 Z( ]/ y* ?0 F// convert a hex digit into decimal; q  x* k/ K8 w! r4 t
function deHex(aDigit)& u$ k: _, z$ K+ L9 Z& M
{
9 c; n  r0 r; b3 q    return("0123456789ABCDEF".indexOf(aDigit))+ c# c$ @% @9 o
}$ i8 e* p& t* x2 n! {. u/ Q

; }8 T% N( Z; O// Convert a 24bit number to hex$ ^! V4 L/ U4 `; q
function toHex(n)
1 d6 D2 B2 z( I$ U& v- E/ Y6 x{- R- I' P9 @  k# c
    return (enHex((0xf00000 & n) >> 20) +" q' B8 P; ^& m9 [
            enHex((0x0f0000 & n) >> 16) +
4 x. o7 R% T/ E; q0 u4 w( l            enHex((0x00f000 & n) >> 12) +
* ]# n. C! \1 \: h& H            enHex((0x000f00 & n) >>  8) +2 f# g) h9 K# D7 h
            enHex((0x0000f0 & n) >>  4) +
# y- c3 D% f, _1 I& {            enHex((0x00000f & n) >>  0))
3 Q& O5 o: I' M2 [; q* h5 p}% C- S! b* J2 w& ^. \0 p
// Convert a six character hex to decimal
. u& ~7 [( U' t% H  @function toDecimal(hexNum)
$ q. S1 h, I: I{  j& P& h! ^2 L- b1 X: i$ b# |
           var tmp = ""+hexNum.toUpperCase()% Q& q, a  x+ u
    while (tmp.length < 6) tmp = "0"+tmp
) k# k/ ^" u, q, i: Y           return ((deHex(tmp.substring(0,1)) << 20) +
5 V* P% l, c7 s/ n, L. ~3 ~& l                   (deHex(tmp.substring(1,2)) << 16) +
9 j1 b. H; L% D; I" T& m' t            (deHex(tmp.substring(2,3)) << 12) +
+ r/ u: b' S& }9 g: E* n2 j& e+ W            (deHex(tmp.substring(3,4)) << 8) +
! Y: j. V/ L. c1 w) P            (deHex(tmp.substring(4,5)) << 4) +) |$ u' v; }0 |- T. \: ^7 F9 D
                   (deHex(tmp.substring(5,6))))7 `* K0 H4 V% m  P
}- i, k! V# p" `) k
///////////////////Shimmering Links/////////////////////$ i8 {% _/ x6 }8 |1 w4 V7 }
//global variables
1 P9 d7 ^% p1 Zvar hoverColour
6 W7 n/ S' n  {, U7 fvar numLinks;5 a1 I$ e) c$ T3 S2 N
var rate;
4 N' j$ M, T& i; w- ~var numFadeLevels;3 N+ P  V  i7 z  s* b
var bgR;+ G% A/ `, T; W7 Z  \9 @' j. w) k0 \) m
var bgG;
# Y' `& A+ k4 y4 F  g0 M. Evar bgB;
+ o# A# ?& v; f4 E/ Q; b" J6 yvar currR;
3 l+ i2 M: k! H5 _var currG;
8 t/ O" T% y9 i/ [6 m/ G) ivar currB;* J! a% I/ l2 l
var count;
3 S+ |9 h2 ^- jvar fadeOut;
* B1 L) Q( F2 o; d2 w2 Z: p* R. Z# a& |var continuous;
' |; ~: k+ }0 Y! F5 b8 ~7 D3 F4 g" x, xvar newColour;
0 d! Z. w: o; d) p& Bvar tID;; G% O  O* o+ ]' O
var redInterval;# P- F# l" t3 @4 A% {$ ?2 W
var greenInterval;+ Q( H% ]! j. k8 t+ q
var blueInterval;- ~8 `- C; g! K, _  g9 p% x% m3 M$ M  d
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)! F0 J8 m" E/ t" O8 j2 q
{
- h/ G' `1 m; X6 e1 B        hoverColour = mouseOverColour;3 u* m! @; C- }9 t
        numLinks = numberOfLinks;6 U% \3 w# `" w( v- B# A
        rate = 1;+ u  a  {& F0 J
        numFadeLevels = 30;
5 Y, k/ T1 o0 |1 d        function initArray(theArray, length, val): e3 C9 B7 }5 ^# k
        {
% ]) N% S5 A+ {& ?* k5 f9 w4 A                for(i=0;i<length;i++)! |: N- [7 E$ }, f; Y, J8 B1 d
                {
. i& q4 z: i2 Y7 n) O                        theArray = val;
/ [9 {& w# S. h/ G                }! h1 O9 [6 t, C6 D4 @5 N; L4 |
        }
# W; [; E+ }0 ]& K0 ~        bgR = '0000' + fadeOutColour.substring(1,3)
! n* w5 \  I0 O: w7 B! f0 j1 z+ X        bgG = '0000' + fadeOutColour.substring(3,5)
1 W4 O# C, k/ `; E5 v        bgB = '0000' + fadeOutColour.substring(5,7)0 a7 Z: ^* @( ?' D5 O" X$ J
        currR = new Array(numLinks);
+ c) M1 X  ~3 _0 p" E2 |        currG = new Array(numLinks);' K& T4 l5 C0 O9 a/ y9 o
        currB = new Array(numLinks);% Y, h9 g# ^) B6 }; [0 M
        count = new Array(numLinks);
7 e3 A' z* e& c0 \. Q  P& K        fadeOut = new Array(numLinks);
/ X6 v+ w# r! D5 c* P& E' M        continuous = new Array(numLinks);
& z9 e9 Q4 y+ t! u' [4 Y        newColour = new Array(numLinks);% n: H1 g8 E. J# p) x! z8 i. z
        tID = new Array(numLinks);' W- {6 H0 _+ u' e2 H
        redInterval = toDecimal(bgR) / numFadeLevels;
, Z. Q' W6 H2 ^& b$ s& ?        greenInterval = toDecimal(bgG) / numFadeLevels;5 Z4 u: I  X: V/ E. X
        blueInterval = toDecimal(bgB) / numFadeLevels;, j- h" F! H' e" t- O
        initArray(currR,numLinks,0);
6 ?3 @, Z; G: B        initArray(currG,numLinks,0);
5 [4 X9 V0 x, a- I1 i        initArray(currB,numLinks,0);% i0 U! `; I  q. T$ t
        initArray(count,numLinks,0);
4 c7 U) c5 i( @* H9 }- k        initArray(fadeOut,numLinks,true);
: N1 E6 ]2 u6 f/ b        initArray(continuous,numLinks,true);
/ u& N( r$ Z6 `) [/ X& j3 R4 i% o8 a}        + d$ f$ k2 y- o8 U
function startFade(id)) m! ^0 A' H( @5 K6 E
{
4 G$ p1 e( s4 ]1 ~$ R8 R' U        if(fadeOut[id] == true)
& w5 R7 l' _: M8 c        { /*move colour towards background colour (increment)*/3 E- ?) W2 O. g: ~" s- u
                currR[id] += redInterval;( i4 U' v& L3 S4 O: I5 I. u5 e
                currG[id] += greenInterval;) @- J. L3 D% h+ E8 d9 \8 O
                currB[id] += blueInterval;
/ Z( f9 a. C1 _                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
) e2 m3 {( P( B) {: Y. s8 g5 {0 d: D. J6 _                if(++count[id] == numFadeLevels)& c; o6 {, i1 Q/ g( w+ {9 t
                {2 p- j  L) A. k% P  ~! ^
                        fadeOut[id] = false;
* O& M5 L8 l5 F8 d" d                }
' R% _, s1 K$ ~/ M- _        }$ Z$ z8 z1 F# |
        else/ q2 L) f# Z3 V  c2 t
        {% O# t; b. w* B' a6 P" D( z) R
                currR[id] -= redInterval;
0 {/ B1 a2 L2 u2 h5 N- K1 l. S8 v. c  V
* W4 E3 w$ \6 K0 K                currG[id] -= greenInterval;' Q4 O0 [5 R4 E$ w3 D

* r0 E( B5 ]4 {% i6 s, P                currB[id] -= blueInterval;
3 |$ }, h3 }* K4 [  c" e4 u$ e' Z- ^
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
  s2 Q9 Z( X7 f: S( ^- F6 A4 p9 |) [" I; \: c+ R8 S' ]8 H( X
                if(--count[id] == 0)
- L6 J, j" C) i& P* n* N7 m1 ~' L( G& q
                {/ `% ]7 d: O2 u& f' F0 ^) k

8 o! h  r  e- K5 _; }1 Z( _                        fadeOut[id] = true;7 s5 C, f0 L. S, |

2 j. w% s' `$ m) o                }( x1 ?; C' \) z& t1 h# [  q: L
( m7 C+ C- X+ W" S  p
        }
% W$ r0 U. g; S. N) ?# w0 j% c; V8 m% z( j5 U" R* y, |; q
        if(continuous[id] == true)
  H! y; f3 l" r" V5 @. z  Q
$ \5 _4 r) O1 i1 T2 [. p        {
4 p7 t+ `2 o) i4 A6 Z( m3 N
1 @' m6 z" R4 o+ R                document.getElementById(id).style.color = newColour[id];                5 s/ o, x: p+ \

4 V3 i% Y5 v& I/ u0 r        }4 g& r- Q- G  Q( d1 g" V+ F. O: w

' S+ X, C/ M2 }        else
1 ]: P5 N8 a, A3 F5 |% r/ J9 w3 i2 K* J
        {
8 Q3 S! q. E, G2 ~* _6 B8 Q4 g
                document.getElementById(id).style.color = hoverColour;
; L( E, ?  s0 G$ c' R% a% s( @; e
        }
0 E5 \4 Z2 K9 i, ?7 Y3 r$ {5 k+ x
0 [3 @0 ^* D! Q# F7 u4 U        clearTimeout(tID[id]);
& K3 R* z! e9 C! t+ o! i. A7 I: Y
" |6 L, y/ D+ i( `! K        tID[id]=setTimeout('startFade(' + id + ')', rate);
5 G, |+ \3 h: T. }6 r& q% W8 R" R
9 D8 V7 ?& e2 H6 P8 l/ f2 x}
- T0 ^$ j3 L. @9 r% U+ m9 N$ @' G3 a0 a; y
function continueFade(id)
. x' E. W) d% Y; K/ F8 N; S7 v' p! P3 q
{
; a7 b) f0 o( i: }0 v3 S& n  v, f) o0 H0 m
        continuous[id] = true;% `+ R* _0 y+ C/ v: W

( C/ }& `# r6 x* p5 K" e" \& M}
7 Y) F% l0 q( b3 E$ V
& }6 Y" B& C0 V' @2 Qfunction stopFade(id)
6 }, `; R6 m; r5 X3 q' D* r5 J  g/ [  }0 d6 a* z: _4 o
{* I5 D7 p% ^7 {
/ \/ H: ]7 Q& M7 o" ]
        continuous[id] = false;0 `* d9 [6 ?! K

; b% j" @7 C8 |}) X. P8 E4 }: U" U0 }5 n
1 }5 J2 o! c% ~; N
function StartTimers()
0 E5 i! Z- U( ^$ f: G& Z
! o4 p9 ^7 X: B- Z{        //set up an initial set of timers to start the shimmering effect
" Y. k3 w: F4 f/ v# e- k/ I- X: k( f8 H/ F  {$ y/ }
        for(id=0; id<numLinks; id++)  C& k, z5 U$ c4 M5 B  C" U7 \
0 P4 S9 N: i9 U1 N  b9 C
        {
: G# @8 K0 a+ Y( V; O) ?" w, F0 r* ~. p0 `3 t  [- Z
                t=setTimeout('startFade(' + id + ')', id*100);
1 x; h: }/ C: l! k
& `+ m$ o3 e% U& w& C  ~        }# Q. R$ {* e% R7 a3 }' I/ @* A
8 y, K! B+ p' e: U# t
}
6 J4 T/ y  S# M
4 s* |3 U0 x8 s' Y# o* b: s//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
* v2 I1 h/ ~; W' R1 N% Q/ E- r$ L9 i! Y: v) V) p
initLinks('#FF0000', 6, '#FFCC77');8 ^2 h1 C/ l! r, K
  e' P8 q# t( q" @& G
//-->
. ~0 v- {, j6 t" D: @' ?0 M! k. |* O
</script>
& ~; [( v! l; v+ l$ ~<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元7 |8 b5 y( Q) R2 l0 L2 H% w
</a>3 n" D3 U" }; ~4 I6 C2 l5 ]
<br>! f6 H+ l0 D) I" \' w- {2 n
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>. P& @7 V# _+ }( D# c* H* z; w
<br>
- \- t; U' m5 o<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
  C/ K8 q2 R3 N5 ]( [<br>       
6 T9 `: U* L" c# {4 {; |<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
" G+ l5 z8 B0 ~<br>. Q% l3 ]) y. E
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>* b; E) i( E& g
<br>+ v! `0 f, T$ `
<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>
8 j) k  Z. u' B! R<script language="javascript" type="text/javascript">4 T4 U$ `% \% {) L
<!--
# s, C4 `/ G* w1 O$ vsetTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
; m) |- a! F' O  S* S//-->- I- N3 a: O$ x, M% D
</script>