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

zw2004

<script language="javascript" type="text/javascript">; g: _2 A. t) d: Y& z: z
<!--
. V: V" p5 e1 ~% J9 f" `5 x// convert a single digit (0 - 16) into hex
) Y: k* q! ^2 s, ]6 K9 h! nfunction enHex(aDigit)
7 o4 }3 l/ r9 I7 @; H3 [{. E% e9 E6 l+ a1 q, v4 S, u
    return("0123456789ABCDEF".substring(aDigit, aDigit+1))
5 z. C9 m# q3 g3 z6 }}
6 ]! l1 u7 @" B$ @! b( M& R; L// convert a hex digit into decimal5 V0 s% ~! A1 ~9 Y4 d8 K# v% ]
function deHex(aDigit)
  P$ w# O" G/ t1 Q1 N. p{
( r. w7 H3 \9 W% f9 Y2 K! f8 Z5 Y    return("0123456789ABCDEF".indexOf(aDigit))
4 r9 n" J( T  s9 _4 B+ E) Q}3 j& k9 g# Y" a; P9 l3 X; |  a2 H4 g7 I

5 `' Z: W* h; D; b, u' q8 r/ K// Convert a 24bit number to hex, K7 v) C/ l# H' d) v/ r& y; r
function toHex(n)! e( M+ c' O) a% h
{
1 d9 E: L  |3 U+ y1 [' u! i. A6 G    return (enHex((0xf00000 & n) >> 20) +
. E4 l) W3 S$ n3 [3 ]& d            enHex((0x0f0000 & n) >> 16) +1 [( P! O, s, |7 G7 c6 E
            enHex((0x00f000 & n) >> 12) +% [! \! a( q5 N. |
            enHex((0x000f00 & n) >>  8) +9 [+ }5 V- q! U9 ?5 q/ P
            enHex((0x0000f0 & n) >>  4) ++ T4 z8 N2 X$ D/ b, X5 |/ }# A
            enHex((0x00000f & n) >>  0)). ?1 o$ J; R& H  h; Q9 `3 n
}* V5 Y7 U* C0 a7 W
// Convert a six character hex to decimal  h# q3 d$ [$ x2 n/ L
function toDecimal(hexNum)3 t, \/ F7 ]1 o/ p0 y+ o% v
{
2 Y) `. H4 g0 a6 h           var tmp = ""+hexNum.toUpperCase()
8 }) R; X7 N! ?- I; A% T5 `    while (tmp.length < 6) tmp = "0"+tmp0 B0 I* T: d0 U6 b
           return ((deHex(tmp.substring(0,1)) << 20) +% Z8 K* j( j3 b6 F% I
                   (deHex(tmp.substring(1,2)) << 16) +
( B. H1 g) }& H            (deHex(tmp.substring(2,3)) << 12) +" m6 o  `3 q' ?8 K) Y. B
            (deHex(tmp.substring(3,4)) << 8) +
4 V9 r& C  S- e, [4 l  r            (deHex(tmp.substring(4,5)) << 4) +2 u5 S  C; X% N3 K2 x
                   (deHex(tmp.substring(5,6))))( q& h' V" U2 J( c1 h
}" U! L9 @4 ?' z! p9 H& g' D
///////////////////Shimmering Links/////////////////////
2 B+ x/ t8 O# D% {9 o//global variables, Q2 g; {5 i& L
var hoverColour
  V/ K" |" f- q* I: `) m4 Hvar numLinks;
2 Y* X, `9 ]. z* p) Gvar rate;- ~4 H2 X7 Z# A: T, H. x' a) q
var numFadeLevels;1 _1 E2 O* l7 y$ N# a; D2 I
var bgR;6 ]4 R& w% Q- {, V
var bgG;& s& u0 ~) [3 U, G" A
var bgB;
' b# V, W+ P2 e6 ?$ @var currR;
( k+ Q% m5 G, @var currG;
, j- R$ v1 B% `1 ~' u) S. e& Fvar currB;
1 q# h4 x+ m6 r  i2 a+ k/ P4 kvar count;
* ?8 r, M/ M. O3 nvar fadeOut;) e: I& A/ J: `
var continuous;
7 ]6 {) u; `3 T8 Cvar newColour;
% l8 Z5 |" t! I# {: _/ }var tID;9 f) h. C& P8 `$ k* w2 f' @" p
var redInterval;
0 ?+ \5 m6 Q: Y! ]# b$ v- N! wvar greenInterval;
( O3 [; P2 M+ q" D9 K% mvar blueInterval;6 `$ ?. A  y3 `- o3 A
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
/ _6 i" e3 _0 R# o1 P{
, ]& H" Z  [+ g        hoverColour = mouseOverColour;
/ P9 Z* A# l2 l        numLinks = numberOfLinks;
7 H$ E) h. F  {4 Q/ `1 m' |        rate = 1;- Z7 J. C1 [0 F" Y" p) Y% n
        numFadeLevels = 30;
8 x0 [5 E3 }# S! L- ]6 P& |        function initArray(theArray, length, val); x; U. h' R2 O* V" R9 a/ c; b/ ]7 F# t
        {
' b+ i0 B; {* w3 D8 }4 |                for(i=0;i<length;i++)
  j/ ^6 R% m4 l" V                {6 C" A/ `1 [& d8 q! h4 z, g
                        theArray = val;
! H2 I) Q6 N) N" W- G- V: ^                }, E* ]: ^! m: {1 e" ?
        }8 R5 a( p! T! i1 u9 o$ a. L
        bgR = '0000' + fadeOutColour.substring(1,3)
9 e4 q9 ~: o' k# E) }        bgG = '0000' + fadeOutColour.substring(3,5)
" o! E$ V! d. O        bgB = '0000' + fadeOutColour.substring(5,7)# w8 {8 W3 [2 W3 [
        currR = new Array(numLinks);9 ~. i5 @8 V; {( y
        currG = new Array(numLinks);5 h2 j! l0 \1 N9 T* {
        currB = new Array(numLinks);4 M0 K, O  V7 L0 S5 f. ?( |
        count = new Array(numLinks);. Y7 S, Z2 ~: v$ t$ C( W( ]. i
        fadeOut = new Array(numLinks);: z2 Z* Q, u$ Z1 E
        continuous = new Array(numLinks);' b3 Q$ Z, J" w' ?
        newColour = new Array(numLinks);
5 x3 W+ d2 Y5 {, U- D        tID = new Array(numLinks);
7 R/ k. Z. B3 }' K+ r0 d        redInterval = toDecimal(bgR) / numFadeLevels;
/ O4 W7 u, E6 C) U        greenInterval = toDecimal(bgG) / numFadeLevels;# O1 j& A* Y  f9 t9 E
        blueInterval = toDecimal(bgB) / numFadeLevels;
" R% U/ D  l& b% X9 Q        initArray(currR,numLinks,0);6 x' S; w5 A# Q0 @7 Z- K
        initArray(currG,numLinks,0);
- O: M4 A; |& |- s- f        initArray(currB,numLinks,0);& f) {" n$ u$ \! Q# ^0 |
        initArray(count,numLinks,0);( q' ]! m) R4 }; B+ U: l1 z
        initArray(fadeOut,numLinks,true);
7 {$ B) [, i4 s4 ]( k  J4 l* m: v        initArray(continuous,numLinks,true);! T5 n7 M! a' f! n) y  C% A
}       
+ q3 A9 i& F6 {8 D  k7 ]! p' Afunction startFade(id)
# L) m" O, `$ d9 K$ ?{- [% v5 }5 g5 d  B8 n1 V' U
        if(fadeOut[id] == true)
4 _1 |) y0 Q# q) C/ x        { /*move colour towards background colour (increment)*/3 D* z/ I) M! Q7 u: z  z8 m
                currR[id] += redInterval;& q# _; K5 T# k; o8 O  W4 |
                currG[id] += greenInterval;
( W4 X) @/ p8 p+ h1 a                currB[id] += blueInterval;1 H3 w, z* D& m' @) r
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
# a8 E  t* u1 c2 z  i6 W+ ]. V                if(++count[id] == numFadeLevels)
5 u; H1 t- Q! q: g1 H8 v                {, g/ I  \& [8 M* N" Q! j; j/ f
                        fadeOut[id] = false;
  M% i! E# L1 [7 ?                }4 s, j  x" Z* u8 q' h+ l' ]
        }
3 y1 _# k9 ^( x$ f  ~& Z; s+ t8 K* m        else# N6 D2 ]) e" {
        {
8 E' e2 W( }; \2 E3 F: p* m; W                currR[id] -= redInterval;9 u' X+ s2 s0 l8 C. D

0 ?" y2 e2 |, n  j/ m                currG[id] -= greenInterval;+ u. q5 a) j" W" P# ^$ B
( w+ f; N6 c  U4 s* I
                currB[id] -= blueInterval;
. D0 N6 K- B1 l3 x
6 B) t, X9 C8 q1 R0 R9 n8 ?                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
2 M. L& n, E& g/ y
; O' e- O+ G1 {1 Q6 N! C, V                if(--count[id] == 0); J* x1 i4 A, m, q

& n# T! _# [/ W& Y3 H                {
% R1 d; o! i8 X3 i  |* G8 ~6 D
; W4 c1 |% @% ?9 i1 b                        fadeOut[id] = true;
. H1 j* U: R# Q7 b/ F7 V; F- S/ o* r; A% b& L
                }
8 q) O$ s' T  d; o# ^& R' L0 z
. d" l# h& ?7 r" l- N5 m0 }        }+ T/ n  I, I4 ^" G
. ]+ v* [4 Y1 s+ o) p5 d
        if(continuous[id] == true)
5 A' |9 v0 T, b! Y6 v8 g5 M& P. y4 |/ r' d
        {
/ i7 Y9 G; U2 G6 z6 g' b- l; q5 c
                document.getElementById(id).style.color = newColour[id];                4 v! |: b5 J3 P* Y
1 E2 b/ `  s. g3 F3 n+ F. n
        }  v! v4 n1 n+ a

% K  o+ O- v/ y" X7 o        else1 o9 u3 h% x+ L  D% H% O+ j

  j8 v4 @" G9 p/ k( K! M/ V2 V1 `        {
8 b1 H) C# H  ~) p( }# K
4 e6 t& R: {0 q: D                document.getElementById(id).style.color = hoverColour;% ]( O  n  ~' Q7 q6 N
/ ]0 Q$ q/ X) {1 I, T
        }
5 I8 K# _3 H$ v8 h% S
1 H7 f; y& u) A6 C+ Y        clearTimeout(tID[id]);
$ M! ^4 V; S; R/ Q8 b# e' j0 s
& u/ t" f5 K% ?& e2 _        tID[id]=setTimeout('startFade(' + id + ')', rate);
. }3 v5 [" q2 K  r, U6 q. g0 q( W0 J
}5 s3 B5 ^! P1 T. J9 |
3 \, M6 V, t% C) G, |
function continueFade(id)! _2 S: M9 ]' c' Q# |8 }) Z

' B7 G! \% U! B4 v, n{6 H( u7 {: w4 \" g2 x
. R2 `  w# L  f4 i; F" z' Y* ?
        continuous[id] = true;
' g: U1 c0 k- r+ ?: d* h3 z/ x$ N. r8 Z7 i3 G
}
  s2 I& o2 W/ e. ~+ t0 H; p4 R( e: g' E& S9 u9 m3 {- q# v
function stopFade(id)( |$ i" L/ F+ f0 R$ a
$ N9 Q8 Y( B9 e/ g) v
{/ \3 K) x! ^7 {$ Z

: e5 H5 Q) C7 C' P5 ~) g" J& ~        continuous[id] = false;
" _2 {7 |% U  i; W' J6 A# f
' D1 _, W" X+ ^% d( f" k; W- `}+ H5 P  h1 t/ v) c* L4 R  B' E

: b. A0 \  I1 f: x# @6 t& l% X$ mfunction StartTimers()
% n6 \# Q* A3 k& M, b$ ^" j. Y
9 N. a3 h1 M2 }. `{        //set up an initial set of timers to start the shimmering effect
; n% T1 T9 X0 t! y$ S5 t
: j& Y  O4 b. T% s' k& y        for(id=0; id<numLinks; id++)
8 E. C  M$ v+ S  ]/ P: O. f5 L' }
        {
9 m: l3 m& b% {6 n' ~4 H
6 I+ A# o' [- R. l  h                t=setTimeout('startFade(' + id + ')', id*100);
2 x# W$ W" l8 v2 s  L; J
( d4 @& b. l' h        }- R' P0 Z1 y$ z5 N# z

2 x+ t8 c4 t! T: L# \}: g% B$ B( W  {
% H6 b* e# T0 w; g  N+ J* ]
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
4 X" \, [) c4 C$ ^9 B* ?/ H) Z$ L5 w2 A9 M5 @
initLinks('#FF0000', 6, '#FFCC77');' V- i& {0 o, l1 Y+ g: o0 S

4 H4 G+ m4 D. P0 {//-->! `' _8 C8 G9 o3 Y. R4 k
. Y1 {- T' D7 ^* K( ]/ q" {
</script>0 H7 Y$ L' J# l# g& e1 e1 w
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元
! R6 c1 a6 C9 \; \7 X1 v2 y$ ]7 l* ~</a>! ^  G* T9 L& K* T+ u" y/ E
<br>
8 r/ C! F" `( L$ y$ V% h1 o4 J8 X<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>
- @8 _" r: {) w: ?4 |: {<br>
, }* O% P/ e* S( Z8 ~+ B' |. d( o<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>; v) g  P9 {" f. N5 v
<br>       
5 x; O2 j- M; @& q<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>5 z6 I3 s! A) R+ ^
<br>
$ C9 V7 C5 M' W' V( p% H<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
4 T, B0 G/ s# u, }+ j! v<br>
- f: w9 ~6 A3 M. R% m<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>
& \: q5 ~$ Q2 _! d. |. b<script language="javascript" type="text/javascript">
& N) s# C9 S; z* z<!--
  O) H9 U6 Z& @# V5 v# EsetTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
  ~9 u$ M$ Y" l0 L//-->& x' t. K+ f( i1 O1 _. a" X1 ?  j
</script>