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

zw2004

<script language="javascript" type="text/javascript">
4 M& \0 r: X# h/ @/ f<!--
! I, L  `! J! m7 B; @// convert a single digit (0 - 16) into hex( T( i3 L$ ^0 p+ X5 |6 Q. Q& t
function enHex(aDigit)1 i8 C; ~& Z6 Q* @
{
3 l4 [) w- o! y: z; l' f; e& L    return("0123456789ABCDEF".substring(aDigit, aDigit+1))5 y# Q% t5 x& k& g! ]
}. I! \# E: D  _, i7 Z) K
// convert a hex digit into decimal: m7 _% B5 ~6 v5 D2 C+ a9 u
function deHex(aDigit)) r* g7 W+ R1 j7 o/ s& t
{
  [* w& a3 R" ^; Y    return("0123456789ABCDEF".indexOf(aDigit))
8 Q: M, k  C8 Q; h# ]}3 q/ T1 j& S. R/ [/ \' r! {

+ ^/ ]- L, K( X9 z, G! p) r9 }// Convert a 24bit number to hex
# Z; }/ m$ _4 a( y( N2 F+ v3 K' E- _function toHex(n)* x& U% t) E$ u4 q5 j( W
{
/ T1 k* b0 b! V' q+ ?" r6 o    return (enHex((0xf00000 & n) >> 20) +
4 K& p8 o- a' z& o* L$ [            enHex((0x0f0000 & n) >> 16) +
. w* P9 g0 v2 V9 x4 z            enHex((0x00f000 & n) >> 12) +
0 X3 i! V7 }5 A6 j            enHex((0x000f00 & n) >>  8) +
# G% V, E3 M8 K% o8 E            enHex((0x0000f0 & n) >>  4) +% D  u. d9 B% E+ U; J& |* w
            enHex((0x00000f & n) >>  0))
+ }; S9 z4 ~6 o$ f7 |$ J4 Y; |}9 e; K! _  q9 I/ K) `; B
// Convert a six character hex to decimal& `8 Z) ^! V9 f% `
function toDecimal(hexNum)
4 E4 j! \% Q, k{0 |2 E, L/ t' [3 \6 u. u; ^
           var tmp = ""+hexNum.toUpperCase(). b. ~/ S7 n) @! z( v: Q0 l
    while (tmp.length < 6) tmp = "0"+tmp
& s7 Q$ V% D9 P: O  O+ w/ O: \  ~           return ((deHex(tmp.substring(0,1)) << 20) +
9 Z7 m$ f$ j. V7 {' x- [9 K* h: ^5 s                   (deHex(tmp.substring(1,2)) << 16) +
4 G* E# o3 s  B( R' u' c            (deHex(tmp.substring(2,3)) << 12) +( K, w/ E! x" X, a
            (deHex(tmp.substring(3,4)) << 8) +
+ L2 R6 M4 ^( @- w7 z( c            (deHex(tmp.substring(4,5)) << 4) +8 x5 U" V* u: a+ Z+ M. L( L
                   (deHex(tmp.substring(5,6))))
* k4 S1 J# G( @+ {}
5 v1 Q  O8 C1 k( |- W///////////////////Shimmering Links/////////////////////
+ n4 K; X1 n; y6 R//global variables2 ^2 R9 \" ?' K! ^5 j* m
var hoverColour
3 }7 B% V; ]$ J" {9 dvar numLinks;0 B: j  ]0 C* @6 H# r$ `
var rate;
! @. p5 |) P1 \9 m. Jvar numFadeLevels;# K2 p: d  f9 z2 p8 H& _' |3 j
var bgR;
1 n, R3 R4 k! ^8 Z) ?: Nvar bgG;
4 `" v2 F$ V7 ?, [! z/ ~var bgB;  ]6 u3 R2 S. g  t
var currR;
# L- F  h& p2 Hvar currG;
1 y! w% u: y# Z& B* \var currB;3 O" f) o3 {3 M) q" F
var count;- W: w2 {0 y) n7 H
var fadeOut;- ^# s2 @# C* H2 b: W. k$ R
var continuous;, @2 L- @- c2 b2 F
var newColour;
! {% ?* S9 S; |! E: S* ^9 H9 D6 ivar tID;
+ W: A$ u: s  I/ r* a! Ivar redInterval;
( L- M" s* b3 M. Ovar greenInterval;
3 F, @/ k" u+ B' fvar blueInterval;
" A& }+ T' C( tfunction initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
, R9 n9 J6 L$ A4 W4 f: w4 V3 g{5 x1 e! s+ `( Q" L+ h; _5 x
        hoverColour = mouseOverColour;
& l( t- Q3 K" }+ b) f, ]: {* a        numLinks = numberOfLinks;; w9 R; D  j7 N7 x/ }+ {
        rate = 1;
( N0 K" l/ X) T9 R0 z" ?        numFadeLevels = 30;
$ D& r8 w7 q; M/ U" w% U6 I0 }        function initArray(theArray, length, val)6 ]" Z  U# R& n! _7 E
        {
$ L+ G) h" }- ?. U                for(i=0;i<length;i++)5 r8 }, M7 m7 L; y
                {
6 `6 d5 N& J: J6 x                        theArray = val;
5 W) ^2 O. g: @" Z                }0 W5 ?! I" b, a
        }* X: }1 M9 E/ y+ U4 v5 ]
        bgR = '0000' + fadeOutColour.substring(1,3)* z2 U6 u/ I7 M; ]) H$ ?& Q
        bgG = '0000' + fadeOutColour.substring(3,5)* Z. c' ^5 K( _
        bgB = '0000' + fadeOutColour.substring(5,7)0 R# @, W! Q) ]" X1 f
        currR = new Array(numLinks);
$ g! e  h0 b0 U# z/ Q2 C        currG = new Array(numLinks);
) v) x3 C6 E% Q$ Y5 g9 S2 z$ Z        currB = new Array(numLinks);/ q6 o7 T- {: g- Z$ x8 e
        count = new Array(numLinks);
4 _$ I! x; i/ B( K6 B% `* G        fadeOut = new Array(numLinks);
/ \  d8 a3 r9 Q6 V( [! a0 S8 W& ]9 ?        continuous = new Array(numLinks);8 Q. X( C. W3 O3 z( I" f
        newColour = new Array(numLinks);
1 l/ }. U- [0 s" A( Z6 [! S/ r        tID = new Array(numLinks);
# n. a6 R: Z5 N. x4 ?/ T        redInterval = toDecimal(bgR) / numFadeLevels;1 o( K( z1 B( X% H0 ~8 Q4 X! b
        greenInterval = toDecimal(bgG) / numFadeLevels;& o/ U, d2 Q" G9 U1 N
        blueInterval = toDecimal(bgB) / numFadeLevels;
& o$ U# c1 T- V        initArray(currR,numLinks,0);
/ I  g+ ?6 E8 g& m# X; r" w5 C        initArray(currG,numLinks,0);# D+ [9 }- D7 Z
        initArray(currB,numLinks,0);: v2 m% k2 ]' H6 L0 [7 X* q) F
        initArray(count,numLinks,0);) ~: x! w2 @& K7 @( a0 I
        initArray(fadeOut,numLinks,true);5 W3 Q1 x8 \$ C7 t7 K2 w
        initArray(continuous,numLinks,true);) t  N$ R3 Y1 G( M5 P8 u* y( q
}       
; q5 Z; u# Y+ E# Lfunction startFade(id)% N% ]( ~3 O/ l5 A7 D
{
4 [. {7 m6 z1 c% y& w+ _% I        if(fadeOut[id] == true)0 H8 U/ @8 i2 Q6 k5 ?! ]2 a* L* R3 F
        { /*move colour towards background colour (increment)*// G: N% a/ d, }3 g6 P9 n
                currR[id] += redInterval;
: P& X2 i! q2 k/ c& n6 ?                currG[id] += greenInterval;
9 S4 ^& ?$ Z! c                currB[id] += blueInterval;8 b' ]1 f" i* d$ k# u
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
& q, x; `! W+ S' S: q; ~( I  X                if(++count[id] == numFadeLevels)
& @& i7 S* Q: {+ `! S2 z/ g" q                {
! `+ e) \; e9 J5 l                        fadeOut[id] = false;
6 S5 F6 G5 T' m1 p. O' G                }( g* G3 ]8 ~& G6 p4 u
        }$ @7 u! _2 U: L
        else& w( Q( v. L) c* g
        {; y/ B1 `& a' L, d5 b
                currR[id] -= redInterval;' @) G- R5 @& E5 ]5 a. l) E
! h+ q) e7 T; ?* N- K1 W3 \
                currG[id] -= greenInterval;* x  g6 F" ~1 b6 V8 G

: R5 @+ j; K& i' }7 a! t! V$ Z8 @; m                currB[id] -= blueInterval;! h8 E) B& a; r6 _
+ V" B" D0 D; o8 t8 L0 E
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);8 T; j/ S: P6 ?

  o; q/ I, e  L                if(--count[id] == 0)
0 T2 m: D/ ?/ U! B: j
$ d8 O% E$ G. L; u  @                {
9 {1 |' N2 M* G. c- E% v9 e* r, W" [  P
                        fadeOut[id] = true;
$ T, i+ F! Q4 Y$ ]5 i8 b- r! R0 I# l4 l( X' r* u/ X7 T
                }1 l' \8 l0 C, S* R% {/ p- ^
# _* v5 `6 `" ~
        }
( y: W; d# M. O& B# s  \$ K1 ]) a; v9 n3 w! j7 b
        if(continuous[id] == true)
/ M0 L) d" K# v  x; k+ U8 h" H+ l
  [! }9 n, ?6 `) Z) |  @! q. E        {
  s5 m- P0 W# S  ?4 B
' f8 |- p% ~2 b  P1 W                document.getElementById(id).style.color = newColour[id];                * s: d; |: l9 r; Q# [
3 P) A. s' J/ H) R& s! R3 j% {& J8 o
        }
9 x* x0 ^9 _& s( S4 O
" Y) r* f- m# r; f$ P, `' k1 }        else" V5 P- N: i) H5 ~" O: T! j" v

+ B) I" d% b/ J; M! i3 H        {' D* }: P8 C' d! r+ L+ ~; S! E! i" d
$ a2 X: x0 t4 l
                document.getElementById(id).style.color = hoverColour;8 G: {5 E1 t2 R+ i" _

( p8 o& U3 y% P" R6 B        }  W! I1 E: C4 n$ S; M, p% p' q

0 x# O/ g, y$ ]" @$ s        clearTimeout(tID[id]);5 C# O& ]( O. p5 _4 N6 t
+ k! J8 ^/ q& b9 |$ h3 \( I4 s
        tID[id]=setTimeout('startFade(' + id + ')', rate);
" Y- H) r0 n' c2 A% k6 ^! K# H! a) X9 p$ a3 t4 p% Q
}5 b" }) d4 G3 ]9 J! t" N
+ Y0 \- l1 ^$ D% g1 J" J/ T
function continueFade(id)
4 Q, p$ W& I, m5 H# T- Y8 T, O2 l, E+ a
{
2 I4 O' Q1 H+ I. i1 Q& j9 z1 r% k' F0 Z7 [: ~" |) X
        continuous[id] = true;, k& x# `/ U/ w. i3 T6 H

: t, K/ n) d5 |}! J2 r' Q2 q  c

5 n! d7 `$ {/ z& \  @; _function stopFade(id)
# @* j4 x$ a5 b' \
5 O) r/ r3 t" w; Q{
  T+ U/ S$ G) p6 ?! f
2 c6 R1 t3 R1 {9 B        continuous[id] = false;
8 E5 T9 {& U# V" g5 t) x# V
+ [" E; k( p8 R' Y* J. i}
+ d" |- W2 ]3 d. {" V6 X) t2 K2 B4 d+ `) z6 Q* ~- J; {' k- n  |5 X
function StartTimers()3 T+ H) ^% S; b  M  E4 W( Z
! Y2 o: M. R) T
{        //set up an initial set of timers to start the shimmering effect
7 ~8 e5 A, W1 d- ]  ]7 ~3 c- O! a, n0 A& S6 n
        for(id=0; id<numLinks; id++)
) n8 N+ `- {) q% N% F5 w- t
' s6 N) b3 L4 J1 R0 X8 r9 I        {2 Y0 M* C1 ]7 w$ \

$ L- U' c& f* M  O6 C6 D  a3 S                t=setTimeout('startFade(' + id + ')', id*100);
9 U8 H+ f1 h" O% F4 |9 U1 p! E" _! Q( |/ u) t
        }* u2 V3 ]  D# m. {
% E% l  T5 N3 j/ c
}
4 c7 k" n6 T* n9 P' ]/ ~
' T# u$ L# P3 U0 Z! R//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')6 p- L5 J8 v7 P# @' h, L

$ Z2 c* S4 v( _# I! ginitLinks('#FF0000', 6, '#FFCC77');
  W% ^* n# C2 ~! ?9 ^5 y* Q2 |3 @
+ n4 k9 k+ @8 Y9 j# U) J//-->1 ~% m3 e8 U5 G. `
# R0 H" m2 r* V- C/ p' \4 q
</script>
& |* `2 f. `) g% A) E<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元3 G/ X( {3 t6 L( k9 N6 e" C" C
</a>1 W; l1 o0 \4 p. w: q1 U
<br>1 |' Y4 m" {& k* n
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>- d( |# E4 q% G8 d: r
<br>
# V3 ?4 C! N$ }+ K. |<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
7 ~: N; {2 t4 y<br>        7 o9 j. ^# d. H9 G3 g( y/ P
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>* D: I9 I$ e8 f) t7 {5 G5 Y
<br>/ z1 M' D, e$ k4 H$ R
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
. f) n& |; u: D, ?<br>
7 |! Z/ P+ D, c7 x6 J$ w<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>! y$ H" E! o0 L  h- p2 a. ^9 {
<script language="javascript" type="text/javascript">
0 y5 A3 ]& F' K" q) \, A4 Q1 m9 Y<!--
) S2 e, a8 }9 Y& P. vsetTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering9 N, L& ^6 F& M& T
//-->9 g8 Z) S  e+ }
</script>