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

zw2004

<script language="javascript" type="text/javascript">
6 x- L/ R; N0 K" i0 i<!--
- [# d' G0 ^! U* f( [9 W; c5 g// convert a single digit (0 - 16) into hex8 ?0 X9 Q# t. S
function enHex(aDigit)8 Z6 t" {" m- k. S8 j+ T* \* D4 v
{' L, d+ t2 l' n& |# r
    return("0123456789ABCDEF".substring(aDigit, aDigit+1))
7 J  g7 X# s5 v9 `9 B}
# W4 [* b; u$ f// convert a hex digit into decimal
# H: p" t# V, ]  U) ~! ?# qfunction deHex(aDigit)/ m1 Z) ~) z9 H* s9 h
{
3 \' a: s  u$ s6 j( i    return("0123456789ABCDEF".indexOf(aDigit))6 ?0 l# F" @7 m. u
}9 N: I2 \# X6 y
' S* \9 T( s. B( Z! a
// Convert a 24bit number to hex6 P, {% C& {, e; t$ k+ V+ R& U
function toHex(n)
' s7 S) o# _4 v) J& _5 e4 U{* ?& E0 q% N! O9 N- R7 I* ?* J7 \0 E
    return (enHex((0xf00000 & n) >> 20) +6 k0 ~7 l, Q: a$ T6 p7 _: i$ R
            enHex((0x0f0000 & n) >> 16) +; Z; g+ s, R! }7 F& {
            enHex((0x00f000 & n) >> 12) +( X: H" @/ m6 z$ [
            enHex((0x000f00 & n) >>  8) +: T& m4 Q; m2 n1 f4 D0 m9 o# Z& n2 I
            enHex((0x0000f0 & n) >>  4) +% O+ m. ?! [  P  J
            enHex((0x00000f & n) >>  0))
# f( |" {1 ?; H; P1 s}; |& m3 b) g# I+ W' Z# P7 K
// Convert a six character hex to decimal" m$ ~4 v6 \- y4 A4 W& R/ R
function toDecimal(hexNum)
2 N. U4 K9 |3 L$ l) }{6 U. E5 o* ?; ~3 W; N  W+ f
           var tmp = ""+hexNum.toUpperCase()* x! d9 {0 [$ `0 P, A2 }
    while (tmp.length < 6) tmp = "0"+tmp/ t3 ~8 l' v3 k
           return ((deHex(tmp.substring(0,1)) << 20) +
& ]; e- H9 Z' f6 C8 `                   (deHex(tmp.substring(1,2)) << 16) + 0 A( M& d, g( {/ H1 v$ z* `+ s
            (deHex(tmp.substring(2,3)) << 12) +
; J& g' D; Y; n3 s            (deHex(tmp.substring(3,4)) << 8) +  n* x4 `; q; p3 j0 l# E  i# |
            (deHex(tmp.substring(4,5)) << 4) +" i9 Z' P4 ?" j, ]3 D
                   (deHex(tmp.substring(5,6))))% o0 A3 E; }+ Q* X  b2 K
}
7 A6 I" J: C7 k. Y, X  k///////////////////Shimmering Links/////////////////////
. Y: g: z: i# c9 c) l6 D$ A# X//global variables' H( C  ^$ l. b6 h; M2 \
var hoverColour
2 @" N1 V, P2 e; j) Tvar numLinks;! c+ Z, z6 P2 ^
var rate;
, s! W  S# ]; j& S( Yvar numFadeLevels;
; Q! q  n7 ^+ T! Ovar bgR;
4 H$ j0 k  s1 m! G5 @8 evar bgG;
5 C; f+ m, t1 }: j+ svar bgB;
$ l- L& I+ c' d6 T& x/ j/ Z& B$ rvar currR;
. v# x' k3 v2 F8 J) cvar currG;
5 h; j3 k, x9 i) }' L8 @! _1 nvar currB;
) S6 l( B2 l; K+ s9 b- Tvar count;
; o4 M: X6 g2 b/ q+ X, g2 Ovar fadeOut;
3 F% s6 w! t9 b/ K3 O# b, Jvar continuous;
" n2 p7 ~% T) q' mvar newColour;
9 s' g  H& v+ s" i, I' u! u+ Kvar tID;2 k& W1 E, v' [  `* w" h0 s
var redInterval;# r- |! j' A3 M0 [
var greenInterval;
6 b4 E- |0 z$ e/ k4 y6 h" a$ fvar blueInterval;( A! T4 W/ H  s# \# ~
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
; L6 d; d( {0 Z  @7 \6 u2 {{
% v9 v( X5 R" W3 j$ @; e        hoverColour = mouseOverColour;
9 K9 l$ n7 s7 t( b- E7 b1 M        numLinks = numberOfLinks;/ B. K0 Q. n& B. n8 g$ o- ~! I# a
        rate = 1;
8 W2 e/ Q9 g2 J5 f6 l0 C; K( W        numFadeLevels = 30;( T6 g9 o9 q. u3 @- H( Q
        function initArray(theArray, length, val)! Y* u2 d4 V2 ~- @! ^0 t3 a# i: X
        {
/ b% y$ a( I* d                for(i=0;i<length;i++)7 Y  \' `( F! v/ C2 }, [' V
                {
2 Y% z$ `! ~$ S/ ~/ w( k                        theArray = val;" E1 w$ M3 p) ?
                }
+ d4 m9 b4 {  v3 |% S  ^: e        }
& N$ ~4 V  w% i* F        bgR = '0000' + fadeOutColour.substring(1,3)( n. B5 V$ O& X5 h- W8 |
        bgG = '0000' + fadeOutColour.substring(3,5)* ^+ W' ~  [' y! x8 @- J
        bgB = '0000' + fadeOutColour.substring(5,7)2 \8 a. v, _& P! L' F; p
        currR = new Array(numLinks);
1 d+ i: H& Y( I+ `5 {. y        currG = new Array(numLinks);
, ^+ Y4 r5 I+ d3 r" Z) M        currB = new Array(numLinks);
& H: w- M5 j2 ~1 M; _; S        count = new Array(numLinks);5 Q# K! g; K; O
        fadeOut = new Array(numLinks);
8 S$ F) a' f7 W* c        continuous = new Array(numLinks);+ z( G9 W9 Y# q  r0 O/ u
        newColour = new Array(numLinks);4 m# m7 S* D! d, D& |; d: w$ d
        tID = new Array(numLinks);  D& D3 }$ R7 _8 x0 v( _; a
        redInterval = toDecimal(bgR) / numFadeLevels;
$ ^! Y& u7 a) c9 G3 a1 I& ~, Y. |# i        greenInterval = toDecimal(bgG) / numFadeLevels;/ `: o( A' G2 b& J" E  K- z
        blueInterval = toDecimal(bgB) / numFadeLevels;; C$ J2 Y" e" e2 P2 V( W% |! w; b  O
        initArray(currR,numLinks,0);* C7 a3 V9 m0 S$ H) }7 W7 z) k0 i
        initArray(currG,numLinks,0);* W+ e, g4 Y0 T' T% f; ^; ]
        initArray(currB,numLinks,0);  \8 z8 g+ b  ^) k% q
        initArray(count,numLinks,0);! v0 X% T( \7 `" E9 t  |
        initArray(fadeOut,numLinks,true);
9 c. [2 U( U$ G+ M8 O% f        initArray(continuous,numLinks,true);
) o8 H8 V7 f4 y, z) Z/ G}       
( P- I7 z8 o$ ]3 @. a. F& H' gfunction startFade(id)
0 |' x9 O4 g% c$ C! O1 y2 ~; P{$ V2 X" q& s5 a% E6 \- G
        if(fadeOut[id] == true)
" d* \) L8 ?& a9 b+ B        { /*move colour towards background colour (increment)*/' ~3 w) c6 Y( a2 C% J
                currR[id] += redInterval;1 Q: I1 f+ `6 a* J/ B* d# s
                currG[id] += greenInterval;2 J) I+ J: V  Q7 E
                currB[id] += blueInterval;4 e  B3 S  Q1 @8 `& A
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
4 S, i7 z/ j& }& x; S& W1 x" A                if(++count[id] == numFadeLevels)
" }  L" A/ l0 W/ D' H+ C. n                {
( \2 i6 {& R+ i* R) g                        fadeOut[id] = false;0 j" n  s/ H- v7 d
                }+ R* e8 m, ^: |- Z
        }
3 G9 y7 e2 m: _) W  ?; H! {        else
9 ?2 d( }! s6 n# O        {
% X& z! o7 D4 g                currR[id] -= redInterval;7 _: F8 H5 _5 Z/ H
  T% f, U6 N  @% C1 a* H
                currG[id] -= greenInterval;
5 |$ {1 _3 d+ u* k4 b1 H8 y9 D, l6 L" _: w
                currB[id] -= blueInterval;/ `* S1 q- `1 L$ b5 `1 `( R

  U0 W) @* w/ F# [& r                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);8 a) b4 A9 J( D* X

5 x% y4 t  w7 N' V2 U) }6 C: h                if(--count[id] == 0)
* L, H3 _/ i+ h+ j' e% v0 u3 u" y/ m' u7 y1 Y( N/ L
                {! C; N# m' F! _9 t/ N
( u% J) t. C7 l9 K) O9 ?) H
                        fadeOut[id] = true;- \8 {4 P* `8 F: c# I
9 {' I. s8 C( [# ]: T
                }  ]5 ?- l# M# Y3 X1 J
" [5 `8 M, u2 G% p3 r9 g
        }
: Z2 ^3 c5 c# ?7 x( Y4 e+ Y
, l- O; E( U" q        if(continuous[id] == true)
2 ~; p" ~6 Y6 J4 ^& c: e, v. V- r" c) n/ f2 H& t
        {
- |- b  }0 Y7 S2 [1 Q) e6 D
; a3 |1 u: D. d; F* c* }; K) I2 p                document.getElementById(id).style.color = newColour[id];               
3 L) b4 D: d" \5 e. c+ C- j/ j9 ~, F2 F- f' C5 a" b) b. b
        }& e9 X3 U, ?6 p3 f2 x: u4 F3 V

7 a( d1 _9 c7 m$ x3 E  @7 R        else) G3 m- ]$ S; |; o' a1 x
- A5 `5 b$ L7 B) O3 d& Z
        {
+ J; i+ M" ^# s) l
; O" f! W  a8 c" S) p! i                document.getElementById(id).style.color = hoverColour;! W  f4 |5 z, G& p- O/ h. g
% X# L5 M: ~8 H- A6 A) v* @. N
        }3 Y4 F. S% S. }3 y( u
6 ]; y4 l$ W3 B7 A' n/ b
        clearTimeout(tID[id]);/ B1 r$ k8 h0 ]/ O# e+ ]- A

. a, F+ Y  S$ U( d" e5 n        tID[id]=setTimeout('startFade(' + id + ')', rate);, A% q1 x" o) V# B% Q" K
5 H' Z' ]8 D; h- w7 S3 t
}( Z3 K$ `" @2 p1 _0 A! A
6 ~& F& |3 O' m) {& G
function continueFade(id)
! _( @( Q6 D2 q2 b9 m8 Z3 [+ |
/ ~6 Q: I$ s7 E- G6 ?: _{
" M" _& f: K1 _( ~3 _' \$ Y5 u
& H. T' u! M- A1 }        continuous[id] = true;8 u. y- c" F, h3 K

+ n( S/ k- c6 q/ b}* G/ @! O$ v3 s! h+ W, N
/ S* w" W7 @$ r" A* Z
function stopFade(id)
$ @# E% T, U6 Y6 e$ ?8 N! e1 ^: y: c& z9 Q7 o
{
& e9 R9 F4 Z- l6 t0 p2 H
% k- ?' ^7 L# W3 K0 V. u        continuous[id] = false;" R% K0 b. M9 [+ H& e. F

0 f0 s% a( e- o5 f7 \7 N/ T}
7 o& D7 ], N3 v# W8 l
$ ~- V: i$ |% X" S0 Ufunction StartTimers()% \) W8 z# Q$ m

7 Q2 O. K5 _, C1 k- M{        //set up an initial set of timers to start the shimmering effect
8 ^; Z+ l, t/ w* _" w( P
2 F7 ]1 v; ?1 c3 Z- ]. m        for(id=0; id<numLinks; id++)) s( Z6 K3 Y, k, }5 f8 U1 u
7 \* f$ ~( q& y8 }; y' ?
        {
" L; o: B, }; D9 h9 _% O' e5 b
+ U+ W6 K  p% v$ X) O3 Z4 C                t=setTimeout('startFade(' + id + ')', id*100);
6 ^8 n* ~, A3 N- W/ b- v1 Q
7 z# ]4 S0 M% ~( r, V( m9 u# w        }
6 z* P6 @6 c! |" c& j& U
2 {( t! d; h6 I}. ~" J1 R8 `/ p3 p$ `) X. \
3 }& t0 d0 [) i3 U
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')5 |  e1 j: \0 B7 ~- D

% x  n  A7 M+ `+ x4 W( d7 V" g! K# einitLinks('#FF0000', 6, '#FFCC77');7 w+ I& f, `. o; g! F0 f8 G
" P; C+ J& Y) R4 L: ~
//-->
1 ~1 [0 C* B7 H% P: |$ K+ x3 x
: L5 K* g9 h$ D6 V</script>
; K3 B; {, r  U+ o3 }8 g<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元: X7 ~$ Z3 S. b$ B
</a>& [4 I2 @0 o& N9 ^* D2 j( H
<br>
; t  Y) F' A  l2 X5 d<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>0 g) b# j  J- L, u
<br>) h) }5 w4 h6 w
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>1 y8 c6 P9 n* K, X2 S
<br>        + q* J& ]; Z/ C2 A! s, C# r
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
' K7 m5 K. ~7 m+ Y* w<br>
! [6 j& W$ g# r<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
( g: i. J8 j0 ]0 ^, h$ Y0 ]- v<br>$ W  d* x8 b6 P4 h6 O( N2 S' E
<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>; u! k5 N1 S3 _5 E/ N/ `9 o! C& G
<script language="javascript" type="text/javascript">6 O# S* b- B) Y) r: ?6 l, R
<!--
' l  N3 @$ ?/ S6 f( ksetTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
8 |5 s7 E  F9 X//-->( {) D% t1 O( R2 J/ V$ s% H
</script>