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

zw2004

<script language="javascript" type="text/javascript">0 y" p  I/ Z" A1 x" g* u# y0 }$ R3 g+ X
<!--
7 Z& o/ V: b: g7 A' t8 z1 N// convert a single digit (0 - 16) into hex
2 o1 L& s6 U& V( `function enHex(aDigit)! q7 R3 M* l' ]8 w  v" q" A9 a
{
  n8 [9 j$ w+ H    return("0123456789ABCDEF".substring(aDigit, aDigit+1))
8 L' O+ w' v/ E# t, O}# f( O, G. X. b0 n
// convert a hex digit into decimal
2 V' D. [* {! `, D$ f$ i# ^function deHex(aDigit): ~1 ?% Q$ ~. c0 W" X
{" x  [& n0 ^  O% P6 G5 [$ W
    return("0123456789ABCDEF".indexOf(aDigit))- D4 E( K: h' L, S0 Q/ ~
}
; q5 x5 t/ w6 ^  C: _# y
& j( y% K8 m% n% s/ G5 t$ `7 P// Convert a 24bit number to hex
- `7 u* w" N0 P: W: ffunction toHex(n)
. g0 U4 V* p3 N" E7 R7 f( x{
$ r% D" ~$ ^. t- z( |+ o$ V/ W    return (enHex((0xf00000 & n) >> 20) +
) ]6 n% J) Q& U( }            enHex((0x0f0000 & n) >> 16) +
0 t# R+ \$ s8 ^            enHex((0x00f000 & n) >> 12) +
3 I2 e" T* R- a9 X            enHex((0x000f00 & n) >>  8) +9 W( R9 y$ K3 q
            enHex((0x0000f0 & n) >>  4) +
: a# S) e- Y3 s( i            enHex((0x00000f & n) >>  0))& l3 i: T8 D& _  ]( e
}
6 v, @6 k2 u3 D0 ]& N// Convert a six character hex to decimal
. r  n# h: E& O7 Z- ifunction toDecimal(hexNum)  Y7 w9 @2 `+ \! g
{1 n# r/ d1 r) X7 h
           var tmp = ""+hexNum.toUpperCase()" X1 z, `8 E# P" b
    while (tmp.length < 6) tmp = "0"+tmp
  a& U; B: x5 v' {; ^           return ((deHex(tmp.substring(0,1)) << 20) +
  Z& r7 U# l. Y; c; z: d% c# p                   (deHex(tmp.substring(1,2)) << 16) + 8 v$ t# ~7 `5 k# F! n+ t9 h' [
            (deHex(tmp.substring(2,3)) << 12) +% T  z( l& \- j% Y5 G8 x7 P4 z$ o
            (deHex(tmp.substring(3,4)) << 8) +% \" r9 y. q; T* n5 C
            (deHex(tmp.substring(4,5)) << 4) +2 w' z; l  z# K7 v
                   (deHex(tmp.substring(5,6))))
* m* L# |1 t' t7 E  Z* f}
5 H- _) r) [- h( m( v///////////////////Shimmering Links/////////////////////3 d. h4 P: R; c* F
//global variables1 p! w' ]  I$ C
var hoverColour
9 n1 T- U  f# u& W: a5 Kvar numLinks;" h# T3 \: [" h/ v" N
var rate;
, H) H4 S# v9 W2 `var numFadeLevels;
, `) O5 c7 P6 B' x; ]7 h/ ivar bgR;
8 ?5 O/ v3 b4 b( J4 U6 uvar bgG;" W, g3 a6 V: C3 p. }
var bgB;
9 j" Z- F( J; D. yvar currR;
& j( _: N( D2 S- j8 o4 Kvar currG;4 D  [: D, g* r2 D6 O
var currB;
2 {- f1 K6 j  ^9 q6 Tvar count;
) ~# e: m* k6 uvar fadeOut;
4 Z& R0 [6 J- M  zvar continuous;" U! D" c4 k0 g) [2 }
var newColour;4 r* {0 r5 s3 D* R" q! c, B& |
var tID;
. k2 ~' `$ n, `' t) A' Fvar redInterval;
8 b( g) N- L! |var greenInterval;* x) h+ x+ X5 w/ a+ N9 m3 d" H  [7 v
var blueInterval;: \7 ~+ e  {0 i
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)% b6 c" n, q4 Q8 L6 J! K1 j" G7 e
{
; R; x, @+ Z2 Z! e) h, p! W# X2 @        hoverColour = mouseOverColour;
' I5 n: H$ g- s3 A) A        numLinks = numberOfLinks;* L/ ]5 ], J# Y( d& a* C' Z
        rate = 1;3 q9 d1 T' k  R. u7 m7 f
        numFadeLevels = 30;3 c7 f! d, N+ i) N1 Q8 }( K* S
        function initArray(theArray, length, val)- g( t0 H+ e' N! y; n) @
        {
+ U$ P" ?; r5 l/ C! M! K4 c                for(i=0;i<length;i++)
8 t7 G  Z2 r% _+ Z* J# u2 t                {
# G* }4 T1 l% \- a/ M) I" B4 J                        theArray = val;( G/ ?* i# s7 {! K
                }6 P) a3 F: d( L, g' a0 ~/ C2 g! K
        }/ A5 z! {7 U, ^2 _$ M  }
        bgR = '0000' + fadeOutColour.substring(1,3), _, w. E& u! a
        bgG = '0000' + fadeOutColour.substring(3,5)
# e# l  B# n& Q8 }2 Z* v        bgB = '0000' + fadeOutColour.substring(5,7)7 U. f' V, ~- e  H2 c" f2 e
        currR = new Array(numLinks);
' @+ K% d" v) |& y, ?4 Q; {        currG = new Array(numLinks);4 a) Q* C9 \  J" A$ W9 ^
        currB = new Array(numLinks);
* t" f& q8 V# h        count = new Array(numLinks);
% \, i( O% l4 v2 d; K2 {+ ]        fadeOut = new Array(numLinks);5 P& N$ l$ Z& X+ K) `: F
        continuous = new Array(numLinks);- S$ H; n1 Z: _
        newColour = new Array(numLinks);
6 |( G3 v/ A, G/ |$ [2 l( Z) z        tID = new Array(numLinks);
0 h& V% u. d  f7 i& y        redInterval = toDecimal(bgR) / numFadeLevels;; a* U) c* |8 K' }, Z/ M
        greenInterval = toDecimal(bgG) / numFadeLevels;
5 g/ S4 R. A/ U- J        blueInterval = toDecimal(bgB) / numFadeLevels;
' |* B8 V/ L" m        initArray(currR,numLinks,0);- _" U5 S9 w( R
        initArray(currG,numLinks,0);
3 P8 C: n8 p9 P" k7 [9 Q2 b( X        initArray(currB,numLinks,0);  a- f, y3 U: [2 U6 k& b
        initArray(count,numLinks,0);$ @$ V# h" B% b- o
        initArray(fadeOut,numLinks,true);: ?9 R4 }2 w1 o: }& `% \
        initArray(continuous,numLinks,true);
9 ]; u0 W7 j- J6 l. K}       
8 q7 ]* Q# _  L, B: h5 B; Yfunction startFade(id)
( k( S# o4 K' _7 K. V{
3 _- L% C. j* u( J" |2 I- p$ z        if(fadeOut[id] == true)" ?7 n0 `% s% h; p+ M6 c: w
        { /*move colour towards background colour (increment)*/$ J3 @' v2 v# @  @: a' @* o
                currR[id] += redInterval;
& ?* n7 w1 `' b6 ^# \                currG[id] += greenInterval;
4 |& m0 K5 Z" K7 t( ?                currB[id] += blueInterval;
" o3 \. b7 ^  g6 W# F- [                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);/ j1 z$ l" g% t- K
                if(++count[id] == numFadeLevels): N( g0 a+ _: [; N# v- s2 r2 c2 r
                {, r7 T2 f* Q& M* s, N- u- [
                        fadeOut[id] = false;3 A9 n4 ^% K6 p( k
                }
/ s4 l7 c7 ^8 D! F        }
( {" c0 P5 Q% Q: @7 F- l% Q3 H        else
; ^; _* T# }( I5 Q$ ?        {
2 p9 r% Q% G+ [. x                currR[id] -= redInterval;
% x8 m) ]) G3 D4 K! P
# ~+ [# L' Q% O. |4 b  }( F) U                currG[id] -= greenInterval;
+ `' w( _) i- V! [( e0 S0 O1 ?8 U( J# X8 b1 u6 T) d7 M. U
                currB[id] -= blueInterval;
. ^; j. N8 i  }; B' |& L  F
% Y7 ~4 E0 i0 w                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
3 j( u5 m8 {8 K2 v) W
% y: K; l' M& ^. Q8 u; {                if(--count[id] == 0): L# g  c: d% W
! N3 B& g, c* }6 ?' D, z8 @
                {% ~! v  Z0 y# y5 D9 \

7 e4 q1 @" N, m. N$ l                        fadeOut[id] = true;
1 A# @  Y' W0 S9 I! \6 M3 P
1 ~: i2 X. r' ]                }+ ]3 O: ~# y- p# p# Z" I8 T

) l; ?# Z" Q% U& }        }
5 E; }2 D; c6 F* Z* S; p/ r7 \! S) c2 K. R% \) I
        if(continuous[id] == true)  O+ X8 ?, D. {9 K+ j7 }
% Z- g3 V" e3 w
        {
! R% v6 S: R) Y
- u. V/ C2 j6 G- d0 a" E2 B                document.getElementById(id).style.color = newColour[id];               
) T1 D9 u' r! K# n" G& G8 b. y) c+ m% ^) Z( l8 m
        }; A9 l5 b9 {7 Q0 N1 o5 Z
' Q: G. J4 [% f8 B" x# n5 a
        else
& q5 r/ w* ^. V' L& D) g8 o3 y( f& d
        {. u. X$ G2 R1 @- Y+ \1 G
4 B5 o8 `+ J2 b' c4 B& b1 _: X7 d+ [
                document.getElementById(id).style.color = hoverColour;
. Q9 g- {# d! t2 S, i
% B: s2 C$ S% x9 J/ H        }
# h9 G3 O! c. I  o( y2 n  X; R' n( W, K( b0 X
        clearTimeout(tID[id]);
8 F+ ~4 p  P  ^! C0 ?3 [
; I1 J# r: d6 h        tID[id]=setTimeout('startFade(' + id + ')', rate);
& V" A. ^( _2 s/ r
) N2 m' p4 u0 n7 u5 _0 u+ \% d}' s) S$ v9 V) a# X; X  |

: z$ d* j* [- O0 s2 o+ Lfunction continueFade(id)
# V0 R3 j9 w: X9 E  R' M, R+ M  g6 J! I2 K& Y/ G: V" ^
{" x. r' S; f5 ^8 D
; x# W& Z) v; T! d, a# R4 A
        continuous[id] = true;
2 |: \3 i6 k, p! o* r) ]$ m% [8 K" C$ C* m$ T1 L. u( n
}
; H' C; `# |6 [: j
$ u, x! l* x* ?: P! V/ `function stopFade(id). y3 n* o; H5 k7 f; d
: T/ V1 W4 X( y
{
$ c2 B& U/ _) q) q+ N: a9 F+ Q' W
  S7 _" N  y* N7 e2 j        continuous[id] = false;5 j8 [) ^  ^. b& _, g. Q, n, t

& g7 }7 s& q& P" T  s* v  C}  {/ w( U8 M( P* H: Q

7 |+ x- f8 B7 @5 ^1 efunction StartTimers()5 `8 C. i. q7 y4 O, n) m0 t

! p1 F, H! x$ T/ P{        //set up an initial set of timers to start the shimmering effect7 T' B) |. M/ p0 ^' x( X, q# Q
% L4 u0 R0 R% n$ R% a2 }
        for(id=0; id<numLinks; id++)! r3 _8 p6 z1 f: @

7 D; X: u4 C$ }4 f- _9 B4 f' _        {/ A9 r# \/ S7 {8 n, q8 l

- r; {  @; H/ B- M5 M                t=setTimeout('startFade(' + id + ')', id*100);
8 b# b- r+ x3 |( D8 R, i* H
, P0 F# u5 {3 E5 Q, D" W  E- ~        }
7 s' w/ O' U/ i4 ?& P5 m1 ]
% v# z$ P7 Z2 g( ]}* v3 e& h& T5 B0 e4 K

5 J4 a8 r0 L1 f% a, z//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
3 l4 r6 e5 [% w" N
7 l7 B- Q8 M! D' ?% dinitLinks('#FF0000', 6, '#FFCC77');
# f3 D$ N2 n4 Q/ u+ I6 h; X4 o3 ]
! X6 |5 O' R: [' m- y9 V3 P* i- Z7 e//-->
; B5 ?  s7 y" A0 Z. `- H
3 P- V' x' `4 C" R</script>* e) Z2 `# p1 q9 S; F* I/ J6 p
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元6 T+ n( e# x$ \, S+ F" R
</a>
( O9 N4 A5 `3 s<br>
( \' d; G8 `7 O( n<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>6 K. e% p, U; W
<br>8 z2 M1 o1 x, t6 P1 {' u
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
: W- n* J* p, p! M7 L% A<br>       
( n' |8 u4 f0 v& W5 A* B: r9 {& F- W<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>) e0 r% ^6 Z% I1 g: B
<br>
2 [6 }' M7 J$ u4 v<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>7 d" t2 v/ Z( k7 ~. M4 o
<br>! w, ^  a+ l, }0 ]2 p  i3 o. b
<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>
. `# U( P/ O' _7 Y/ [" E<script language="javascript" type="text/javascript">6 G/ t3 n6 y6 ]0 o+ y7 ~$ r2 w
<!--1 f6 O! G: F. W) j9 X, t
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
' a5 T* N! t9 i7 _( Y) a5 C4 `//-->
4 P8 O- Z6 s: Z. u* `4 g% Z</script>