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

zw2004

<script language="javascript" type="text/javascript">1 I9 y. J' R8 q5 J% |3 z
<!--
9 @1 ^1 o: a  E# ?// convert a single digit (0 - 16) into hex9 I( C* Z" ]/ s# `8 }* o
function enHex(aDigit)
, h: h! G3 b4 Q{; p7 @3 i9 {0 s% T
    return("0123456789ABCDEF".substring(aDigit, aDigit+1))
+ c5 H! Q9 l, a, e, G* D2 X, H}
' Z6 D$ u$ D' c// convert a hex digit into decimal1 f) V4 z2 L+ b6 m& b+ n
function deHex(aDigit)4 r+ Y; r, b3 T+ ?' J
{
( w7 w; Y8 }9 q/ T    return("0123456789ABCDEF".indexOf(aDigit))
* O" c# T6 ^' R) [) V}
/ e6 o4 q" L. D) r; K9 w; [0 a
$ u  g* b/ J  s5 o// Convert a 24bit number to hex
" n1 ?( {6 U; Q1 W3 c. rfunction toHex(n)
+ v1 Y: J1 f4 V- [+ q  |{
' y" j+ P1 e) {! c$ X6 D/ _    return (enHex((0xf00000 & n) >> 20) +" T, s. V( p) K$ m
            enHex((0x0f0000 & n) >> 16) +
8 Z8 x, j; f# J2 t            enHex((0x00f000 & n) >> 12) +3 n) Y* z  T# q  D" C
            enHex((0x000f00 & n) >>  8) +; I3 w, ^2 ^( f* h! B% s7 j8 F
            enHex((0x0000f0 & n) >>  4) +- l# Q+ x% i6 Z* k
            enHex((0x00000f & n) >>  0))& ~( G" B" H) E! {( D0 V* }2 M
}
+ S- e' g# A, B// Convert a six character hex to decimal* b* \/ ~* V( n+ t
function toDecimal(hexNum)3 g% C( c+ h# l) W7 y( V
{
+ [( [, M5 x8 B+ a- C7 J7 p) T8 g+ D2 P           var tmp = ""+hexNum.toUpperCase()4 e; u, U# M8 w+ y
    while (tmp.length < 6) tmp = "0"+tmp
6 `$ s  C1 X" r7 H4 B           return ((deHex(tmp.substring(0,1)) << 20) +
) ~% Z! T. V0 P: z                   (deHex(tmp.substring(1,2)) << 16) + 2 `8 F3 a  m$ }! l. }; {% U& A
            (deHex(tmp.substring(2,3)) << 12) +
) o7 x9 S" I& K5 t  b% U            (deHex(tmp.substring(3,4)) << 8) +. `( I% [: W* u" p( j6 L. \3 i
            (deHex(tmp.substring(4,5)) << 4) +
7 u7 _: Y& v- U                   (deHex(tmp.substring(5,6))))5 L& n, a4 _0 H* |( q8 p8 \
}; h; |7 e+ a) x- B% s
///////////////////Shimmering Links/////////////////////4 l9 \, r- w, [$ }0 c& Q! x
//global variables
6 G2 K$ w3 V9 ^8 ?9 `6 P9 Svar hoverColour
* k! `% E; ]  P9 |- H) _var numLinks;
# m$ }+ u- m% |7 l% W; M/ Bvar rate;# g. _5 e3 P! o( z8 Z' y
var numFadeLevels;
1 F* k: D+ y3 n5 E: e' ?! Y4 qvar bgR;, U4 `# L7 y" }0 g, L" O2 f$ Y: d
var bgG;
0 @! m5 I9 g9 |( Mvar bgB;( m( f/ {$ M/ @/ A; O% w
var currR;$ Z  ^1 N( t6 E6 ^: r5 Y
var currG;
1 S# w6 W" d0 h, yvar currB;
6 g9 `. B& b4 ]0 f6 B8 P8 x, b: p( `var count;9 N9 I7 J! Z, W0 @6 R$ c
var fadeOut;
3 J* ^$ `  @  ^8 O) L! i+ Rvar continuous;4 U5 s6 \+ p! E6 N
var newColour;
  f0 ?2 e2 n- S* Uvar tID;' u7 R+ u9 N% ?9 s' X* p
var redInterval;
8 Q. [5 x3 U7 mvar greenInterval;
) Z2 ]) k+ E& i1 y! E, L' b' c( C" ivar blueInterval;
$ i3 F2 C/ D" {5 c& U- P. nfunction initLinks(mouseOverColour, numberOfLinks, fadeOutColour)# e3 @4 k% y' N. `
{
8 z- v5 B8 ^. h. i. g! {        hoverColour = mouseOverColour;
) V- S$ Z3 K( a/ ?! a0 @' U. O        numLinks = numberOfLinks;
- n* P+ ~) d6 {# ]2 ?        rate = 1;7 Q$ O4 k( V0 U% P  |
        numFadeLevels = 30;4 T1 B4 `( k4 b0 s( P/ J% p
        function initArray(theArray, length, val)0 @& ~! ~- d  L
        {4 u' W9 U2 D& V* ^
                for(i=0;i<length;i++)
' N% o' J: w2 O% ^                {8 @! P, K( L8 V8 r+ q
                        theArray = val;( a7 X+ q  r' _. b* t! b
                }
+ v6 k0 H" X# ]: T$ b+ V        }4 f; x2 \0 c3 _) q, Q
        bgR = '0000' + fadeOutColour.substring(1,3)5 E. E) ~9 z& t1 N
        bgG = '0000' + fadeOutColour.substring(3,5)
/ U. Q! @+ N  Q2 _  z3 |        bgB = '0000' + fadeOutColour.substring(5,7)
9 t! [- M% J9 J/ S        currR = new Array(numLinks);! [- X! V  i, N& i5 F# }3 j
        currG = new Array(numLinks);
( p2 g  U& S; _9 }" A9 {4 y/ F        currB = new Array(numLinks);& \" H+ u; P3 j  c$ M
        count = new Array(numLinks);4 f+ Q6 |% z6 c. |
        fadeOut = new Array(numLinks);
' h. H, j5 v1 g1 ?) F& P        continuous = new Array(numLinks);/ h( }: v3 q8 i* s% P. q: i8 Y& y! Y
        newColour = new Array(numLinks);
8 R  Y2 L( u& ~9 @; H4 P        tID = new Array(numLinks);0 Z. i+ @3 }* Q$ E7 h
        redInterval = toDecimal(bgR) / numFadeLevels;
  I/ C* `" H  k  ]( |        greenInterval = toDecimal(bgG) / numFadeLevels;
7 k3 `9 l' ]0 F        blueInterval = toDecimal(bgB) / numFadeLevels;" G4 o0 p  j% }  z
        initArray(currR,numLinks,0);
, O* v5 U# d! b7 t1 L        initArray(currG,numLinks,0);
2 {$ h, d  k0 t( m        initArray(currB,numLinks,0);  p3 c% l: _" T3 s! _, h. F
        initArray(count,numLinks,0);
: n" K* J$ _6 u        initArray(fadeOut,numLinks,true);4 G9 _3 a; h+ l0 W  I( z( Y, N
        initArray(continuous,numLinks,true);
$ c6 {2 Q7 }; n+ S1 q8 x) t; |}        + w# `4 L0 C" |6 k# j7 v
function startFade(id)
* b2 u& q" O; L& w4 {. I1 _{
2 l( _" P" J; ~        if(fadeOut[id] == true)
7 J. E- y0 t! u! @( i        { /*move colour towards background colour (increment)*/& _# {+ X# ?8 a9 P
                currR[id] += redInterval;
0 K9 T0 O2 [7 X                currG[id] += greenInterval;
' p/ X9 O" }1 d# ^& I1 P) D                currB[id] += blueInterval;
  l6 e3 \4 }  R& A* M                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);) \( V: S6 t+ l1 z: X
                if(++count[id] == numFadeLevels)
% T6 h/ u4 Y+ o, f8 w                {
! L% C: ]( G: Q; s( Z5 U                        fadeOut[id] = false;
& ]4 D  X! I1 w% B3 l. m1 ?% R                }$ ]" f  p/ a, q) k6 g7 K  \+ z* ?) b
        }" W( \7 H0 O' T4 P
        else3 t. @5 W* L  u3 X5 i4 `
        {9 i- J- [4 t9 ]
                currR[id] -= redInterval;
: {! E6 I( R3 h" L3 p( c3 ^
- |) W0 e, `4 t7 t% G+ v                currG[id] -= greenInterval;
) e: |8 J+ q3 y, u  f- c* X" v; [
' a# A- v5 x" L3 D) X+ C0 q                currB[id] -= blueInterval;1 m; x" i1 o0 k3 s, o! Q, }9 }

7 I/ N; L- ~* \8 e- F! ~* x7 u5 U' b; N                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);# i9 X8 g6 Z- z* p' C
. H" ]8 W; |6 g6 U: E9 x+ f
                if(--count[id] == 0)
2 B! l3 c3 J& H% @
  ?: L- _5 P/ L% b: y) ~1 r3 A                {
) r/ v! l; [0 e5 d: O% X- P/ W) m( K
. n' V+ L1 m3 \  Q6 ]6 \/ }/ Q                        fadeOut[id] = true;" f% q  q) n- s9 {

/ l- Y1 \) C; Q                }  l* x$ M! d/ z3 j# M/ {
$ I" D/ B0 w& i$ u# e$ j: I) d  F/ B
        }
* x- F6 Q3 m# J: h
4 a9 y1 d- |# X1 x5 Q. g        if(continuous[id] == true)0 ^* I* |! ]( I- g

: k6 j9 I& x$ M7 P        {* c, ~3 `( d/ k+ ]3 Z6 M

" _1 p% B# W6 v; {. S0 Z+ @: X                document.getElementById(id).style.color = newColour[id];               
4 X' l+ [# W" Z5 M+ d3 n- b
$ k2 ?, G9 c! u: N8 V        }2 X  L6 R2 C5 F, o3 u
! S- M1 F& H! D* X! `6 \9 M) H5 \$ e9 B
        else
0 v" R. k/ U$ q* C9 q( ^+ e  f& T* ^
        {/ ]& \$ C( T: Q, l
  W9 S- M$ n( x/ ?! \! H. H. t
                document.getElementById(id).style.color = hoverColour;9 `& U" b9 Q5 a4 L
! K$ X# ^/ S  F, J; {
        }# W5 n' L; m8 d1 A: `2 s
, D+ v6 |# U4 n1 T6 l1 O/ F8 Z
        clearTimeout(tID[id]);
' c) [) t) e2 W( ]4 R' j
% s; y2 [, P/ m0 I2 S/ \8 c: `        tID[id]=setTimeout('startFade(' + id + ')', rate);! i. [: V, n, E) m6 i$ T3 c  F

# Q" @' v% S9 @/ _  M% N' ?}
$ K3 n% r! R2 J% {$ u
% j9 d- C6 Q% C7 d3 H0 e' \- l- Qfunction continueFade(id)  f  H% d# d1 K, ^( M
0 N  `1 d1 u# o; Y4 ]
{
0 F0 F) D7 v. T1 x8 w: x) p; G
8 x6 [2 L: t, X& t; S( O        continuous[id] = true;
& u8 t3 V6 u( B8 z% f
: ?! d8 I) U- W1 E, W& `}
% E# r0 t# w7 `; Q2 o) J
2 s3 }0 m# S/ s, w, V7 d: H- Ffunction stopFade(id)
* k. i4 R" t, i7 i2 U9 O2 X$ B' o/ p# H# G8 a3 E6 J3 e2 J
{. r6 |$ p. R2 f+ B7 p0 P& \

7 z. o! I6 a$ g( {( z        continuous[id] = false;
! I; j! H* X. z( V( O- i7 p
) o1 y. D* }4 I- [% I}
* |  \5 _8 a& I1 }2 _% c: d  V
+ r+ E7 l; B/ c' ffunction StartTimers()  x  }/ D: t  G# `0 x0 [1 j

9 F& s2 Z, x4 H) ^  g2 f4 r( M1 b{        //set up an initial set of timers to start the shimmering effect! f) ^2 `% m1 h. s
% ^0 }$ v+ |3 W9 t2 p
        for(id=0; id<numLinks; id++)
6 h! s9 T6 p$ U4 j9 U! `- m: |" R8 Y' M" e
        {3 z3 Z' k7 ~4 y+ X, b
- V9 q9 k& ^! N
                t=setTimeout('startFade(' + id + ')', id*100);- w: b0 h9 t4 [& O# y

# `! M0 B/ I- ~! u' n        }5 a* O- H( q9 X# j
) _. A' H: {# E* R1 \# s8 g& |
}
4 y! |! a: i, n3 O5 v) V3 {! B  m+ \; F
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')3 i+ J& B, M1 N, @# J  h0 J6 n

: {( b% Z+ ~$ T& ~4 JinitLinks('#FF0000', 6, '#FFCC77');
  M& |" h8 T2 o2 T; r. N% ?" v! k4 G- J9 s( x, ]
//-->3 C* H# _% z, p3 \9 O  u: s3 ^$ B

  \+ f( w: [: g2 F: c</script>
2 P; ~; t! n5 u8 T<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元
+ j/ u4 ]+ B* ]# x- o# s</a>
5 U( l) }" L" q. O" m! u' k$ i<br>
; U* s5 D7 o: f; @; ]$ z<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>  O' m6 Z- U4 }# u1 ^
<br>
6 h, S) Z' u2 C/ G/ |% s<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
$ j# q& X' `+ Z& b" i0 F! C<br>       
- \7 s7 G' H  B<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>6 M& b6 Z& [" i4 b( n
<br>; B6 K0 o% X! Q7 I- w
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
- [; q# S1 [% {" C. K% \0 g<br>4 ~3 q5 z$ w0 U1 f+ z. h
<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>
- e/ E' D* e% L  S0 j5 i<script language="javascript" type="text/javascript">9 A3 `* `% A7 h1 o9 d7 I( L0 U
<!--* F4 W- b& p; f
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering7 q7 C4 [- F5 W5 c
//-->/ N8 B3 L! Z0 A, f5 D- N
</script>