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

zw2004

<script language="javascript" type="text/javascript">/ i- G' ~$ v- W) b
<!--; i, C% P. W& p* F% @
// convert a single digit (0 - 16) into hex/ z( Z) u& u$ W- y1 j4 O8 a
function enHex(aDigit)4 K0 w6 K4 Y) t
{5 m5 J1 T! H  S' G. T5 f7 j
    return("0123456789ABCDEF".substring(aDigit, aDigit+1))+ X: n  O( H) f* C6 V
}! ]: Y  `" @7 T  k8 x0 i. Y
// convert a hex digit into decimal# v% }; G: l7 }' c% Q; K
function deHex(aDigit)1 O) j7 d; m9 A6 J
{
' {+ M  `% d0 q. R  |; w9 r    return("0123456789ABCDEF".indexOf(aDigit))4 S# ~5 u8 y  c1 O
}
/ h% c$ N$ t+ y$ z7 f( n. w3 R; C
// Convert a 24bit number to hex3 [* S  l7 O! M+ V2 S
function toHex(n)* R$ ~& e# q% E9 `/ U' E
{3 Q8 b8 O, n8 C
    return (enHex((0xf00000 & n) >> 20) +; `1 M& ]9 l# x% `+ w" H4 B
            enHex((0x0f0000 & n) >> 16) +, m% R8 P, Q/ z* m/ V, A  t) r( G
            enHex((0x00f000 & n) >> 12) +
% ]- e1 Y' i6 k* i2 e% J6 |! U4 u            enHex((0x000f00 & n) >>  8) +8 y' l% Q1 J7 X
            enHex((0x0000f0 & n) >>  4) +
5 Q/ |" u" B  L$ W            enHex((0x00000f & n) >>  0))4 X; u$ m  b5 Q& ?  D
}
+ Z5 o+ m$ F( \! r! g7 T// Convert a six character hex to decimal7 A8 S. ^5 {7 N, W
function toDecimal(hexNum)
" N) [/ F8 Q1 T8 r( F# W( c; |{6 d) X- \1 p6 z' T. ?5 ?" y
           var tmp = ""+hexNum.toUpperCase()
! o: S$ p& z* `# r( x# d: @    while (tmp.length < 6) tmp = "0"+tmp8 N9 ^3 d* Y+ u; j9 D$ f. `# k
           return ((deHex(tmp.substring(0,1)) << 20) +
. B& }& Z) Y- H: V1 j' r# }$ O                   (deHex(tmp.substring(1,2)) << 16) +
$ i* u  g7 f$ v  k$ a& J& f            (deHex(tmp.substring(2,3)) << 12) +
8 W- ^0 ?0 Q/ _/ g6 f' I            (deHex(tmp.substring(3,4)) << 8) +
; D  X7 d4 b: B) A# M            (deHex(tmp.substring(4,5)) << 4) +, @8 F, t! i! I4 P2 f
                   (deHex(tmp.substring(5,6))))6 e3 @  D8 r5 Q
}& c, k) v% o$ u+ b
///////////////////Shimmering Links/////////////////////% ~- A; N4 m5 x- @2 c
//global variables$ y* _3 d2 C% z9 X: s2 a
var hoverColour
- Z) V  [& ^! ]0 Uvar numLinks;
) G: R. Z) q) G! y4 n3 U7 X& x! Hvar rate;: U" T& n- m- d* |1 |* ~% }9 ]
var numFadeLevels;; e  [) J' n) Q! D9 d$ @
var bgR;2 v( I1 U3 f4 Z6 h1 ^2 G
var bgG;, [) I, K, V2 a" \
var bgB;! S* f+ J$ ?2 U- w% h8 V
var currR;8 x( g3 z/ L' f
var currG;! R6 \6 p. G. S
var currB;
" ]. m# I+ q+ y; dvar count;5 p3 D0 s7 M; e4 l. ]
var fadeOut;
9 P2 f. ?6 ^! a, u0 ~# evar continuous;* S5 @9 i9 Q6 q( b; \8 j
var newColour;, m' M+ k2 ?5 {8 T# ?+ T/ o- o+ f
var tID;
; W2 `' X( g; |- N, g8 [7 @# Lvar redInterval;
. F0 s' q9 Y0 }var greenInterval;+ ]1 i. ?! ?) G
var blueInterval;% X8 L6 M1 p" C  z9 T
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
8 g7 y$ R  n  y2 B; h0 ~: N$ ~{4 g5 f6 y: q& o- r% C- S
        hoverColour = mouseOverColour;" M( @$ a8 _5 U  O$ G! F' [$ h
        numLinks = numberOfLinks;0 l3 K9 l: D; J$ x
        rate = 1;$ T7 M0 E- b, @. \! e$ V  g% ?6 `
        numFadeLevels = 30;
* g; t  r% d- M0 L9 ^! Y3 c! s        function initArray(theArray, length, val)
7 e) H+ z5 U2 C6 k0 u# t$ K        {
$ p, F8 T8 F- z" f6 z: X                for(i=0;i<length;i++)
6 S  B$ D  A; |, ?3 X                {- g% d& B4 z3 E, e: h
                        theArray = val;
0 y6 P/ W, L8 I7 w& h) B$ C                }
" M: e/ e& H! W/ p, K- l' T        }
! n' s& I% S: K- E; Z        bgR = '0000' + fadeOutColour.substring(1,3)5 J0 ~# F9 @9 ^7 x* @
        bgG = '0000' + fadeOutColour.substring(3,5)
0 Q. E: T+ k% \        bgB = '0000' + fadeOutColour.substring(5,7)
: U1 O+ _2 p% B9 o( ?, C        currR = new Array(numLinks);9 m1 Y- f$ R3 O$ s9 Z- S
        currG = new Array(numLinks);; Q( i* I( |5 `2 ^5 k* q% [/ w7 M9 m; l
        currB = new Array(numLinks);/ b1 B. l1 [/ o9 K; \
        count = new Array(numLinks);
; H' y* Q/ R' [  \: G: q2 H        fadeOut = new Array(numLinks);& ~0 |$ Y) `; M  ?' [. i, J
        continuous = new Array(numLinks);
: z# S; V7 G4 w  R        newColour = new Array(numLinks);# O. C  T3 w( S* D) F/ A+ t
        tID = new Array(numLinks);1 m5 S& ~5 Y$ z6 C0 e& |3 V' D% B
        redInterval = toDecimal(bgR) / numFadeLevels;  O( B6 a' I: n+ B+ G* k, R
        greenInterval = toDecimal(bgG) / numFadeLevels;
( B" h; S* V1 k% [- I" F        blueInterval = toDecimal(bgB) / numFadeLevels;
5 `: r- u. _- @; u0 _4 ?        initArray(currR,numLinks,0);
/ M+ d$ T6 c( R2 C) P        initArray(currG,numLinks,0);9 G& }- d$ I& y
        initArray(currB,numLinks,0);
6 z6 M9 J: @) h0 x8 r        initArray(count,numLinks,0);
* p' a1 d+ q4 C        initArray(fadeOut,numLinks,true);; M! _- W2 N- E
        initArray(continuous,numLinks,true);
" p# H& H+ {+ e}       
3 ?+ D/ L! u, H4 `5 ]3 ]function startFade(id)/ G& _% r" r- m/ q# s
{. O3 M0 M8 f0 u9 ]4 S
        if(fadeOut[id] == true)
5 I" j. P& s* `        { /*move colour towards background colour (increment)*/
. C# U/ W+ E$ [                currR[id] += redInterval;
% F0 i7 L+ B! k2 n                currG[id] += greenInterval;" C0 K" _' [; J5 O2 O
                currB[id] += blueInterval;; b" @$ j- a: Y9 g
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
# g& s: J  l6 R* [* \9 w: `  J                if(++count[id] == numFadeLevels)
, ^7 G  l) z+ {0 U8 O                {
& ]. \4 b! D. H4 w' f, Y. D, c                        fadeOut[id] = false;! i- R% A2 g0 n2 L% h( T/ h
                }; M" B# m8 x: S- i8 t8 D
        }: e& o0 b: [+ L. K6 i
        else
* E$ ^2 E& T8 S; r        {  E: U) U. M; J: q  q" K
                currR[id] -= redInterval;
6 N) G/ j! z& k$ R
; g4 w' L+ F; F                currG[id] -= greenInterval;
: m1 j( _# M8 M& ?0 j$ O% j
; O4 q4 T) m3 c! C9 y& R                currB[id] -= blueInterval;9 ?4 z$ \. ^4 k) p  u+ k! o
& K  n2 I/ M1 d
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
/ ~7 Z. l3 o) f) T1 S! z! L/ y6 _2 }+ y# G& l6 n
                if(--count[id] == 0)
8 D% z6 i: A  w' Y0 I. c0 M5 `: i. y) L7 K
                {
" P9 ?1 z0 f! J4 n  j* F: d3 G
/ k# ^9 O% f) @) k; }$ y                        fadeOut[id] = true;
+ i, K3 E; n. _( g- r) z3 @' I. h3 z2 P4 T( W6 ?
                }! `0 S) U- y0 L- y$ y3 ]. U; m

4 H5 |+ [& M' z, l1 J& _        }
. T) q% n7 c: i+ ^  V7 l8 N1 O
        if(continuous[id] == true)
1 x8 D1 M* n# j% _5 W% C4 E9 K0 j! e( i
        {4 S2 X. v- M3 q- B2 x
, l2 Q3 S- u5 k7 \  ?" a
                document.getElementById(id).style.color = newColour[id];               
  }' d3 e  u7 d" h/ A' }; K% r" }% a
; b6 J5 s- U, w. Y+ I. o        }
; N4 U$ ?- J$ r  M
6 r" h1 S( Q) ~2 M2 M+ d        else5 E' A/ T3 V) Y9 L3 A8 F

) B' A. o# S0 W* R& u        {
/ _+ J  [& Y- W4 X( `: V  o$ H; p$ `
                document.getElementById(id).style.color = hoverColour;
) _. H4 R4 s- w2 B
+ F& z" B; D, M        }8 c3 H7 z. U) \- x

" l1 T, C; J3 ~: b        clearTimeout(tID[id]);, F# u+ z8 Y6 |. V
' s. i9 E5 b$ C. o9 h% D& D$ w
        tID[id]=setTimeout('startFade(' + id + ')', rate);
3 ]; Q% F5 ^: b  b# T0 D# d, {9 |1 N6 R
}
3 P; [' F' @  \2 Y7 A
2 q" D( g4 P& Pfunction continueFade(id)- v! M  l( s9 `  t- N
; s, H- o& G: d7 E2 ^
{" b" J, x" j9 V1 l

/ o3 V$ a; D9 i  H        continuous[id] = true;; s2 E) M8 n- o, N5 ~
+ g0 C* c: y3 v/ N% h$ X
}2 i; D/ d% w$ e
  S, f9 x& k4 j0 b
function stopFade(id)
9 f- _6 K# B, N4 f6 N0 J- b7 h+ n9 h/ y& q( e+ Z& Z
{
+ ~# @7 F! C8 o
8 Y3 B! D$ U+ U6 B4 S        continuous[id] = false;/ u  h; e) @& ]( ^
2 _! D. \1 A, Q  C/ \! L
}' f# P/ ~3 i9 F* r- u4 o( }3 }$ w

6 O+ b( D* H1 b. J" B# vfunction StartTimers()
. V2 D( s9 L8 O! \0 S/ b, {7 z* a+ `9 ~- U! e
{        //set up an initial set of timers to start the shimmering effect' h2 Q5 H3 c3 b9 e; d- k& m
' V$ P- E6 Z* j. ]
        for(id=0; id<numLinks; id++)
$ J  j6 ^: u8 I4 `8 Q+ D3 U
" F3 {+ d% C7 E! K: o0 R        {
; j! M3 e" F0 M) ~7 |& G
/ H% |8 Z3 x" v8 P                t=setTimeout('startFade(' + id + ')', id*100);  J2 d9 p0 O- J, u2 _) l$ r# k

0 P1 r. @* }+ ]4 J8 z. f        }
/ [+ Z: k+ n! s/ A9 K8 Q9 O) ~0 j( L% h0 F* L: X$ A$ J
}, Z9 B1 b! [0 [' I
8 k( g7 R. o% F% {$ _6 [4 K8 n$ c7 N( E( L
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
' b' ~8 h* Z6 I+ k8 ~
0 t/ f. a7 b( L6 r. F9 yinitLinks('#FF0000', 6, '#FFCC77');
& l5 X* j# x1 z5 M
! i/ v6 u( A% n//-->
/ W/ z( p- T+ [9 j2 G- R6 Z$ }5 _! v" E
</script>3 O' \2 y3 T1 o) @2 ]
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元
- @) M- N! i: h</a>6 r, m3 L8 i  A4 g
<br>; V* `1 K$ {! R( E3 U
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>
) k- `1 k8 s) d& J<br>$ Y& Z4 g6 Q3 i3 @9 v% B6 K. V) H, y
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
% m$ X# a0 G: N0 z6 x2 V. X<br>        5 e, x" d9 v  A2 g
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>8 V, {5 {7 n, q1 `. ]/ ^4 g
<br>. A0 @6 d3 F/ Q  ~% c
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
$ h2 H; F0 F) D. }# L<br>
2 d& U6 W) R# A4 a" v& \<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>
" u$ t# n) t5 M$ K0 M<script language="javascript" type="text/javascript">
: w1 e" `& T8 v1 i0 @" Q% ]; L3 E<!--9 E+ e- ^8 P# F* I# X# P
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
# A& Q' S4 [  \. G# v' E' F: U//-->9 O- D: d: u9 y; b, T% s
</script>