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

zw2004

<script language="javascript" type="text/javascript">
1 P2 X6 x9 ^+ S1 H2 H<!--
1 e# Z% k# b" f3 w+ d1 j// convert a single digit (0 - 16) into hex
5 B* a: ~) X0 ~1 E7 ifunction enHex(aDigit)
2 ], N" N% J0 h1 F{2 }; z- c& h' ]9 ?5 o
    return("0123456789ABCDEF".substring(aDigit, aDigit+1))
. W! M& h# z! J) y! M1 s}( @  Y- w! g& j- U3 k% E, _
// convert a hex digit into decimal
1 b# i2 G/ r$ m; d) {) Lfunction deHex(aDigit)
0 n4 y% N  A( N1 D{$ K# U- Q4 h2 E! o% N% T3 ?! a  C
    return("0123456789ABCDEF".indexOf(aDigit))
, Y) q' [( {- H4 b& a5 y}1 {; v1 X0 b5 l9 V
- K' k6 V6 S: B  e) F  p  @0 l* p
// Convert a 24bit number to hex
! I$ C' a, }; W0 a5 [+ Jfunction toHex(n)
+ ?4 Z! g* M% V# {6 e7 v4 k{, t. N+ A$ C. P% |  O7 a2 }# Q
    return (enHex((0xf00000 & n) >> 20) +
# {. U: q/ q2 G& j( m5 K( \            enHex((0x0f0000 & n) >> 16) +
5 c) a8 l& A3 B# f1 v            enHex((0x00f000 & n) >> 12) ++ c3 s- `7 q$ c& D4 [
            enHex((0x000f00 & n) >>  8) +
4 D3 b, S" t9 l8 X3 k4 j            enHex((0x0000f0 & n) >>  4) +
* k' Q5 P4 Q3 B2 z& y            enHex((0x00000f & n) >>  0)), m/ s) @' E/ {/ q: h4 E
}" @4 N  z# j- \  l9 Q/ B6 P
// Convert a six character hex to decimal! y: C+ o0 t( t. W7 R- _4 i6 y8 x2 {( s
function toDecimal(hexNum)& a6 S# H( d2 R( W& ?
{
4 y6 l( S3 r6 j           var tmp = ""+hexNum.toUpperCase()
" x5 C3 T7 A. X    while (tmp.length < 6) tmp = "0"+tmp
* w+ P' e) Z- b7 V           return ((deHex(tmp.substring(0,1)) << 20) +' C1 _- N9 A; Q5 q. H+ P: B- k9 m
                   (deHex(tmp.substring(1,2)) << 16) +
5 A" {# _% |8 m( N            (deHex(tmp.substring(2,3)) << 12) +( \6 w! }5 r# _5 a/ U) x& L- u0 B9 S
            (deHex(tmp.substring(3,4)) << 8) +8 e* e  m7 L/ I% L- [
            (deHex(tmp.substring(4,5)) << 4) +
( b  P7 t! n4 k! v                   (deHex(tmp.substring(5,6))))- D% ^+ {$ {0 U" C7 g
}7 \4 s5 C9 n: u' S
///////////////////Shimmering Links/////////////////////: E  R& ~7 e" E8 V
//global variables+ D( @" u% s8 P6 Y
var hoverColour
' P( ^$ Y: T( Q' ^, Fvar numLinks;! r0 j& V  |: z; R* z
var rate;* d1 T) i9 j$ r) O4 P  H* J
var numFadeLevels;! J5 N- @# u$ y' |3 W
var bgR;% v0 P  O% K$ A3 C1 o, X/ _
var bgG;, A1 _! k* l1 ]
var bgB;
. D- i! J. D' cvar currR;+ ?- O, l! J# Y& s7 K
var currG;
: m7 q$ A7 S9 Y; |  L' D) {var currB;
/ ?. K8 i5 U( f1 ivar count;; b) N! g- `- D" i3 u/ F" q
var fadeOut;
% {5 o8 ~7 ?( n: Q* h. vvar continuous;
0 K( w2 O4 v! d" jvar newColour;
( c2 j! a) r( M/ }var tID;
% l3 b) x" o7 ~- S$ @var redInterval;* ]* H2 o4 `2 N
var greenInterval;
0 Z0 @0 |7 n# Z: |3 z: y! x+ Cvar blueInterval;
. [5 @; u. L7 Sfunction initLinks(mouseOverColour, numberOfLinks, fadeOutColour)( k  _/ m& A- s2 y7 _: U% k
{
5 ~1 Z/ C% q$ _7 {+ G2 i4 L  T        hoverColour = mouseOverColour;
0 B: X4 C- b1 j% n+ M: G* H        numLinks = numberOfLinks;
  b* r1 U* P& P        rate = 1;
4 r" T' x( W# {6 g) l  t2 w1 M+ R        numFadeLevels = 30;
" A+ N: ], K! U6 O4 J8 n+ y- `        function initArray(theArray, length, val)- _+ m2 C6 K; ^
        {+ `! e3 ?. N, c/ O7 g" ?
                for(i=0;i<length;i++). n5 k  `; }6 h% k( b) h. T3 @
                {
7 w) J! R( t% k, O1 f/ m                        theArray = val;5 O8 c# C, ^2 d3 I* m9 n
                }
+ S' X1 L; N2 {" u$ B4 P7 [8 N        }4 A+ k0 M! U  m: B4 q+ ^, z$ z
        bgR = '0000' + fadeOutColour.substring(1,3)0 v- v3 }5 ^% u# a
        bgG = '0000' + fadeOutColour.substring(3,5)
0 \, U* Z4 O# y) K5 X. H9 y        bgB = '0000' + fadeOutColour.substring(5,7)9 Z3 M' \* y& h
        currR = new Array(numLinks);
1 g6 j4 @2 B5 [# g! E. y. h$ f        currG = new Array(numLinks);
' m& F* s+ o) i5 J( X5 S% \        currB = new Array(numLinks);; p4 J1 _/ t  S( p: ?. [0 d
        count = new Array(numLinks);
! s% V# M- e4 ?7 g        fadeOut = new Array(numLinks);
* w$ h# I  A$ z7 E1 y6 ~) y        continuous = new Array(numLinks);
  K/ K0 L6 U, |2 b4 s4 t0 T        newColour = new Array(numLinks);
& g& f* z; E$ Z- L3 H        tID = new Array(numLinks);0 ]" Q. ]3 v( ~; i! R5 I! a
        redInterval = toDecimal(bgR) / numFadeLevels;( y( ]& f5 K" B. i) J* k% _
        greenInterval = toDecimal(bgG) / numFadeLevels;
& i( c* `1 ~* m+ a4 t  D4 h        blueInterval = toDecimal(bgB) / numFadeLevels;3 W' ~+ t5 J% C& z
        initArray(currR,numLinks,0);/ d9 f) b3 K6 D& n! T
        initArray(currG,numLinks,0);! \, L0 J% C; S1 F1 ]( X$ D
        initArray(currB,numLinks,0);
6 \& R5 p$ Q. F2 S: I        initArray(count,numLinks,0);
& e; B6 _/ I  f% C0 j3 G3 O% Q        initArray(fadeOut,numLinks,true);
; j3 p4 S" W( t2 z  i        initArray(continuous,numLinks,true);0 q, ?  a/ o( |8 ^$ W4 U
}       
6 q% e% J# y9 s$ S* u" b  J: hfunction startFade(id)4 c+ Q1 S( Z6 q8 M' L/ o
{
) ^* T- g' {; A* n" q+ O        if(fadeOut[id] == true)9 ?; A/ ^% R" i' a% T" W5 S
        { /*move colour towards background colour (increment)*/- m: p3 Z- E& G$ [! j
                currR[id] += redInterval;
' K, T* r/ U! W2 e, ]                currG[id] += greenInterval;, j* ^% `/ Z- \$ e9 P
                currB[id] += blueInterval;
9 ]+ g4 y- a5 Y5 n$ F                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
+ N# o8 L" W# L$ s/ e/ c; d7 z/ v                if(++count[id] == numFadeLevels)
$ d4 ~; a0 h0 x9 ^- e                {
. Y, z4 p- e- O7 p                        fadeOut[id] = false;& L; a% W: V9 ^' X- j& j  Y8 B
                }9 F% W1 `+ f5 [, F
        }
/ c- P  w2 R3 ~  b% x0 A3 E        else
; S) V0 Q& D5 W4 Y+ M; d4 s& i        {; M7 g* e0 d9 j2 f
                currR[id] -= redInterval;8 d6 `+ `% w# {
, x6 W( g  f5 c/ P! M
                currG[id] -= greenInterval;, R9 \6 G' [+ y' J  f7 V% p" m# v

+ Z6 l+ s+ V) c* N+ \                currB[id] -= blueInterval;
# ]  o9 T( W. T+ K
4 V! @0 e! J1 d3 I  W6 l. f* n                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
5 g9 D2 s4 d  [: r. f& t' i0 D6 g. D1 z0 n% \
                if(--count[id] == 0)+ z' i/ C3 q. W/ ]

* S& `0 I; |' [* w; [% `                {
$ g$ e% ]  S; }! ~# O5 l; V# l' I4 u* V
                        fadeOut[id] = true;
8 Z! g3 [2 q% Y( v- I: K# f* M& k7 v6 u5 T3 g# b6 _& N  B
                }* W7 ?9 }; G+ S0 j

  T0 s3 C; `5 u( l5 P7 {        }
! e. Q4 h3 D' c, X
9 I9 C9 A1 L7 q        if(continuous[id] == true)3 U) o0 a1 W8 Z7 p" c
1 a/ X, L) ]4 I7 g8 }, V. f( v
        {8 t# H* x2 x# ?

7 a1 X% |2 {0 _                document.getElementById(id).style.color = newColour[id];                : y* s% z" A# _  Z* L" t
% h+ u2 y: D* K( o  k2 k
        }
  K! c' z4 m( d+ S/ D  F5 Y2 f4 k; |6 L
        else6 Z' ^1 O% l( d& y. z
; g! f% x' C, t0 ^
        {7 s! m5 @  N( [9 N

, P( O6 t! H- u9 a2 Q                document.getElementById(id).style.color = hoverColour;8 f, [3 `# O% L  u9 y8 k! n/ J& y
1 L. J6 n9 G# b' ?
        }( t9 J" I3 ~! J+ K

6 g  w8 p9 P0 \) @        clearTimeout(tID[id]);- }1 a/ i- Q% ~# e

. X2 t3 j( m6 F2 f8 A. N$ J7 v. a        tID[id]=setTimeout('startFade(' + id + ')', rate);0 n: f. ?" P- r1 v

5 a. c" M! e/ [  T9 |: L}# I, J/ {% M# X, g, `. @3 p2 T

. B0 U2 ]+ `8 w( c* G# w( _' ufunction continueFade(id)
( L3 a7 E* ]* H: |
  H, [) e4 ?# F4 n) A7 k, X{( O* Q& ^# K% Z7 x* T
: t( a) j, g# r. k+ P( @
        continuous[id] = true;  H; c/ @1 |! S

/ a2 f( {8 m+ q' W}8 A. J. u8 j( |8 h6 C6 \8 u
! X: c3 {; w, Q3 R: H7 L& L
function stopFade(id). m( A# F3 K  y  H9 Y# J

: y6 K2 K5 ?% X  P{
. m1 X- D: [) K$ g
3 \+ k  B; I8 w. }4 c4 A        continuous[id] = false;% v# r( x" @0 }' D7 c$ j

( M5 ]' b/ {; \4 E9 b1 O6 S- H}
* C  K; U& @) S; [# q: f& E. b2 ^. D7 D  m
function StartTimers()6 k+ s1 l' [) m. C
# _& _: V, f- w
{        //set up an initial set of timers to start the shimmering effect  W9 m. a" n- F5 o

1 F  s7 \& @. i        for(id=0; id<numLinks; id++)1 h$ m, B4 r9 p. {6 S  y) p/ T

1 K: u, R# j9 x: e; M1 r1 _        {
4 I' c6 D  z4 q8 m- X; \/ U& d# Z' m7 {) L# t0 |1 d- y* L
                t=setTimeout('startFade(' + id + ')', id*100);' K4 _# m, a9 q, f$ \/ C
+ m# N' L! ]3 e. }. G
        }
+ H: E8 ?& \8 _$ K" z. p# Y
2 z& a, A' r. s8 `2 O  l3 y8 u}( T5 a& [0 E5 N

$ k/ u- d; Q2 r, x0 A//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')$ d1 [; @: ?5 l% x0 g

/ L% Q: |) [( w7 AinitLinks('#FF0000', 6, '#FFCC77');9 S2 f( j# s, h/ @8 ^" @) L" s
. z( g- W2 C8 u# r% V5 r
//-->
! y3 v: g' Q& [, E8 G- }: x6 o$ |, o2 p* W
</script>/ ?3 n3 g0 S9 G9 p
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元
! m6 S# D; r8 o& i, j$ B0 q7 c</a>3 X2 P* B* Q9 Z* |
<br>
; A& e+ V6 Q0 z& J<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>% \# |* F# n' v0 s( M
<br>
, B2 P% |. Q( |' j) k' D8 N<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>2 Z3 y5 K7 [1 q( R
<br>       
: }& [/ u! x, ]/ d<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
0 h! O" w, ]. b* B9 ]7 e& L9 a<br>
% K" ^9 N3 _% j8 v; e. L<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>/ u& r; O4 ^7 E9 Q# W
<br>" J3 k; C  t2 Q6 p# @: _" j! P
<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>
" z! y, r$ T+ j<script language="javascript" type="text/javascript">( w) ~; w: g- ~' v/ d( L3 [
<!--8 J1 N( c' O/ [
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
4 Q  U3 r) I1 g7 O//-->
2 h- P: E# E5 i$ y</script>