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

zw2004

<script language="javascript" type="text/javascript">
% k4 [! W7 e3 f0 m( ]8 X<!--
* F. b, q4 v- d& I2 C8 g// convert a single digit (0 - 16) into hex
# M8 g2 [: N7 P  Q6 Z( E% Yfunction enHex(aDigit)
8 f! \, }8 w, F. J/ ~# D( S{
7 G  f! [# x. i9 v2 [5 y    return("0123456789ABCDEF".substring(aDigit, aDigit+1))& L* W) k0 w' \: D; K+ N0 {4 J6 {
}( _+ Q( f; q, k$ u$ w( q; ~  @
// convert a hex digit into decimal6 G0 Y# A* r" Y
function deHex(aDigit)( h* w3 S, c0 \2 K' V
{% X* ^% H! g: G) Q& [( K
    return("0123456789ABCDEF".indexOf(aDigit))
, S# F  Q& ^6 Y$ J- s}
4 y. i: t* E& {6 [
. B7 b2 [% z* e// Convert a 24bit number to hex6 h3 b: d: k  v  W/ F
function toHex(n)( b  e0 u# f1 t; T, ~6 u- ^
{
  H4 }, ?; U0 k% {& o: {- z4 P    return (enHex((0xf00000 & n) >> 20) +0 J0 d9 o# Z& r; E- O$ ]9 j
            enHex((0x0f0000 & n) >> 16) +
5 I% M) \7 K! M  _            enHex((0x00f000 & n) >> 12) +
( p7 h: D- g- S+ r5 @- Z2 J$ P            enHex((0x000f00 & n) >>  8) +( g  [3 ?7 p& _- m* j) p
            enHex((0x0000f0 & n) >>  4) +0 @1 \; j, [1 _" Z: c$ |$ Y, @
            enHex((0x00000f & n) >>  0))
" L! U) l5 H/ A, `}- c% j- J9 P/ f3 |4 K8 m  ~
// Convert a six character hex to decimal+ B8 G) z# c- ?! o; B. r; B
function toDecimal(hexNum)0 [0 p  ]: Z$ w
{
# @2 Y0 a8 a; V0 [( t           var tmp = ""+hexNum.toUpperCase()" U  w( O4 z0 A* I
    while (tmp.length < 6) tmp = "0"+tmp$ _4 K: ?$ z7 u7 x1 {. B
           return ((deHex(tmp.substring(0,1)) << 20) +
/ X  \( f4 A6 Q. d. S4 n. Y                   (deHex(tmp.substring(1,2)) << 16) + 0 J; D8 i$ \) @" \
            (deHex(tmp.substring(2,3)) << 12) +4 F/ V7 |: G8 o& z
            (deHex(tmp.substring(3,4)) << 8) +6 @4 _* u- q( j& N& Y# j
            (deHex(tmp.substring(4,5)) << 4) +7 m. o; z6 D) P) ^4 ~
                   (deHex(tmp.substring(5,6))))
# a/ _: g3 i: H. u4 b$ k}0 x* y7 \) h, V. m. O. \- y- f
///////////////////Shimmering Links/////////////////////
1 W4 Z2 @# t; G//global variables
. l! Y& W0 y' s, G. p2 |1 Uvar hoverColour
; t0 T! m" d8 A, E! g0 Ovar numLinks;7 Z* S# s  W8 D0 q- C% ^  G" e
var rate;; {) t' c! a3 n1 a5 F. U* O" \
var numFadeLevels;
/ r; u/ a" m2 d/ h% y4 Fvar bgR;8 S" b2 E9 Y& s3 E
var bgG;
5 v' J' X! A) ~0 V1 k4 U* Hvar bgB;- V% F5 }) Y3 I' d7 @( c1 U/ R! u
var currR;
5 h" {! v" ^1 M+ l- ^/ q/ Yvar currG;& D6 }0 \; S! `1 d+ q9 l
var currB;
& b% V3 w% c- f# n" Bvar count;; v2 _$ X3 ~( f1 U  A$ t5 b
var fadeOut;* W2 z2 q1 b( D- i
var continuous;# u  b  V7 j- |2 @' V* H
var newColour;& m4 r8 Z# O4 Z8 v, T/ D
var tID;# S" Q8 |# O2 M, ~' u, [
var redInterval;
! n: j1 [8 Y9 s3 l. \6 ]* evar greenInterval;0 |$ B7 K! Q+ n7 ^) \' x
var blueInterval;
# c: z7 [4 F) C% Sfunction initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
) ~- `; P4 k  h, @/ Z' E2 M{
7 l( |7 O, l3 Z        hoverColour = mouseOverColour;% D" K$ u8 J- K& c$ E3 i& J
        numLinks = numberOfLinks;
2 u. L' n5 X3 k$ D% G( p        rate = 1;. |" P5 T! \/ S* |% D) e
        numFadeLevels = 30;
- t; e6 c# i, J, Q- I        function initArray(theArray, length, val)+ |+ F3 Z: V. Z0 D0 B
        {
" ~8 m8 o8 B2 S: S1 a" y$ L* t  l                for(i=0;i<length;i++)
9 A5 r6 T, v7 y                {& X' {" W/ a5 t2 i, B
                        theArray = val;
: S' w9 l5 r% X3 o; s                }- s, p( H" S1 q- q+ C1 E
        }
1 ?6 G$ C2 h5 M        bgR = '0000' + fadeOutColour.substring(1,3)+ b, [: k7 X' h' B) {  [5 Y
        bgG = '0000' + fadeOutColour.substring(3,5)5 V; H! {7 ~" R0 T
        bgB = '0000' + fadeOutColour.substring(5,7)" p9 b6 {# N3 t/ [0 q6 D/ x% F
        currR = new Array(numLinks);
6 I/ p$ n7 C# v1 [5 \0 V5 w        currG = new Array(numLinks);( I/ B! y; x* d( u0 D( T9 N
        currB = new Array(numLinks);8 S2 x: a. ?. `2 x
        count = new Array(numLinks);
+ z- y$ T" z# u2 ~9 q& `" |        fadeOut = new Array(numLinks);
* ^' f7 R% d! {3 O. f        continuous = new Array(numLinks);
( g( h) a& C# }' ~2 S3 I7 R        newColour = new Array(numLinks);
4 K3 w7 o6 S: ~( r. m3 g        tID = new Array(numLinks);! I7 `+ z- G$ \9 Q% t  y
        redInterval = toDecimal(bgR) / numFadeLevels;% m. L- O5 V( O: G
        greenInterval = toDecimal(bgG) / numFadeLevels;
. F- N% v7 ^. a: @; g0 a/ F        blueInterval = toDecimal(bgB) / numFadeLevels;
# f8 b' j. T2 h$ X        initArray(currR,numLinks,0);% X2 W% t- Q+ Q$ Z5 O* k1 e& }
        initArray(currG,numLinks,0);- p& E5 e9 j4 D% b* V
        initArray(currB,numLinks,0);, H6 p/ f" O3 k' g5 C
        initArray(count,numLinks,0);5 r# h4 v$ p' R5 w  P) H2 Y9 c8 I1 N
        initArray(fadeOut,numLinks,true);8 W: }& K  p  z: {3 D* E
        initArray(continuous,numLinks,true);; _& n6 q) L; J. C7 H- _% j$ a
}       
1 x  U6 t+ a3 N/ R0 Bfunction startFade(id)3 v+ g0 {# ^+ q% a5 Y) i
{
, k0 }, ~  \% ~2 ]        if(fadeOut[id] == true)
9 K9 j8 H* w4 i/ X6 u& c7 D        { /*move colour towards background colour (increment)*/
' J+ t0 I/ Q! M8 v; |                currR[id] += redInterval;( W% i: A" M3 }+ r7 e
                currG[id] += greenInterval;# K6 m* i0 m* Z4 T, w0 z% X
                currB[id] += blueInterval;
! g: b; [; `" D! d9 q% Y                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
+ ?, o  q3 Y: i; U                if(++count[id] == numFadeLevels)
9 W4 |2 X; N8 ^0 Y$ v9 q3 X7 a                {% g# c' V, |' \
                        fadeOut[id] = false;
% J) z2 P5 l, R                }7 x' F7 D$ G. n: L) D
        }
' D" r: y6 X1 y* F" l        else
. s& D" c# M; [        {
$ `8 {  h* {3 p* |                currR[id] -= redInterval;
) {3 K: F! W3 c# G# g8 k9 ~3 |$ ^4 P2 j) C3 |- |# [# b1 L) P8 O
                currG[id] -= greenInterval;! g  V: m5 E' w2 L' H) j
- I+ @4 d2 P( a
                currB[id] -= blueInterval;
4 E" g2 U% g# \9 p3 J% I" M! R) b0 J4 z8 |" \  n+ y! s: B2 N
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
4 n2 G, M( C1 h* F0 p4 ~  s& ]) y7 t) z  p, N+ a  ]. A+ D
                if(--count[id] == 0)
* v, D( E  E1 Q, n8 W9 N( |
2 n) _* {# ~3 s3 p1 t                {& ?- v9 V6 S; }0 o' R' |
! F. `1 M: E: a( h$ z2 n4 w
                        fadeOut[id] = true;& r7 V7 P* e( `

. B. {0 k+ Z# e" t% ^0 l                }3 g: g- ~5 m" h
% d) \% Q, }7 d) d! k+ T/ J
        }
- g& g  U9 r  F2 Z
# [7 m& W; D1 v; G: M7 k$ u& @        if(continuous[id] == true)
% }7 [0 q$ s3 O4 H! p# m! w1 ~$ h# n' V, g% @4 d
        {
1 a! b; a( O. S1 o5 ~2 w
3 f9 ^3 U9 s- c+ }" V4 Y4 Q                document.getElementById(id).style.color = newColour[id];                - U# W1 P5 M; K5 I
; X; e5 C8 j! {7 a8 _! E
        }5 b2 F6 [5 s1 b0 j# Z) o6 r7 A

9 v' s6 x5 @' y) Y        else
0 u& ~- A( @7 \" w- X5 R- s+ C! r, J# z* Y  e* p* d! ^+ V
        {1 Z* M: _' U# S! @/ ]
# {( {+ L0 ]6 {
                document.getElementById(id).style.color = hoverColour;
2 h: V3 ^! g" e
/ i, g( }1 u, }1 M9 F* L        }
" ^" ^2 `. T$ E; M7 ?( {, ?& I7 W9 @
        clearTimeout(tID[id]);6 d, A- ^1 E  J% I
8 W- i1 T4 f) d, U
        tID[id]=setTimeout('startFade(' + id + ')', rate);3 D( g& I: p/ A3 m: _) e

1 B3 {1 {/ W4 H6 d7 W( K0 s}+ c9 K& J5 G. e; Z2 x

5 G3 P# e9 r3 dfunction continueFade(id)
/ ?, ^' x2 ~: n5 y1 t
4 U/ \  f( N9 H$ |{
; d8 p  }) m! L
: N: B4 L9 f; I1 ]! i3 A" P  v        continuous[id] = true;0 ^3 [3 L2 K1 A% \" V8 ^; k

, S. V3 ~0 s; E7 ~  A, }: h9 k}
! {( K5 j# _: z4 r) {: }$ G8 c; D
9 Q# \$ l* u  [; b5 Ifunction stopFade(id)3 [! Z, ]- \: w2 l; S0 @# D
/ [, ^8 _( c/ A  i& }5 p! Q3 J
{; y+ k: }2 n& q$ T7 b, u

6 U3 Y- r& n# a  z+ Z- J, Z        continuous[id] = false;
' [* E! a( x5 Z
2 l2 `* p$ {' D2 I  o5 L}9 @/ W5 q2 R+ j1 d8 A; o- e" H( L
; C/ Y; B7 {5 J
function StartTimers()
9 J' {& ]3 ?2 c3 K$ G
, h2 w6 w2 m5 Y( t{        //set up an initial set of timers to start the shimmering effect
, m/ @! t% ?' ?* O- G8 Z) c+ `) T1 b
        for(id=0; id<numLinks; id++)0 ?% P2 h1 l" ~! l* z
5 W' ?- p8 r2 s# r
        {
- c8 ]$ \" ?+ Q7 z( ^9 t
  Z3 X3 @. n7 ^: [                t=setTimeout('startFade(' + id + ')', id*100);" O# o; a. d7 ^

8 G5 {# f9 u1 c  d        }  p- p' }$ }6 y2 k# K+ T

. s# y- o% [: U1 \, X}7 E# U9 s- m  q- h
# {1 s3 f2 O* \& U! M8 ~
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')4 g) i$ l, B, X& U, y

7 l  t" ^9 A$ l( `+ M% Q9 _& w* AinitLinks('#FF0000', 6, '#FFCC77');
3 b4 A/ W* h/ R/ o! I7 X* t/ B/ g3 w2 E2 [( @
//-->
% T, \2 X4 ^. M8 q) [, o
9 ^* F. |" e7 y6 v; l/ ^% D</script>
* b6 z2 H# x. U6 O* Y! Q0 h4 t<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元6 g7 K& B( f- J% @, v, K
</a>
. K  [: R, ?" Q: M  J<br>4 K$ M( u: J0 a
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>6 l8 J& X+ i2 p8 B9 D
<br>
5 U' J1 q& o4 K0 G<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
2 C* K! M: D3 ~* t<br>       
+ I$ N9 h' {; y8 w<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>) q4 P4 @1 o/ L8 i: ^8 h8 j) \
<br>2 T# d  |" w" K8 k8 D
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
; G. J! M1 q! o* w<br>9 F; S/ S5 T& J# C( S
<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>
  W* t6 z" t7 m7 o<script language="javascript" type="text/javascript">
: D; f# h6 M; e$ B<!--
. I7 e  D/ ]* YsetTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
( O" h9 [  ~5 x! \//-->
+ ^% d, X. J3 I" ^; F4 A</script>