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

zw2004

<script language="javascript" type="text/javascript">8 i2 V7 s, ?& S; j) r9 Y/ x/ s
<!--; s/ ]% h- N- L
// convert a single digit (0 - 16) into hex
: V* V+ J; g4 c$ h# L+ x* D, t' E( kfunction enHex(aDigit)
6 q& ?5 Y" ~7 X/ L' X& W0 V{
7 }( u. |: {& V    return("0123456789ABCDEF".substring(aDigit, aDigit+1))+ P! U7 S' ^8 J! g- \, L# e
}
' N. |0 ], x: x: y// convert a hex digit into decimal) Y/ M: ^* R) N4 b- A
function deHex(aDigit)
: ], U; ~; t- ]* B; l{6 e: x  Z2 g& {4 e5 W) A, D
    return("0123456789ABCDEF".indexOf(aDigit))
4 z' H& m9 X* N1 c  R' z$ C}
! G+ t  x  C& o& f. ^1 W. }2 D; c* K& _5 x0 i. g' _
// Convert a 24bit number to hex* U) _$ p; I+ w# M% l6 L
function toHex(n)) t" @5 N7 Z* B
{+ x) t" ^/ t: C$ p& i) a
    return (enHex((0xf00000 & n) >> 20) +
2 r% a' R8 |5 s& l+ p            enHex((0x0f0000 & n) >> 16) +
# O6 N. `" P/ Y  e5 i            enHex((0x00f000 & n) >> 12) +
: a2 W9 a! \6 \+ k; h/ t            enHex((0x000f00 & n) >>  8) +4 V3 |) Q; Z! x  g/ S. \  h
            enHex((0x0000f0 & n) >>  4) +0 H* V5 M4 G9 R, H: L2 L5 o1 h
            enHex((0x00000f & n) >>  0))5 A, D. x) o* u) O% Z
}  d: ]/ u" [5 T6 r3 @  ^2 M
// Convert a six character hex to decimal
$ m1 |, y0 e- J$ n0 ?! a3 Rfunction toDecimal(hexNum)
7 Q! x+ v/ H4 j/ g6 h* @6 N{) g6 V2 k% Y. u! G1 P! r
           var tmp = ""+hexNum.toUpperCase()$ u- n. s+ p! O. U6 f
    while (tmp.length < 6) tmp = "0"+tmp. ]! x4 i5 c" e- M. `
           return ((deHex(tmp.substring(0,1)) << 20) +# {& w& m8 n  B! |" L/ N8 C
                   (deHex(tmp.substring(1,2)) << 16) + % h+ w2 t8 J7 H6 A5 u# I* O
            (deHex(tmp.substring(2,3)) << 12) +9 i0 \- t: o1 Q  G( N
            (deHex(tmp.substring(3,4)) << 8) +  ~& u/ f! z3 ?9 a2 J% Y
            (deHex(tmp.substring(4,5)) << 4) +4 W" @; Z. e+ t/ ~4 v) S: W  l+ w
                   (deHex(tmp.substring(5,6))))
& |% @/ i: N( n7 z3 h/ \! T}
: P- T8 h4 \& `6 `3 B. ^///////////////////Shimmering Links/////////////////////+ ?  B0 G! W2 h
//global variables& R$ f) e; n7 B( O  O* h7 R
var hoverColour  D7 @. ~& \  A1 L2 y" F5 p
var numLinks;
# `2 [& _! |% ~( a- ^+ A$ O. Mvar rate;9 u) I! F3 X. b" b+ B" t
var numFadeLevels;
0 B5 c% A  C6 S( Q4 `% avar bgR;
9 l9 X  Q3 v; a: lvar bgG;
2 j9 [9 q/ F( n  Ivar bgB;
0 Y2 s2 h! }3 c8 w. ]/ U$ ^1 _- Vvar currR;
3 Q6 j! G! j6 N6 m5 a9 vvar currG;1 D3 r* U" z7 T1 u& `4 n# @
var currB;6 c' e, |# |, L* {, p8 D% H# m+ [
var count;
, J5 q" [0 w7 `9 lvar fadeOut;
- m/ Q/ b1 Y, u5 f0 d) x) m* z2 g& g# _var continuous;
: Y8 a  ]$ W7 T2 n+ @6 I& Uvar newColour;
8 p; s9 Q5 i7 U- A7 P% a2 rvar tID;1 o3 P2 v/ Z5 D
var redInterval;
0 e% C/ b8 c9 M) ]' Mvar greenInterval;
0 h, o1 r$ c6 k9 X# G* }var blueInterval;6 l, E1 V: O( m
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)/ x  c) Z4 M1 D( S! }- a
{5 z$ V6 h3 F$ s+ ?, g
        hoverColour = mouseOverColour;
% T  W8 e! S1 d, N7 R) Z( [2 P) ?        numLinks = numberOfLinks;+ S) C0 W5 d) M" p7 Z
        rate = 1;. h6 t2 e/ T+ n) ^
        numFadeLevels = 30;* l3 [+ ~' }6 v2 s6 [/ o
        function initArray(theArray, length, val)
/ K: H/ r6 u2 _( y, z* ?        {
( t. c+ b( ?5 q* C                for(i=0;i<length;i++)1 i, u! X; n# o$ k( q1 J
                {7 u4 Z2 C" r, C  a" e
                        theArray = val;1 u- }0 A+ m. l5 z9 A
                }
# P7 y* P1 g( X! G% N; k6 m  V        }
- G& O7 s, l% p* ]0 o4 V( p7 ]5 Z6 {1 }        bgR = '0000' + fadeOutColour.substring(1,3)
7 W4 e& B, ?4 L" k; b/ F        bgG = '0000' + fadeOutColour.substring(3,5)
! L& Z* X+ n( f* _! a, N6 g: P* X        bgB = '0000' + fadeOutColour.substring(5,7)
! ~. F( g# G3 D9 D& x. T6 \        currR = new Array(numLinks);7 p9 {8 @, a2 g% r. e, c0 z1 t
        currG = new Array(numLinks);9 ]" O, T' \1 Y; d
        currB = new Array(numLinks);) c! ?; E2 ?. x& r; I: |7 ?
        count = new Array(numLinks);
% }' Z9 }/ V% f2 C' |' e        fadeOut = new Array(numLinks);
, I/ J4 S  X+ y/ h* |9 |        continuous = new Array(numLinks);) B2 n: ^; x* ]* W" x
        newColour = new Array(numLinks);) |' K% O. K, v' t6 x: E
        tID = new Array(numLinks);
7 t3 q2 m: V7 J; ~+ l  H3 e        redInterval = toDecimal(bgR) / numFadeLevels;0 W' w" e; D) V, X
        greenInterval = toDecimal(bgG) / numFadeLevels;
" s% j. p5 i* C+ w! Z        blueInterval = toDecimal(bgB) / numFadeLevels;
3 A6 E7 W9 s! R) I        initArray(currR,numLinks,0);
8 P. Y) F& Q: n% Y0 B        initArray(currG,numLinks,0);7 X. L  _  b; }! I, \( v9 a' k, R
        initArray(currB,numLinks,0);
8 K4 k! @5 }# Q) d1 ~        initArray(count,numLinks,0);
! J2 P* O9 a7 U9 D        initArray(fadeOut,numLinks,true);& X2 A$ |" V4 ~! [* U, @
        initArray(continuous,numLinks,true);1 m2 ]' c. c8 X5 M
}       
% r& A) q/ C7 L; |% Wfunction startFade(id)
. V% J. d: \: ?8 B9 ^{: u- a5 S* p% f, H* _
        if(fadeOut[id] == true)0 V0 |. L, U! s* A2 {2 x' B
        { /*move colour towards background colour (increment)*/
+ l  F4 q# A" B% b" ~8 W2 T$ A                currR[id] += redInterval;5 _  x" V! z- v& I
                currG[id] += greenInterval;5 z+ v$ D) }9 o2 @
                currB[id] += blueInterval;1 Y: W: G4 R. w0 I, Y0 e3 [
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
* K3 U% }2 E3 H* [% i7 _                if(++count[id] == numFadeLevels)
4 U6 N' h5 e' b& Z' @                {
* D* y- _- e2 T! S8 ?                        fadeOut[id] = false;4 V  {7 U3 L# _; N
                }
4 K* U/ J- }5 g# @1 p        }
2 ]/ {: _  I, }" \        else
) N, W# p" I; R# K0 E        {: T; M1 y4 J* T. ?3 h( R# P% o
                currR[id] -= redInterval;
5 j: ]5 c# z3 x9 L8 b+ l2 {9 q( L% h4 k, t9 ^: [8 ^
                currG[id] -= greenInterval;
" i, e) f) a* i& P7 j& d
/ D, d+ [$ A: D3 F" C9 r/ c) U                currB[id] -= blueInterval;  |: I$ X* f2 N$ y" H
5 o. }4 ?' e! j4 F
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
6 ]+ y( l6 g  l: W. `0 m  H1 u
  Y3 p4 ~1 x3 C3 h9 K# s% A                if(--count[id] == 0)
6 F- {! {. Q* [, |
) }# Q) j( M. ^                {
6 _' Q; \* ^; y% A6 y
1 @  j8 H( l/ ^5 V/ l/ Q5 a                        fadeOut[id] = true;3 _7 T+ m9 f/ p; n! D3 C, V
" j0 S# V  e# n
                }: O7 A3 @: m, L$ O

1 q! W: o; H4 F. I  _2 l3 u        }- f7 \  o3 S5 Y
0 e  m, q+ ?4 C7 S$ Y
        if(continuous[id] == true)
: z- ^# E9 s" R# Q+ \1 G$ _6 d' F1 c. |+ i4 H& M
        {& x# R+ \6 u+ M, }9 O6 T
* r) W/ |) u( w2 ?) Q8 @# s9 ^
                document.getElementById(id).style.color = newColour[id];               
0 f9 C2 H1 `4 |* _( M$ a- `0 e; x' E$ F2 f, U7 Q. s1 {
        }4 F) h# z0 z: u) M7 D7 h
0 y4 B' F& b" P. M
        else  [! {% X2 x3 |. N% J2 p

/ o3 S- z) F4 \        {
+ `  U% l/ ^- U8 g+ k* v
* B& F* Q+ H( u! p* h" Y                document.getElementById(id).style.color = hoverColour;
# n1 B/ O" R! K" G# V7 H& a1 U! O, x1 W2 N
        }6 t8 r/ x& X# s* M' w4 ?
/ _1 M. N4 d5 n1 {/ Y, l
        clearTimeout(tID[id]);
3 k/ U  q& t: V3 t" x$ e! g/ h9 T6 t, s3 d# V" Z% V: T' b! F! J
        tID[id]=setTimeout('startFade(' + id + ')', rate);
, n8 L5 I1 [5 r3 ?
5 o4 ]3 i% n9 q) B}6 @1 s* l( Y; a3 y  g/ X
$ r/ j9 ~7 U3 y& L2 {0 Z; y, ~
function continueFade(id)2 o: H% n+ c! Q

' d( |0 C& Q2 u% G: E$ \2 c% A: `{
1 k* X) M+ V: {7 }" D: n' ~& a* e% R" a! m+ X/ A% u
        continuous[id] = true;1 ~/ M. K7 @0 T6 M2 W) W
' o: c8 m2 o# C& i% r' q
}
- k" Y2 H# w3 z8 J, B
# {) k' p8 o7 c' ufunction stopFade(id)
+ z+ D0 g  H$ v" l% u  I! ^  \) i! ]: W4 `5 D, e
{
  J8 g8 ?3 H. @' ~) E
. M- O* j" j% S! ^7 l$ b        continuous[id] = false;
, P7 @) G. u8 B0 K* i$ w" z4 e0 e) O# B  q
}
3 N% d& y7 q8 o& i- ]. V5 A/ l  O+ Q1 N
function StartTimers()9 W. C5 ]. f5 k0 B/ x+ Z

5 ?- |3 h4 [: w& Z! m: ~{        //set up an initial set of timers to start the shimmering effect+ t- \6 l- J  z. R

$ }! w8 u9 c! I# L        for(id=0; id<numLinks; id++)
4 I; D5 m& o1 U, p; D$ K6 R  v* t- z) n. g9 {
        {
) t( H  ?- Q9 |: t: h
8 ~; L, w' }/ R7 q; r. H4 |                t=setTimeout('startFade(' + id + ')', id*100);
0 K- `4 b/ b, P8 p  X) B( S" q9 M# x2 @1 D# ^9 V7 n
        }
% l/ T, v. L; l2 I2 Z# U1 P3 ^% C/ i# ^
}2 g2 c* I9 a+ R

/ e, K& v! W( B, t, s//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')6 `. E9 g9 E2 H1 u
9 `. D, J1 U/ n, V+ t. r
initLinks('#FF0000', 6, '#FFCC77');
& x, X7 c" ?0 u2 Y3 W+ V0 Q( F3 J, h
//-->9 G' N7 H4 L3 ~/ k& e; B/ m
4 n" P  ^! C' c! Z" ^0 N4 C. J
</script>0 _  Y# O) T. P3 q0 S& W, N) {
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元: `) r. U1 x  C
</a>6 a9 B6 g/ Z0 Q6 t
<br>1 e, N1 ]' R! e+ v
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>
6 ^8 K1 I, U0 s# C) q" o; ?<br>: `8 ]; J9 K: D, M9 P( M& E
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
( }1 a  Q1 I/ y8 x" w<br>       
" ]) b5 h5 [% m! x. h$ l<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
. x: V4 K, ?8 _% H<br>
( O4 K/ Y* }+ Y  e; ?' m<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
9 W) {4 H, G/ ^1 \- l<br>- k0 q& ^/ k0 u4 J
<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>8 D) @. X  n2 i: \
<script language="javascript" type="text/javascript">
( V, b1 H, m# A) w- N# a6 O<!--
: z( E' w5 a# ]. {  |: HsetTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
) D3 U0 B6 _- d4 b) {: G/ O2 F3 c//-->
  Y. Q/ k5 C0 @; n, a0 H</script>