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

zw2004

<script language="javascript" type="text/javascript">7 X0 |3 i" h0 w/ j1 _8 k
<!--- I. [- E8 l6 I" ^7 }" r. G
// convert a single digit (0 - 16) into hex( q" [& m5 i! Z9 V& H
function enHex(aDigit)
  P$ L6 A: n6 O% @9 L{
, r% q0 P5 A1 H* ^% H% ?9 O2 E. [1 I  F    return("0123456789ABCDEF".substring(aDigit, aDigit+1))' s9 y3 R& B  N+ P9 H, h* b
}0 e- b) M: M3 S
// convert a hex digit into decimal
' F9 M: D& u" s5 O! M2 f. n3 Mfunction deHex(aDigit)
* t3 o8 ^2 f" c7 U{
% i. z& K5 e2 L: r0 D. ?7 j2 a    return("0123456789ABCDEF".indexOf(aDigit))
- R4 V5 A/ V& m7 n) i+ F6 y. y3 Q}
! t$ Z. ?  @- J. Q6 X. y
* y- V5 Q$ d: U# Z" M// Convert a 24bit number to hex
; W" ?. t9 U4 v! Pfunction toHex(n)8 {% m2 i3 \2 O  |  y1 Y
{( |8 X/ P" q3 a2 j% E8 X
    return (enHex((0xf00000 & n) >> 20) +8 N2 v6 m; X/ k+ v1 e. B8 T# C
            enHex((0x0f0000 & n) >> 16) +" M; {+ ]) F" T) i# P
            enHex((0x00f000 & n) >> 12) +9 }: l% E% F: x+ p) v
            enHex((0x000f00 & n) >>  8) +
% _! G4 [6 V4 B$ g% K3 k6 f) W            enHex((0x0000f0 & n) >>  4) +
% D: ?3 \* ]4 H1 c6 T. O            enHex((0x00000f & n) >>  0))4 Q2 q( w  Z4 [9 j& [. ~
}% D# A% v' ], Y& w
// Convert a six character hex to decimal
3 S9 K7 ^2 o7 z( o5 o. s4 Kfunction toDecimal(hexNum)/ o9 s9 c- A# G, W- o
{
8 y! J6 I5 L6 b) }* E0 k           var tmp = ""+hexNum.toUpperCase()
# |6 c( K% H8 H5 n3 f+ b3 C    while (tmp.length < 6) tmp = "0"+tmp
5 ^, O) N6 p3 Q% \/ w3 a; U           return ((deHex(tmp.substring(0,1)) << 20) +
6 v( Y/ Y& i* H2 @" R                   (deHex(tmp.substring(1,2)) << 16) + 5 D2 p1 L2 x1 x' {
            (deHex(tmp.substring(2,3)) << 12) +/ p* |5 ?' ~2 D. S; e2 z
            (deHex(tmp.substring(3,4)) << 8) +
  y0 i1 i+ [& f. l            (deHex(tmp.substring(4,5)) << 4) +- K5 a/ h& T! Z0 g
                   (deHex(tmp.substring(5,6))))
) D) ^6 ?5 d4 x; y}
; c* i2 |  B* ^- k" \///////////////////Shimmering Links/////////////////////
) q5 s! {  r) ^9 @$ s' a//global variables# G6 b6 {! n* f7 B3 r) i
var hoverColour! J  G: j) U0 l: `7 i
var numLinks;
. b& I0 A! ~1 |, uvar rate;' J4 y8 l1 N! i4 s
var numFadeLevels;8 ~1 Y/ {! F9 F( [; l
var bgR;, p  U* W" }, q3 W$ A, E
var bgG;
! L& C; A3 Q/ w- y9 E! uvar bgB;
2 n6 P! p+ C& b+ c7 `var currR;
$ k! f0 W$ U" i* i- {) \var currG;7 ]' f  |% W* b' w! I
var currB;, B) X) s7 U8 t' ~' ]1 p6 W
var count;7 L6 y) M. n* H. O
var fadeOut;* p, i5 r* o8 K9 h( i; P" w" F
var continuous;6 W+ L2 |" Q* v+ Y  ^! x( {7 A
var newColour;' M. q, s* H1 M" A0 B
var tID;
7 K* S9 C7 }7 j6 |/ t" L- Nvar redInterval;, h# E# k" ~0 O
var greenInterval;+ f) \* \% t, l! a% I
var blueInterval;
8 e8 O& |& b6 ^9 `function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
2 Z* t$ [" P5 h' i" \{) m- W; ?  g" _  l8 B, n" C
        hoverColour = mouseOverColour;' o9 `& J; k. x
        numLinks = numberOfLinks;
3 ~2 ]8 _! B4 o. @- l# Q2 @# }        rate = 1;
" f5 g9 W7 x" z! T# u/ m4 R        numFadeLevels = 30;
: a( P5 G  w# ^6 T+ W! ?* a! n0 a* X        function initArray(theArray, length, val): y; S# ?* A/ }6 Y
        {
6 h0 j1 v$ q6 B# g, r                for(i=0;i<length;i++)
$ g' V+ p7 u* z/ N                {
2 ]+ X2 t5 E+ H. @) e+ ]( S                        theArray = val;
, Y! K/ \& k2 ~$ a" Y- D6 m                }  b% Q: I- q5 ~9 c3 h. d* R, w( v8 O
        }/ x$ C! Q" _% e% g* Q
        bgR = '0000' + fadeOutColour.substring(1,3)! o' i0 W5 J" l  s
        bgG = '0000' + fadeOutColour.substring(3,5); y: u! N+ g# ^) S6 B
        bgB = '0000' + fadeOutColour.substring(5,7); G9 ]6 }; e3 e+ I8 P* H& A5 S
        currR = new Array(numLinks);
( Q& Q, L- G4 P; q        currG = new Array(numLinks);
+ W  C( g9 r  R  i& g        currB = new Array(numLinks);# S  e: N, P7 @$ q6 @
        count = new Array(numLinks);8 F" v8 \' g$ y' {8 t- M3 A8 d, c
        fadeOut = new Array(numLinks);
3 A3 V4 E3 x0 I$ O" A        continuous = new Array(numLinks);  N1 d3 P8 a. j* n
        newColour = new Array(numLinks);* A2 J. T; n4 C6 d8 E: L* X& z
        tID = new Array(numLinks);2 v4 \# E8 P7 e# `! e9 i4 U
        redInterval = toDecimal(bgR) / numFadeLevels;# c4 P$ p& O# O; ~+ p0 l/ q0 `; K
        greenInterval = toDecimal(bgG) / numFadeLevels;- ^3 Y7 u, W* y6 C5 ^0 _2 a7 ]) c
        blueInterval = toDecimal(bgB) / numFadeLevels;
0 M* ^7 n* |3 G% Z        initArray(currR,numLinks,0);8 x+ I# `8 q" ^; S
        initArray(currG,numLinks,0);* y* e( K) u; E8 v* p, i1 x
        initArray(currB,numLinks,0);  U/ l$ Y! x' }" u" B. \7 z
        initArray(count,numLinks,0);1 L: a  A# i! d0 u4 i) I
        initArray(fadeOut,numLinks,true);
3 ?* I+ G, b4 \; ^( a! \        initArray(continuous,numLinks,true);
7 ?8 _+ E% X" n6 S3 F) r2 ^}       
8 G4 P& ~+ m4 V' R$ c; ufunction startFade(id)5 E) m, ?6 D' p2 a
{
& y& B9 M. P0 |0 P+ R8 P        if(fadeOut[id] == true)3 I* n7 I# ?# z3 t
        { /*move colour towards background colour (increment)*/
+ a1 _( ]$ ?# K4 I. y                currR[id] += redInterval;
) ]$ s% J6 X$ g& F# j5 x1 h; W5 a                currG[id] += greenInterval;
4 K0 p; a, d  U5 `/ l                currB[id] += blueInterval;
7 v9 O; Y& q7 e6 O                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
% D- A1 Q* }( E* H( e# c& P4 i                if(++count[id] == numFadeLevels)
/ D+ E, x" o/ i                {
' t$ B4 T9 Z. A, h& I                        fadeOut[id] = false;
, r: ^3 |( `" \                }4 M' ^9 V# D; `: p% A
        }
1 C8 t- Q8 g/ o$ e# V5 |- {        else
. q! |  n# l1 n1 P. n' T; d7 u8 ], Z        {% k" E* L/ a2 p  a4 n1 h! M
                currR[id] -= redInterval;  |1 |( h' B$ p6 d( t/ D. M

7 [! J" n3 T: \9 y                currG[id] -= greenInterval;6 s) Q; k# }6 U, s& J7 J1 j

" a  z4 `( D- a, H! e                currB[id] -= blueInterval;
: e! j$ i( d) g/ t( ~: Z, W! }3 C. Y' |& T5 n
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);! z# \( f  A% a) L' {$ J( G) ~7 a9 N" O5 K
  j# c0 i3 j9 \. A- Q
                if(--count[id] == 0)
# M+ R& ~  c, b: {8 p; m
, T# f+ q# H5 R$ x2 q1 t0 @                {
0 X1 O8 Z/ E3 ]1 u7 O8 r: Q! b: q  h: x/ {
                        fadeOut[id] = true;) f6 W1 I, t' W( B9 J1 a& s& `7 }2 @: Y

/ V/ t2 C0 n  B- H8 _8 P! S" h                }
1 ?/ E1 n8 }( s, o5 A$ W" j- V* J& J5 V# D0 b
        }
" o# g/ U# H& T$ m0 r: M# W1 K) V& N, ~" c
        if(continuous[id] == true)! c# e2 q5 T8 \& _: }  E
3 H( c6 Z& k* _& f6 `' N; [' s5 a
        {# Z5 D* l  M1 y" l. L* O( N

. ]& z+ S- p! g9 z+ L                document.getElementById(id).style.color = newColour[id];               
3 l/ r7 o/ H$ f! s3 Z
  |, [5 P; y: @9 m- L        }, X- H8 V# d, t; R+ ]) h
  s  B) G3 E# _" V- }3 n0 N
        else
4 i; f6 D; m; e+ L! V
  O# y5 ]7 V( Q% A        {
4 @; R1 e5 X' G" ]
- `. [" k) P3 |, T& T                document.getElementById(id).style.color = hoverColour;
! N) n; H9 l/ }; Z( y0 q& k/ `  r. Q/ E3 I- z& n  d1 }
        }; D8 h+ {0 J1 z" Z7 x! c; H6 m

: F) }; N7 M. P4 X. Y        clearTimeout(tID[id]);
% ^( t0 q! ?& G
0 n+ w  ^% h* U% Z        tID[id]=setTimeout('startFade(' + id + ')', rate);
& ]* c* t/ _0 \4 P# }  z3 K9 f
* B, ^6 k$ {' g! }1 x# x}
% W& t) v. B2 b6 d; |. J: b9 s" y/ ?) y" ?; |5 A- S8 @) P
function continueFade(id)% P# D$ l7 I5 J$ U

3 b3 M. f( q. A5 \% s1 V{4 {) p- }3 J% s2 ^" F

# t) g7 ]( N  A1 g        continuous[id] = true;
* u5 h7 {& H( T  J4 G! a; p2 n5 _* J# j
}  {; Y/ ~0 n5 W! o0 L4 k6 o

7 c- ]; @! t, N' j8 f: D% yfunction stopFade(id): Q- U: a+ l8 n! b! y
5 R- g5 d0 ~, `, i
{
$ r& [3 v/ |& I% j5 t, U
% e0 v& m5 o4 h/ A4 U; s/ ]        continuous[id] = false;
+ M7 Y, t; M) d% @. S
+ e! n$ d1 b+ F( N: B5 h. X1 n5 F}
6 W9 h6 s1 F7 f& H7 G# ]
* d( O. U4 p: v0 {function StartTimers()0 r! |( ]) W. e1 ^) Z  F# ^

. E0 Z; ?& y- [! E{        //set up an initial set of timers to start the shimmering effect
# g) I. P4 D0 R0 y1 A" X: e: ^- w: {! `% j3 `$ K1 \
        for(id=0; id<numLinks; id++)! o9 m% ?# f7 G4 F1 j2 o
& B: S: P* ]5 A
        {
5 U0 f! t: W8 n
0 _4 m# S4 y: F+ \                t=setTimeout('startFade(' + id + ')', id*100);( E4 C4 d6 t( {) z0 T

: D% {" f- H  ~! S, `  ]$ G        }/ F' O0 a. Y; c5 Y3 Q0 F. ^

9 L' i. B* Z* d}
6 l  d$ Z5 m$ H( a& b% a  D! j7 q5 o4 K+ p0 |) _
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
2 G+ o2 E4 Z: G& N2 X8 k# p  q, J' q! ~. }$ X, f* h
initLinks('#FF0000', 6, '#FFCC77');
  i% k! A- @% a' `3 L$ x# O3 `; [+ V% V8 \. D4 a# ^/ K0 W
//-->
2 R  W* i: X! Y/ ~8 {2 B9 u0 y+ i
</script>1 }1 q: ^' `: J6 t* N
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元9 F7 Q7 V$ x! x0 \) E" I
</a>+ H# h! I( v: H! a% G
<br>( b5 Q* l/ o* d6 q8 |+ d( {( ^' ]
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>% p* f: i6 d  B% K. M0 c2 T( l
<br>1 W4 ~  j1 s1 t5 ]. k; {
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>, b8 q5 L( m# ]0 `& i
<br>       
1 R5 D0 I0 f; l<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>- t' Z2 ?7 U' V: V  a! U  _: F* T
<br>3 J. y: ]3 U( a% A
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>9 H6 G8 ~# @) ]# U
<br>  j! B- z. {2 b5 ]! V
<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>
* \$ u  w+ Z9 d<script language="javascript" type="text/javascript">4 a% c( P( J) Z6 C  m8 X$ Z+ a
<!--
7 B( q( R; \& i/ x$ fsetTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering) W# @8 h; A' T( ?8 s( E' N) F6 u
//-->
1 w% z8 \- r( |) |: P0 m- k) j</script>