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

zw2004

<script language="javascript" type="text/javascript">; g' c4 U% C! B0 S( z* f1 E
<!--, C2 z. `. {1 T
// convert a single digit (0 - 16) into hex) y% p$ K1 D" j
function enHex(aDigit)7 s0 H% C% s1 q! [2 Q
{
* m( @$ m8 B1 I  L' I/ R    return("0123456789ABCDEF".substring(aDigit, aDigit+1)). q, _1 i, U+ o( B; H& R
}0 U8 V0 x, V0 F" o3 S
// convert a hex digit into decimal
+ S0 U8 F& c0 ]& efunction deHex(aDigit)
7 O# k, l3 `1 K3 I4 ?6 G{
. D9 `+ _0 B5 a- B- s" }& Y0 y    return("0123456789ABCDEF".indexOf(aDigit)); M& r( v  E  F8 l: n% `! y8 |
}) t/ _. D. Q  B, Z- C. X$ z4 a

7 k- O1 w/ A/ F5 M1 k- F// Convert a 24bit number to hex. C7 M1 x) z! C# |  @1 {. F! e
function toHex(n)
$ l9 W5 v# P3 o3 D  ]: K" s4 i{
1 M" }4 L$ T2 e+ a- u    return (enHex((0xf00000 & n) >> 20) +
3 X0 U# i2 ~" z. }            enHex((0x0f0000 & n) >> 16) +, }' T; s# {$ ^9 U0 S" A
            enHex((0x00f000 & n) >> 12) +9 \8 |- I" g* l4 R5 V3 |
            enHex((0x000f00 & n) >>  8) +
' A% n" I/ w4 a9 |            enHex((0x0000f0 & n) >>  4) +; O9 ^5 D3 ~5 J4 r0 g: |
            enHex((0x00000f & n) >>  0))  @, J' [' f9 D# m; l
}0 k' X& f; [. O5 B, i
// Convert a six character hex to decimal7 ?& W, L9 I" W; h; |
function toDecimal(hexNum)
! }8 t, T# P) E) P3 r8 W5 K{( |9 p1 C3 d% E5 M- v
           var tmp = ""+hexNum.toUpperCase()
  v9 ]) m+ B: U9 Y# E5 M    while (tmp.length < 6) tmp = "0"+tmp! n6 s! X! C) Y+ P
           return ((deHex(tmp.substring(0,1)) << 20) +7 s% H; q4 ~( n, O" Y
                   (deHex(tmp.substring(1,2)) << 16) +
# _5 E# G, r+ g- }  x& O' J. n0 n            (deHex(tmp.substring(2,3)) << 12) +
- h6 K+ j6 S7 P' ^; Z            (deHex(tmp.substring(3,4)) << 8) +
: |0 o, ^  A$ W4 T  y. p            (deHex(tmp.substring(4,5)) << 4) +6 t+ s: _2 |& M6 w' F7 O
                   (deHex(tmp.substring(5,6))))1 f  u8 \" a; k) W, k+ R) I; y
}
) q% y# ?: P, _. X  _- }+ ^. K9 h///////////////////Shimmering Links/////////////////////
. d% ]# ?- a! B5 A& F//global variables1 K8 T0 f- b* j: I
var hoverColour" C) z2 l( v5 P  _7 L3 S
var numLinks;
9 d1 l2 W: I- y" |$ D( \5 Yvar rate;
9 A  V2 }. q% @4 ~var numFadeLevels;8 x3 ^3 Z. q( f2 y
var bgR;+ j; {- C. N* P: M
var bgG;4 F6 l! Y* @) r5 C# U
var bgB;" i8 i9 ~+ {! `1 }  ~
var currR;
; E3 I: ]3 w) }3 U7 @var currG;
" N/ o; n& m- ^  |5 g1 L; Fvar currB;
- x9 e/ T( U9 W' l* D8 P5 Nvar count;
5 {9 b1 l( @# h0 g  }! xvar fadeOut;
) a6 L2 R4 x5 F6 O4 [var continuous;' ?. ?5 U: h! R9 a- g6 b5 [
var newColour;: ~& U3 a4 Q2 U3 Q' l
var tID;4 o/ B& f9 ]$ D; O6 D# o+ |
var redInterval;
( |, Q2 \* Z# ]6 o  T" @) b1 v# A) @var greenInterval;' E6 t) P7 U( B! Z
var blueInterval;' z4 a+ z+ o8 m+ J9 m
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
# b% F' @# ~. v" |" ?" [{
; o/ N% C9 B7 [        hoverColour = mouseOverColour;
5 x2 e$ \# x! Q3 A& I# o) `6 c        numLinks = numberOfLinks;
: q' X3 e  a; I        rate = 1;  J  y$ p7 i8 P0 X( P$ l, x
        numFadeLevels = 30;
: ^2 C/ y+ ]) P8 \" S$ p        function initArray(theArray, length, val)0 k6 y: z; R9 d3 N
        {. j( D& @2 L9 F" V- H1 S! N. I
                for(i=0;i<length;i++)
, i& u- e. |, y. r1 W* G                {4 e7 h8 a* g) h5 c2 q2 p
                        theArray = val;- m1 Y" ]9 B; L/ c. Z: z$ i
                }) Y; u0 i# e9 @, T, E
        }2 P& ~8 f# J8 n& _
        bgR = '0000' + fadeOutColour.substring(1,3)
6 d: I- l9 O/ b2 L2 t, {        bgG = '0000' + fadeOutColour.substring(3,5)5 X- u4 o+ P( u/ Q
        bgB = '0000' + fadeOutColour.substring(5,7)
1 o" T- p& a: E3 F3 Y# x3 v' }- A        currR = new Array(numLinks);
  Z0 |5 O! m0 h( J( x        currG = new Array(numLinks);
! V/ Q/ e6 z0 X9 Q0 V' {        currB = new Array(numLinks);
' I8 a" i8 k0 c! N( X        count = new Array(numLinks);
' N! K( n! w/ J+ @2 }        fadeOut = new Array(numLinks);% K3 v. a: y8 y& ~) V* G
        continuous = new Array(numLinks);2 v3 z! h3 ]7 b
        newColour = new Array(numLinks);; O! H9 ?- [" I$ _# y! a0 P
        tID = new Array(numLinks);' N# N' m) e2 S
        redInterval = toDecimal(bgR) / numFadeLevels;
4 j: G( v8 r5 H# C        greenInterval = toDecimal(bgG) / numFadeLevels;% N! q1 a- j: O$ Z% f+ k
        blueInterval = toDecimal(bgB) / numFadeLevels;! }7 A+ v: h8 {- w2 M) c
        initArray(currR,numLinks,0);/ f: {( N1 r7 ^9 d) T' ?2 M
        initArray(currG,numLinks,0);9 x5 Z9 j% W6 Y# c
        initArray(currB,numLinks,0);
1 _1 k" Q2 v+ J        initArray(count,numLinks,0);
$ \) a. h/ d' ^! k- u% p8 Z) x3 L        initArray(fadeOut,numLinks,true);
1 K9 w1 o) K7 t& q3 X        initArray(continuous,numLinks,true);# t: _* }4 c  v7 ^% E6 G) U  u% ~; D
}       
6 F/ s3 ~1 `9 [' X. bfunction startFade(id)
( H1 D' t; F% G& z) Z( [! N0 n8 e# S{5 `, y" h( A# `& C4 A
        if(fadeOut[id] == true)
; K( y: M0 @- O3 i- }        { /*move colour towards background colour (increment)*/  O, C; {$ e3 q# |2 {
                currR[id] += redInterval;
' s7 I' Y( ^9 a4 Y& Q0 q  O5 ]) G% J                currG[id] += greenInterval;
+ Q% Q7 l0 e0 Y" B                currB[id] += blueInterval;
# X+ G7 ~# @) Q5 K" f6 A; t# F                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);1 P' m9 F+ D1 s% F
                if(++count[id] == numFadeLevels)' {3 h! M4 j! W2 |3 a5 R& K+ c  a: i
                {1 t* v+ z- q3 z( ]  [  N
                        fadeOut[id] = false;
( d( x, n: c& f* B( n                }
+ ~# P" Y9 [+ c" [. E7 x+ N5 u        }0 |7 U$ q# D; x. {2 ?
        else
, u0 R, H0 k9 G        {1 Y9 b# _. o2 e4 b/ |
                currR[id] -= redInterval;" c5 j" X/ e/ O3 O1 J# M9 M

5 p5 T9 ^/ m$ z) G4 x  q$ B9 t                currG[id] -= greenInterval;: }. p& u5 R" V9 P6 P1 g& j: W

' L# }6 ^* g; \                currB[id] -= blueInterval;
$ i, {2 V6 @$ S4 x
$ ~, o( y1 r# T* ]2 G* n8 D                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
6 h' {$ S8 o2 N- ?; `& Y3 d5 R% @3 L/ M+ F
                if(--count[id] == 0)& B0 g; Q6 w4 i$ I( ]

+ t9 ]2 a3 h% R/ T. l) Y7 J' {- ^  ?                {+ i) i; x, `8 t- f
; h6 _$ w& m- w6 X
                        fadeOut[id] = true;
1 S7 R- s  u$ W+ P1 c# ?: Q
8 a9 j9 j) u) Z& F8 D                }
5 S4 {; y8 E8 O: b. B, i, b5 ~; z* `. W, t& @2 Y; T
        }
+ p/ _: E" S. Q3 a  C2 ^: Y. @9 I
( i" I( Z- ~3 y4 @/ K4 J* Q        if(continuous[id] == true)/ D7 V0 t' d' B9 ]3 [- f

0 |7 Z3 D& i; P4 i        {
, `+ b! v3 _- c
& J# R) N# a* H/ G                document.getElementById(id).style.color = newColour[id];                0 b. F6 S1 ^9 i" c0 ^- B+ s

! t6 o. Y: \1 Q) W6 s( E( }* f' K        }) p, P+ e! j! c+ e9 s

2 B" ?! u# ~* K( p        else
% L- Y' {5 F6 g: w* U% n
/ c/ b, ]2 |: i        {9 e1 c3 B4 H4 Y6 ~; V: s3 h9 z7 E) P8 I

5 U3 f5 G  T4 w5 [3 I! m7 U                document.getElementById(id).style.color = hoverColour;
; ~9 o* O7 v+ }! T/ n) o4 P7 n& j! y: D3 f/ l: ]/ q
        }  E* ?+ K' |2 r% f+ Q% ~
. ^! v+ q: |7 U) C0 u! o
        clearTimeout(tID[id]);2 H0 ^( @0 Y' ]5 ^: x( S" M
8 d# k0 a2 L. B1 L
        tID[id]=setTimeout('startFade(' + id + ')', rate);
- j, ?1 F# n. s4 e. v5 s$ P5 L/ Y/ k7 |+ E  e2 e4 f
}
  s& ~+ L+ ]- p6 E0 n
, @# _5 s3 z! J- J  Wfunction continueFade(id)
* ^+ e, G- I7 L+ d
6 v3 h7 O  C; j( x0 E( ?{% q6 N. ]- \+ @3 T$ s1 g0 k5 h3 ]. k

# |& T; A! A* a- [; b& U        continuous[id] = true;3 T" g. i5 }1 W: d+ y

! k; f/ F' ^' n! L7 L}, E$ {4 Y; q% b

0 ~9 \, n1 Q7 Q% ?function stopFade(id)) d. H) p( _: Q; J# ^
) p1 L! E& I+ q6 Q
{
' F. b2 R$ }9 R2 q! b; b' u
" r- m' _- U; u7 U2 Z        continuous[id] = false;
7 k  a/ {; g, b* }2 c& p: p. D- x7 l, i1 f, P" p
}
5 A, n' M% }' L1 @* I3 d. D. u. b% \
function StartTimers()
' {4 ?5 W; b3 }8 i4 D' H) H' V9 W7 ~4 A$ ^6 B% a) a& b
{        //set up an initial set of timers to start the shimmering effect# p- O/ l0 }# R: c/ \* ^

/ p$ V, l5 C  L        for(id=0; id<numLinks; id++)
  o% K& d5 A2 x( E: x
5 k* r3 R5 h# k' P/ F        {
& d2 N/ @: F. `! i: p; X+ R2 y1 L6 f' ~. `( d9 w# |& _5 h
                t=setTimeout('startFade(' + id + ')', id*100);
  p: k8 A1 ?# b) l% N
( V6 h. K" S, y% X) \8 e        }
  ^( N& e) \4 C3 [6 |, j
0 x5 b" X! a5 Q- F0 |8 B}
% K/ P, q% B7 F; p* E
; u2 Y% V" q7 N: g7 T//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour'): B# c, m! x$ O- c1 {) A. R

6 V( ]3 O9 m5 ~- [; RinitLinks('#FF0000', 6, '#FFCC77');
1 V. O/ \( Y( t! r( n5 {4 a" j& X2 B! [1 ?. q
//-->+ i; }6 E, ?+ A. T. V5 W

7 o$ w! e$ T2 F( ]4 B</script>
0 J) j# A4 c4 _" X. S<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元
' B5 _  ?% O5 n9 s$ c</a>
9 U  }& E+ d7 t& I<br>0 h, p% Q9 I9 @0 m4 `
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>' `, y4 M; c" E5 w3 w/ c
<br>$ M! Z5 {! a6 Y8 ^* }$ n: E, ]
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>0 ]& ]. S  [. w0 b/ x1 @, C2 R
<br>        & |' M+ h: W, K3 I- Q
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
" w: q) J* ^9 O<br>
, e7 t" c: S) a9 V! k<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>, T& H, U! e  u- S4 m; s; f6 ?
<br>
+ A% z0 L+ h4 Z2 u<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>, H7 E7 p3 a+ G6 j* P/ u, D# K
<script language="javascript" type="text/javascript">
& ~3 m: [0 K) S3 P/ ?+ D% D/ }2 u<!--" M0 ?" J+ I( J4 x* B/ A
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
  d* Z8 u) L  s( M8 M: A) p5 g4 c//-->
1 {' }3 X7 n! v</script>