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

zw2004

<script language="javascript" type="text/javascript">* f- J8 O+ O3 T  k# q1 I
<!--5 M& g3 l7 i( [
// convert a single digit (0 - 16) into hex( C5 j/ D9 y+ [% K. l# v
function enHex(aDigit)
5 ?/ h! o8 k% [' X# @3 Q: ~{( O: p% Y5 s1 t/ P
    return("0123456789ABCDEF".substring(aDigit, aDigit+1))
0 R) M6 d. x% n: ^- _+ M" R! N: j! {1 f}
' H1 i$ \8 P) U: X* {  L% X// convert a hex digit into decimal' l% c. d! \0 V3 W0 A
function deHex(aDigit)0 f% N  W; Q- D2 `9 d; z
{
/ Z; \1 J6 W/ c) g4 p. l9 Q# A  m! L    return("0123456789ABCDEF".indexOf(aDigit))
0 y) D3 N5 E; a% B4 K8 ?! o}
/ N0 t! A4 L8 G% W, ~
+ L! b& {1 s7 R; V" U// Convert a 24bit number to hex
6 \/ u& V* N% F5 b  S" rfunction toHex(n)
  v: ?2 y7 u7 ]# Y  p{
0 d2 o! A+ E& S& g0 j9 ^    return (enHex((0xf00000 & n) >> 20) +
9 h4 {1 p5 f$ N% _- o            enHex((0x0f0000 & n) >> 16) +
7 H* d# f7 a, Z            enHex((0x00f000 & n) >> 12) +5 w" c( u: H2 b/ ^
            enHex((0x000f00 & n) >>  8) +
% x% a+ a1 q/ I            enHex((0x0000f0 & n) >>  4) +
8 j- {3 ?" d. B- C8 z* P            enHex((0x00000f & n) >>  0))
4 n% E. m3 Z% I2 ?/ t, o}
! W" ?% q/ ?+ w& e# e// Convert a six character hex to decimal& p$ r0 O- Q. O  {! V) T/ v8 e
function toDecimal(hexNum)
# a/ K1 z- V+ `7 [* E" V{9 F7 w$ L- ~: K1 A6 K: f# {: V
           var tmp = ""+hexNum.toUpperCase()/ z' Y; o9 p2 z7 ^0 p
    while (tmp.length < 6) tmp = "0"+tmp5 }" B0 }1 F$ o' W, |5 A1 s
           return ((deHex(tmp.substring(0,1)) << 20) +
+ }* z; Q. o4 a: I; B# t" n) I                   (deHex(tmp.substring(1,2)) << 16) +
3 e; ?% e* n" e% P            (deHex(tmp.substring(2,3)) << 12) +
5 g$ e0 a! N9 d) d5 J            (deHex(tmp.substring(3,4)) << 8) +# A: M" x/ i. c) b
            (deHex(tmp.substring(4,5)) << 4) +
6 @! J, c- u. T1 D3 F                   (deHex(tmp.substring(5,6))))
6 I( N0 `( ^3 v: @5 B! U}8 {9 P  C+ w/ F/ [0 E* W
///////////////////Shimmering Links/////////////////////
% g2 J) u5 c, U; ^$ t//global variables' X) x; S# R% a# s5 o5 t: k* M. x
var hoverColour
& s* P) W% j1 Z5 E' k) dvar numLinks;
" I4 _6 w- G1 h; _var rate;; w- S! B0 |# ]. {" [
var numFadeLevels;; x' Z. ^+ C1 |" E/ P) V- j, R
var bgR;
6 [3 h) y6 R6 G9 _9 Q/ Xvar bgG;& o/ f: T/ J3 {; \; O1 q6 S' J  A
var bgB;
# W0 t- z  M) U* N' evar currR;+ ]; y  M$ B+ \+ r; F
var currG;( [& h, d: I) R4 j/ n
var currB;
# I5 B4 Z; o$ k8 J  F" Zvar count;, U$ c" q6 ]( l( F. f) k/ w: T- ^
var fadeOut;
$ N1 [0 U' k3 v+ ?. ]var continuous;1 e# M3 n* R& @. x+ o
var newColour;
- Y- R; I5 w# n( l% @0 [! q! mvar tID;
0 b9 e% O+ \/ Q8 M' A% Rvar redInterval;
0 d7 [7 ^0 w, F! N0 j! s; cvar greenInterval;
" L" G5 p9 G7 |var blueInterval;+ T3 I3 Q/ x2 ^0 W
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
6 V' `2 ^4 }% c9 }( X1 v! J{
4 |& B; }5 _: s- o        hoverColour = mouseOverColour;
9 q$ E5 p4 s3 v' Z        numLinks = numberOfLinks;
) R1 \4 [4 l# D0 i& A        rate = 1;3 Q! f5 Y9 a! q5 s
        numFadeLevels = 30;
( b3 }. Q; P8 O) X8 x        function initArray(theArray, length, val)* |5 B) B: y  p8 ~" s
        {
) W8 V" t$ I/ l) g: E                for(i=0;i<length;i++)6 i# ^% [& x8 c
                {
/ d7 {1 Q7 }  o# V& E0 U                        theArray = val;
: \% b' `8 x3 }% g: r                }6 w$ s! I9 A7 _4 c7 U# b0 `
        }$ E) ?5 e8 D! z
        bgR = '0000' + fadeOutColour.substring(1,3)7 d' d7 I. w# p  j
        bgG = '0000' + fadeOutColour.substring(3,5)2 H( P+ i5 ~6 C1 l3 o! D' ]
        bgB = '0000' + fadeOutColour.substring(5,7)
" b: }, v9 x0 C4 R3 I+ E% m        currR = new Array(numLinks);
' _  T; s5 p5 i1 n        currG = new Array(numLinks);; {2 N5 }3 E% e( D( t) y$ b) U
        currB = new Array(numLinks);! x0 F7 x6 ^: G; N* X
        count = new Array(numLinks);
, f- U4 _- Q2 Y2 Q' f) v( l        fadeOut = new Array(numLinks);% @0 X3 Q4 a7 {) h4 f
        continuous = new Array(numLinks);
, ?" |: B5 T+ z/ K0 T, \! ?* `, u        newColour = new Array(numLinks);0 i, R) _6 t/ u; [
        tID = new Array(numLinks);
9 V/ R! V# y0 w7 g0 V+ p) ~        redInterval = toDecimal(bgR) / numFadeLevels;% l) P2 }  ~! s5 `' K
        greenInterval = toDecimal(bgG) / numFadeLevels;
5 o/ ~$ j) n8 _6 A3 `& f        blueInterval = toDecimal(bgB) / numFadeLevels;0 a" N# Y% o1 N
        initArray(currR,numLinks,0);
% \, d) j2 ^9 F) T% ~6 `" z        initArray(currG,numLinks,0);
8 a; b% E8 Y6 \2 z- [1 E" o        initArray(currB,numLinks,0);2 C: Y4 I. L3 U8 x( |
        initArray(count,numLinks,0);* ~9 ^4 B$ F1 _; `
        initArray(fadeOut,numLinks,true);
% e& ]7 s# z7 `6 K9 W; m2 I4 w* v        initArray(continuous,numLinks,true);
6 O0 }. {: s7 R/ P0 z}        2 ]/ J: t3 l5 n4 W0 S
function startFade(id)# g6 `2 h% I0 [$ k
{
1 |9 G8 s  Y2 I; }1 L        if(fadeOut[id] == true)3 P) K1 d' U! F1 G, E4 W
        { /*move colour towards background colour (increment)*/6 E# J* e" b, z1 j
                currR[id] += redInterval;
; W2 \% D$ I$ m4 q8 d7 g                currG[id] += greenInterval;
* A2 e9 ]5 Y( q  T% N0 e                currB[id] += blueInterval;) _1 ~. r; s  w) |! V) a0 W
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);8 s! i5 b3 d' \; A% e: t! p
                if(++count[id] == numFadeLevels): G6 d, y9 h% h, e. z0 W1 ^9 F
                {. _5 p, k. H8 U, n9 W, |
                        fadeOut[id] = false;
$ g( F& j( z  u( m) E                }
) O, |( C3 A4 g        }9 x& a; F) s. r, e7 j7 h
        else( T: m6 ]5 I% Z- h- l) E
        {5 j* `/ n" q! |
                currR[id] -= redInterval;
7 E; y" W+ ?/ i1 U) R
/ G  t: e+ N7 e+ U                currG[id] -= greenInterval;
& O: p+ f( c6 i' }; s
3 F! G9 ]  i5 M( N3 ^) R0 g                currB[id] -= blueInterval;, Q. L. q/ ]0 D+ C

8 I# V+ @7 N  A6 N+ ?% ~                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);  k' i# A8 ^0 r( p

7 f& F9 H, G' s  Z; c: f4 U                if(--count[id] == 0)6 n1 I/ i* X; i4 g# @
7 U( _! ^3 o9 T) m  j! j2 c2 ]
                {
* H' b# b0 u0 m! L; w  s2 _: i, H4 S
                        fadeOut[id] = true;
8 J: x+ t3 R. d: O, X
% K) _/ A. i, [/ h, d                }
" n, K/ U6 v% d( O& l* y
1 D( H+ A  q- Y& u4 Y: q9 D1 d% }        }
9 j) m, y7 E8 d, R7 O
$ B) O$ I/ l8 v/ ~( l2 N8 n, d        if(continuous[id] == true)
3 K( x1 u6 b) d' _
# p6 x3 o8 V% P6 S        {0 N% |% S8 A7 ^2 `( F, {9 z

6 F5 q/ C; d$ O# C2 m" W% ^) @                document.getElementById(id).style.color = newColour[id];               
/ F5 Q2 E4 x- b/ }: R7 `$ k  F! ~" y6 a: @4 H( l6 |
        }
; z6 \5 K+ U/ c# G) V' A! D7 p2 `) {
        else
( }4 h' `6 h. K) C! b1 u
* t) x! {) T) B4 `1 L" H3 E- F        {
- Y( h" }* g* \4 q1 c
# D$ ?) |- c9 {                document.getElementById(id).style.color = hoverColour;
+ A9 }' K9 s6 L' M, b* c& z
% Z- Z1 {5 y8 ^; O* _        }2 D2 E" ?: c* I* C. v
! y' z! E6 {* {* ?4 x
        clearTimeout(tID[id]);# A* }" F$ C' S2 G5 v: z( Y
& `  r" F, j3 s  m" Y
        tID[id]=setTimeout('startFade(' + id + ')', rate);
6 |. r: x( o, H1 J, _  ]7 H' t6 U7 u  o4 s
}) }# _+ D/ V% B  q/ l. X
. W2 ~, U+ ?5 [
function continueFade(id)  J% i( E( T/ B& Z, V
2 [9 @4 m4 W) l1 H
{
- w( n8 M9 ?# e7 x% d3 ^
$ i! g. D$ W. S# t. |7 Q/ M        continuous[id] = true;# j$ I# W9 D8 a& i
3 M9 W+ h7 Z% W4 O; G/ n
}
9 `- X+ ?* l' L* S+ p) P2 D7 ^" Y) v5 U& _5 G' k# `
function stopFade(id)
1 y: o8 `/ i# }. `$ z9 a* n# _
& d% R' \3 |5 d( ^{0 W5 F3 |6 Q( C- Z6 [' |3 a
5 d5 A$ O# U5 [. O% d5 l) v( M7 N) _
        continuous[id] = false;
5 a+ I9 f, e  y7 @* X, B1 C0 ^
, B( G, S' ]1 Y; G}8 }+ _6 J, I9 H0 P& K' @2 m

) E) O7 I3 s5 W1 p9 d2 A. s; I6 Q  [function StartTimers()% ~5 g6 J0 `* Z

% s7 q, {7 R& l; s3 ~# X; H{        //set up an initial set of timers to start the shimmering effect; s) h+ a& q. T& H! R5 P3 h
2 V' f: E1 {% b8 s, v3 @
        for(id=0; id<numLinks; id++)
2 `/ f5 H  l% E0 Y& u% L' A7 I% l
        {
3 d6 j4 i% v/ o7 e
( L$ d5 \$ V& ?) U                t=setTimeout('startFade(' + id + ')', id*100);4 I( I0 L( }% G3 |$ h0 x0 W

1 J7 l: U  S. F        }$ J7 z! a1 k  [4 n" O4 W) d- ~

1 n( }/ Y/ P0 ]}
4 B  L0 o8 |0 u7 ]* ^
, y  `. l; O' i0 z6 T//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')# _7 _$ d" u6 K2 {" w9 z4 X

$ Q0 j, f9 c: ~) @0 WinitLinks('#FF0000', 6, '#FFCC77');9 [0 f" x0 S" S7 |
- K$ |5 v3 `( X
//-->
4 n, O5 G% s4 S! X8 m/ w7 k) s  w9 M6 _# A" Y6 K
</script>
: R. a' A, ~7 l+ u3 B* G4 U/ n2 L<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元+ j5 o  ^. B5 A% e- g
</a>
) |' R6 w) P5 {8 \8 ~+ O% V$ [<br>" C! B; r* Y( F* P# u" E
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>3 W, B1 R: o9 Y1 N
<br>
2 ^% d' N- L: }* a  p1 q3 a8 C& S<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
2 U' k; {% K% Y* d# R+ B" A<br>          h& d" ?; S9 U! a$ W) s
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
/ _2 Q" l! z2 L- u+ f* m: ^' p<br>% v+ \0 C1 Q9 [" n
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
( L$ `: q4 G5 {& ]* m* p<br>, E7 W) E  j( @: j
<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>2 q1 M# }# J' S7 J$ i, M' |7 H- m3 X, N
<script language="javascript" type="text/javascript">
& I. m" G7 B; \! {3 y% ~<!--
. D- Y: i6 n2 qsetTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering# e* ^; Y* c. {5 P& a
//-->
9 R; w/ l( ?( I</script>