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

zw2004

<script language="javascript" type="text/javascript">: p; |8 J4 ^- \; s' d; @, L
<!--. g9 R1 S, a! ~; J2 A! t7 r: t
// convert a single digit (0 - 16) into hex! h: f* C( W' j: [0 r2 H8 M
function enHex(aDigit)2 |+ v! N3 l0 a# o5 v- X
{' ^5 u; s# W" d/ G0 N) l1 \: ]: f
    return("0123456789ABCDEF".substring(aDigit, aDigit+1))
5 }8 @( r7 Q" C}1 q4 }, \# c' t/ _& N9 X' d
// convert a hex digit into decimal
' p6 J  T7 p; ~( Vfunction deHex(aDigit)( V* ^6 N: F% t$ ?+ B2 q
{. q' B  W4 T. k
    return("0123456789ABCDEF".indexOf(aDigit))
+ C! X6 y; V1 {5 n" O}
; H" X, n1 l& }; T, D. M' x2 d! A: ~+ M1 M0 h0 N- F6 {1 O; |7 @) o
// Convert a 24bit number to hex6 X6 C+ `# g  t  z) O; l) j% O
function toHex(n)
5 b, r; G6 t/ H# l% @, Q3 {{" {* Z: ^, U" w0 }- K+ y) P4 n9 T
    return (enHex((0xf00000 & n) >> 20) +
$ s& K, I: D* D4 ~            enHex((0x0f0000 & n) >> 16) +( U# W( @4 d7 q$ [
            enHex((0x00f000 & n) >> 12) +! F. `* v' a2 ^6 j1 k
            enHex((0x000f00 & n) >>  8) ++ I8 q& q: M% }8 n, {
            enHex((0x0000f0 & n) >>  4) +! t7 J% F8 v0 ~! @
            enHex((0x00000f & n) >>  0))
+ K+ t: @0 u2 Q" `2 x}
% j8 X; Y& v- J8 F$ y0 k% k// Convert a six character hex to decimal
& O. I! _' m+ n% ]2 Dfunction toDecimal(hexNum)
+ z( g+ p. r& B$ V/ f{
* k9 b0 c; y( [/ ^           var tmp = ""+hexNum.toUpperCase()
7 H# A3 }. h# Z5 W) \/ L% f. h    while (tmp.length < 6) tmp = "0"+tmp
4 n/ e7 s* o1 G) }           return ((deHex(tmp.substring(0,1)) << 20) +
4 V6 R: K; Z1 x  e                   (deHex(tmp.substring(1,2)) << 16) + ! G1 Z4 v5 C$ \1 X2 h: ^5 w
            (deHex(tmp.substring(2,3)) << 12) +  u3 Q( Y' Z9 A1 p" t+ \" t
            (deHex(tmp.substring(3,4)) << 8) +
# m' _/ Y- p2 F            (deHex(tmp.substring(4,5)) << 4) +( M, D! }! z, i% A/ l+ `
                   (deHex(tmp.substring(5,6))))
0 K- l# @/ s! m* s}! a" j" P; C$ f1 V
///////////////////Shimmering Links/////////////////////
6 c# B" A& P1 ~2 @9 t//global variables1 A& [7 ^" w: W; H
var hoverColour! P/ X/ N( a+ B6 w: M
var numLinks;
6 m% `% w5 d9 [5 _var rate;, g4 t& e  \# ~5 c7 c6 [
var numFadeLevels;
2 S- Y5 y( n: Z. a6 H) Evar bgR;* H$ ], I6 L: [" L1 _
var bgG;
) N8 x( G8 G- Svar bgB;
; Z' {7 T. F8 n9 Avar currR;
! |8 S6 Y; w* ?# lvar currG;- K+ N  O  n$ a+ y
var currB;
4 T6 y- t) m1 u, Gvar count;
  F% }; }! l% C- g; evar fadeOut;- Y' x8 b/ Y& y* G7 y5 h$ _
var continuous;7 n1 y: c/ n. j7 j% L8 K$ S6 b5 c
var newColour;1 l  }( a) w5 p* \* Y: b% ^7 K
var tID;
( s2 {* p* M. i. Y: `3 h2 H+ \var redInterval;
5 L7 q  q8 `6 n* j, L" lvar greenInterval;- L( ]7 G* m; _9 N0 @; U
var blueInterval;
: ^; j0 M( v( ^  w# _7 S1 U4 g. yfunction initLinks(mouseOverColour, numberOfLinks, fadeOutColour)" `' `8 o' R8 E) R& d
{
9 L  [: d, W. L: a        hoverColour = mouseOverColour;
7 S+ n5 D9 N$ c  w) ]/ h        numLinks = numberOfLinks;
$ W% O- \( |: ~) p( i        rate = 1;7 |, ?  z5 E& W
        numFadeLevels = 30;5 ~. _: u& Z& W/ p; Y; l: `3 T
        function initArray(theArray, length, val)7 W' g1 k2 m) O. {) e0 O
        {
0 ?! y; O4 L0 v" V/ k                for(i=0;i<length;i++)
! x; E. V' s4 N/ R1 Y9 ]# N                {1 ^$ P9 K/ N9 C- t) a+ I3 i  z
                        theArray = val;; [2 ~4 Y# Z: B% z, H
                }5 z/ p& K5 B. T. c' U
        }
! _- B7 r8 O- t        bgR = '0000' + fadeOutColour.substring(1,3)
+ k( g& s0 e6 z7 B        bgG = '0000' + fadeOutColour.substring(3,5); k0 t8 R3 x  y) u- B2 g
        bgB = '0000' + fadeOutColour.substring(5,7)! u0 G6 V8 Y' Y+ f
        currR = new Array(numLinks);
; X4 s! A/ G0 s" ~% W        currG = new Array(numLinks);
" ]& Y; E6 N, C* S$ e& f- `: V. t) }        currB = new Array(numLinks);/ B: k* P1 {1 h8 w  W; [
        count = new Array(numLinks);
( f# K7 V( w+ t( v) T( K5 E        fadeOut = new Array(numLinks);
4 k4 R; l& w" ^        continuous = new Array(numLinks);( y8 j" {0 K5 ?; t- r
        newColour = new Array(numLinks);" t! o; N% W/ \0 u) E* K
        tID = new Array(numLinks);* _: R# ^, J6 |& `) b: l& A0 U) g* W
        redInterval = toDecimal(bgR) / numFadeLevels;
% S" v/ g3 c* a5 s        greenInterval = toDecimal(bgG) / numFadeLevels;
/ r7 v' D; o; A2 J6 F/ {! s" D        blueInterval = toDecimal(bgB) / numFadeLevels;
" G6 g$ Y  Y! y6 ^) J- y        initArray(currR,numLinks,0);
1 A+ I0 H. M, A$ O" r        initArray(currG,numLinks,0);
* |4 h; B/ J+ C* e! Y        initArray(currB,numLinks,0);
# @) Z* Z; p6 ]/ H1 Z        initArray(count,numLinks,0);
( O" ^$ E  h! r        initArray(fadeOut,numLinks,true);  E$ ^; D+ g6 u1 s! j/ S
        initArray(continuous,numLinks,true);1 `* r- G% r6 ?* a3 k0 |* R
}        . u( K6 A  j6 Y% }% a9 \  E) {* b
function startFade(id)
' ?" J  e- g, R, h/ U1 Z8 X* R{
& q& \7 Y+ G  Q- }8 R        if(fadeOut[id] == true)% Y# H5 A" i) B7 k
        { /*move colour towards background colour (increment)*/
( @* W& v4 J% V% k4 `                currR[id] += redInterval;7 T8 u: |8 m# A
                currG[id] += greenInterval;
/ a- w9 ]  B8 G: h7 y% k8 S                currB[id] += blueInterval;
$ ~0 L- ?) L) B! w) y/ N5 Y                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);( |; z( N2 p/ @! H) R2 x
                if(++count[id] == numFadeLevels)5 D% F; r3 Y1 V
                {4 I$ H$ q  r7 D/ @1 U" H
                        fadeOut[id] = false;
2 w. K5 v: [8 z& U( I' Y                }$ G) V; C/ _/ s0 |, K4 _6 @
        }4 k* X5 ?0 a- @+ M! f6 T/ X
        else8 L! s6 g5 R2 k: p  a
        {
9 g- t5 d7 n2 B9 ^; v                currR[id] -= redInterval;
' `& |, D1 s% b8 m
2 T9 e( e/ h  i" Y: s, \                currG[id] -= greenInterval;
8 p3 b$ P8 B4 [. R! P
9 H7 g. D3 h: U5 f9 G5 R                currB[id] -= blueInterval;- J2 o* y! {  J  t* _2 J6 a
' E# ?; p3 F& Z( d7 d% W; W
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
9 H* ?0 S1 s0 j7 d
" o4 N$ e' z/ h, \' d1 L1 w4 ?                if(--count[id] == 0)
5 V/ v6 `$ V6 g9 A# [0 l- ~' T& |7 v" R8 m4 U) n! h$ E5 U3 l
                {, D( T0 c, Y1 A' N
* M, X; {, u1 T. o/ |9 r6 Q
                        fadeOut[id] = true;
' c- a: W5 j) [
6 ]7 u5 i: K# V* w2 I                }
. _7 s" C- v! u
4 r. C5 ~3 M) V        }
! Y4 R" `7 M0 B/ F- |9 ~0 n% C% \. [# @% V) [. }' M' t. d
        if(continuous[id] == true)& i( j# g7 B# J: Z
2 j+ y0 _& \: ]" V# @  ^! N5 I
        {
1 Q/ T% n6 g* [0 ?' ~, C" e  h& A9 d6 e" w
                document.getElementById(id).style.color = newColour[id];                3 N- p" Z, W9 r, H: m: P3 G+ j4 y

$ Z2 Z5 c% T- H5 b7 P* W        }5 l" @/ n2 E8 t; ~

% E, Y2 W+ E" j& p7 k, R3 X        else
# C( q8 Y: m; V9 v
5 k; X9 L# d" i" _        {
- i# X: C: r# [
1 _# t6 z- g5 j                document.getElementById(id).style.color = hoverColour;- `8 S: l' G8 l8 V3 P

5 r+ \. X0 Y0 J+ i/ ]6 ~        }
6 r+ i6 Q5 O4 [3 W  Q. A: ^  @& ]  U1 K. ^) {3 k
        clearTimeout(tID[id]);
( Y& @! D6 S5 n# o& |# i  C+ N$ A; u$ q1 F# x6 B/ U) f
        tID[id]=setTimeout('startFade(' + id + ')', rate);2 [( ]; C8 `/ J3 l' x
" J: B% M) i+ e0 ]
}* d$ ?/ ~+ Q! U
: Q* V- F5 v: Q
function continueFade(id)
7 e4 V* n9 u7 L- P7 K- g" {; F* _" T1 L+ X
{
. t1 C! ?- F* O, m: D$ j' c
' H4 ~$ p/ b  T0 p        continuous[id] = true;
' L2 w  z" ]( \7 w' p, D
2 f. p9 N; R2 |) u! k}
3 g& o; x4 p7 s/ h( y3 ~6 z  `; s# B, r) {3 U7 \
function stopFade(id)
1 N3 m+ C) ~6 }  `  C, C9 C" E5 k% _1 e1 m
{  n2 _# c( J6 D* R. p8 e+ |
6 ~* s! d- v$ J0 R; i2 s  f
        continuous[id] = false;+ |/ _4 o: L9 q
# b- C) i/ J0 q7 ?1 N5 I
}
1 O( I# @; M1 W( E8 {+ v. `% X5 E3 w8 I/ b
function StartTimers()- U" H7 L: j! K+ q3 I9 k1 k

' _! @6 I2 x% t# B6 d{        //set up an initial set of timers to start the shimmering effect
* W$ A, ]$ F* U% U: b4 z& j5 z/ d: g) C$ g. i
        for(id=0; id<numLinks; id++)5 E; p; n& v! P* `  k% s  }, v
, S/ [- j5 D1 F5 Y- [
        {6 {6 G2 P' f0 j0 g! k* f4 V

9 M/ L! h5 I1 E                t=setTimeout('startFade(' + id + ')', id*100);" u, ]% i2 ^% A/ i& ?
& h( ]+ f, K3 {# `- U5 I/ ^
        }  {& b  k+ C: |( |  X
, n: }( s/ l9 C# P
}8 P: q# @# A- x9 o; ]
; z, A) c$ N: n; e0 K5 H9 O
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')& g5 F% I+ Q% L) O
! C" D* V$ }4 z
initLinks('#FF0000', 6, '#FFCC77');
* G# r8 z$ @; A9 u# S
7 _- e: H. O) D3 H0 X9 t//-->& k! }8 i( T( }9 r

/ O1 P5 E# J0 a6 n9 R. u" S</script>: `; i0 |9 v) D
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元% k& D" V1 e  T4 s
</a>
3 F9 Z6 P9 |2 \3 V9 \<br># Z2 j/ j5 k/ J7 b  i: g
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>
/ z7 M- V* @# }0 Q$ S7 \* y& i2 }<br>' W7 k: Z1 K" ^
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>5 y# \* _* v, t
<br>        5 P" X* g( c% i  k! w
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
3 q  [- s. h+ |<br>( L( @- T+ y5 h# X
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
: w! K- j+ f; l/ R<br>+ y6 H5 E% J/ D& `( H
<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>6 O4 Y5 ?2 e2 `" o5 o
<script language="javascript" type="text/javascript">
5 R' u1 B3 k+ \; y6 c<!--1 T8 h/ _! m; \2 e! I9 v
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
7 ~/ a4 n" \: c: K4 u4 M" @//-->8 e: i* T3 ?7 p( P7 g6 v
</script>