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

zw2004

<script language="javascript" type="text/javascript">
- s, ~$ M4 Q2 X& l4 x<!--
5 o# z6 ?( G- K! \- O! c: t// convert a single digit (0 - 16) into hex+ q3 W" P) L, P! O
function enHex(aDigit)
3 R! A9 r' M9 R- Q{0 W4 m+ [- a! s$ s0 @, w; n
    return("0123456789ABCDEF".substring(aDigit, aDigit+1))% y4 N' m8 x7 s* v
}
* z7 U5 [0 a' O8 x// convert a hex digit into decimal
6 P$ A8 I2 ^# S  ufunction deHex(aDigit)! o" n8 [2 G5 D/ m8 c. j& R" W- m
{7 W' Z8 J9 r( K( I" P+ @
    return("0123456789ABCDEF".indexOf(aDigit))7 Q( Z1 W3 @- z3 Q+ q5 \6 c3 k* a9 u7 c# E
}
4 X% b4 A9 i6 ^! s( m
' i# v- L; [6 E" m4 ^: m// Convert a 24bit number to hex
# y: J& [! m! J' U# H+ H! m6 pfunction toHex(n)  b1 X% m  n9 L0 M$ q: l
{
) `5 h) b1 ~5 Q1 {3 s5 l1 \! L. R    return (enHex((0xf00000 & n) >> 20) +$ M- f" N! y7 a. e* e, C
            enHex((0x0f0000 & n) >> 16) +# f7 r0 o0 ~2 @4 [) }# g1 u- O
            enHex((0x00f000 & n) >> 12) +
- W* p5 m& d" g% I: Q; r            enHex((0x000f00 & n) >>  8) +& _  a* Q$ g3 H$ A* ^1 Z) m8 o; `
            enHex((0x0000f0 & n) >>  4) +& u0 y& K7 [4 E1 ]: o% j
            enHex((0x00000f & n) >>  0))
( ~3 z9 T) L$ U}. j; B2 l  A' Q7 b# i5 y
// Convert a six character hex to decimal
/ V# n2 a" L. H1 `  Afunction toDecimal(hexNum)
" J$ p- L% K' t& b& ?6 k{, m/ A+ G4 \$ c, I# p5 ^% w  _
           var tmp = ""+hexNum.toUpperCase()
9 M1 a5 q# N( Z0 V    while (tmp.length < 6) tmp = "0"+tmp0 w; w5 z2 {% d) j6 ]
           return ((deHex(tmp.substring(0,1)) << 20) +
# Q# ^0 X+ ~6 z! v/ ^                   (deHex(tmp.substring(1,2)) << 16) +
- x2 I* N: y/ w0 ~+ M' N1 k            (deHex(tmp.substring(2,3)) << 12) +* b. R; Y  n. r4 _! c& E5 c! K5 S
            (deHex(tmp.substring(3,4)) << 8) +  h1 J/ E1 l3 z! \* J
            (deHex(tmp.substring(4,5)) << 4) +
3 C8 T: `3 r. q# H, Q                   (deHex(tmp.substring(5,6))))/ |* b, D. o& A, B
}
. u. ]! Y1 H! o8 q///////////////////Shimmering Links/////////////////////+ i: F- \$ r8 p5 y& w( K
//global variables" k% J0 U6 W. I5 Y: F' ~( M2 r- j8 ]
var hoverColour6 V0 g0 w' z" Z: h+ T6 m
var numLinks;5 U- i4 S0 v( c. {7 |8 i
var rate;  q* L5 }% F1 D) V/ R+ Y) j
var numFadeLevels;# b+ H1 B0 L$ ]! ?2 x1 X4 f' R, K
var bgR;: o! {/ L: T& p0 U) n
var bgG;
! G$ X5 p: i) B) f9 T1 Xvar bgB;0 {4 y1 |3 s4 @  M5 f
var currR;# H1 j9 G4 f7 y
var currG;% j: e4 g2 R1 }; ^! A
var currB;
+ ?3 H9 E# u4 s; g# {var count;8 P/ d# d6 I+ ]( {5 |5 A/ W
var fadeOut;; C0 @2 \8 v3 R- [$ B& w: l
var continuous;
  k$ {% v: k* ?) \7 g4 B1 G; Bvar newColour;
' q- A& e& P7 G3 Kvar tID;
' e' ^" g$ ^' C: ^var redInterval;
  e/ q5 \& A: v) x4 evar greenInterval;
- f4 w' l' D. t0 s8 S* cvar blueInterval;; y5 x+ V7 p" \
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
7 O/ _) y0 f6 @{* }7 o+ E5 ?  O
        hoverColour = mouseOverColour;' p: H2 Y0 ]% r
        numLinks = numberOfLinks;4 {# r/ L5 U, ~: J8 z
        rate = 1;' @9 A. F6 @3 \* y
        numFadeLevels = 30;
2 }" K' A' Q0 f2 Y        function initArray(theArray, length, val)
0 S8 W9 |2 @# F' V0 b' ^# n        {
; i' n7 t3 a- w7 ~                for(i=0;i<length;i++): M+ p8 D# e9 d- b* F3 p
                {
; Y2 Y5 W  k. u2 e* i/ I                        theArray = val;
* V+ S9 Y: Q( r2 p% Q- ]                }- P' s( D$ `7 l; G* \
        }) M3 A. y6 R6 K- f8 c
        bgR = '0000' + fadeOutColour.substring(1,3)
, {7 V# i& x0 _- R# e        bgG = '0000' + fadeOutColour.substring(3,5)9 s1 G; F. s: o$ {8 A
        bgB = '0000' + fadeOutColour.substring(5,7)5 Z9 E4 g. h# W/ p  S3 r% S
        currR = new Array(numLinks);
& Y8 q. L, L9 l6 @. N. D: L/ G        currG = new Array(numLinks);: I/ ]* c' T# j0 z
        currB = new Array(numLinks);
) ^2 P. i( G6 ~. z        count = new Array(numLinks);  @9 o' t( @% {0 z
        fadeOut = new Array(numLinks);
  Y) {, `( N1 n$ k% |        continuous = new Array(numLinks);
  R5 ^; ]4 I+ H% K# D2 J! A; R) b, G        newColour = new Array(numLinks);) c1 W" m2 K8 W; e6 h  A( |
        tID = new Array(numLinks);9 v9 E1 e: I+ b8 m- O$ E& b  T. B" X
        redInterval = toDecimal(bgR) / numFadeLevels;
1 h1 P4 ^: r% R+ J        greenInterval = toDecimal(bgG) / numFadeLevels;2 I0 d. I$ ?  W
        blueInterval = toDecimal(bgB) / numFadeLevels;
( ?+ k$ @7 d/ l0 d6 D2 O" O        initArray(currR,numLinks,0);
/ O6 ~! _; @! t& O0 ?2 i8 L# l        initArray(currG,numLinks,0);! t6 z' N" ]0 Y& ]
        initArray(currB,numLinks,0);
7 G* {( j) c& g0 Z2 l; X        initArray(count,numLinks,0);9 a! P# r1 l# Z6 R" s$ A/ b, }
        initArray(fadeOut,numLinks,true);4 j- [5 ?) ]. k! ]. z
        initArray(continuous,numLinks,true);/ }) ~9 P$ D& a! q8 K
}       
: ~: P( a" k/ X% L5 u9 ~function startFade(id); m6 s/ _( H- z  L
{9 n& {) x6 W# }3 U8 W
        if(fadeOut[id] == true)
0 i. v8 Y( o: `9 u- @' \        { /*move colour towards background colour (increment)*/
8 Y7 W9 m. c6 P- t                currR[id] += redInterval;
, L1 O' N& l9 c- G5 s1 D# L                currG[id] += greenInterval;
, f( p) `; N- K1 Z7 S7 m                currB[id] += blueInterval;, o6 t4 d% q$ i1 L$ Y. g
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
: T0 M" Y! o. g$ v8 H/ J' X6 z0 A                if(++count[id] == numFadeLevels)- M, O( \7 S  n% q
                {
3 w& s& c' H) C9 |                        fadeOut[id] = false;) }1 h2 g- T& _: z, N7 s* k0 C
                }4 ~+ p" J+ Q" L) a, g4 Q5 X
        }
6 D2 t& }! \3 L( u        else) ^# h7 F9 ]% t, z
        {
5 b9 [# W! s4 ~- [( P                currR[id] -= redInterval;
9 T8 {6 \" p' K, u0 I  B' p* `) Y( ]. E8 f; _+ W! y5 D5 a
                currG[id] -= greenInterval;
1 a" m) R4 @7 a, N* h  X% B1 u$ Y; \& H7 E/ H
                currB[id] -= blueInterval;! Z+ V7 L3 t3 T3 B- c5 r& h

& q# S. u; n4 l' |+ Q; y& \* W* C                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
, T6 U7 m3 R6 S! Q: k: \7 J0 {! r  Q0 Y: a
                if(--count[id] == 0)
' Z8 H3 e* h9 [& Z, @( {! }" n8 I3 O2 M
                {
7 E8 G7 F! _, }, t) U- P: R
7 r9 \/ x, b9 r4 x( M                        fadeOut[id] = true;
5 f! v5 i5 J8 N  k2 J- C, l$ z* K7 i0 ?0 ]( {
                }9 d) D  L! E- `

- s% c$ G$ E, |        }
6 y2 o% @9 `3 b0 A! C. u. u4 n2 D' b. @+ Y4 a/ j
        if(continuous[id] == true)9 s  M+ U. z7 n9 o5 s* Z  Y2 w
' N: V# R9 C3 h/ F2 h  }" V4 H0 C
        {! X& N9 y* j% F; Q

. ]6 P6 r# b! M+ X+ y! z$ x6 a& b4 _                document.getElementById(id).style.color = newColour[id];                . S9 R' k/ u+ Y% z
- D/ u0 s* n  y9 K* O
        }0 u# e: ?6 \% `* k

! J3 S  Z: e% r. t        else; C7 B; ~& L5 g, H1 f

# o" h9 V) f7 O  F1 _4 o& @$ Q        {
4 R. `/ W% P5 j7 q. \- p8 g+ r( b
2 e8 T9 e, r5 @: j# f( Q                document.getElementById(id).style.color = hoverColour;6 w9 O$ i# K4 }! N+ Y

: t( H" d5 q- ^9 D        }
( C$ O. r3 t6 U) y2 u& e, O. _
, m+ F; T! \2 _        clearTimeout(tID[id]);
- P( R; z. F4 I0 g/ ~. x" O, F7 v7 \" {+ n
        tID[id]=setTimeout('startFade(' + id + ')', rate);
4 H1 X" z5 A7 y- D4 t, B& j) u, N/ G9 W; ?  @
}
$ n0 E* u& K9 T( ^% }* l: T; u
/ R5 O8 h! N) w, Sfunction continueFade(id)" L; q" G1 y, ]0 m' v' S# Q) x

/ m1 u: N8 |4 I7 Z{* }1 l! k5 e* Z) t& k5 G' i% d
& s7 @/ F4 _9 v
        continuous[id] = true;" M/ K- d$ \8 ?/ \( L1 D
# x6 ]9 W9 b5 c, h6 H7 Z( N/ J
}0 X: l% y  R& ]: B

: C" F. [/ W5 T. ^4 j( m$ mfunction stopFade(id)
$ ^/ h  ~$ x& X5 H9 N0 j2 Z+ s" C! y
{
% Q2 P+ c6 A$ O% f' C6 j+ T! ?* A* H! l* E' U1 ]) c
        continuous[id] = false;
% }! ?# P8 [. S5 l: k( Q5 {6 ~6 p7 a2 ]: V/ b) n5 }& V2 {
}
% ^" m7 M1 p" d+ V
) H3 Z; g, q4 [* u& I5 Kfunction StartTimers()
. S' \% N& a& u, t8 q1 }* R" S
{        //set up an initial set of timers to start the shimmering effect
8 q& N7 Y$ k6 Y9 f  c+ q
3 y; J- w; j+ ]' r# ~8 C  r/ S        for(id=0; id<numLinks; id++)
) O9 H  u$ }8 g9 E$ U
" C4 q% o  t$ D7 a2 L        {- u/ G( S# G! d( b+ {+ R2 j

5 ]1 u. W* }. x& _  h2 c                t=setTimeout('startFade(' + id + ')', id*100);
9 e3 a% N0 s  K" Y( m6 ~2 p4 P: q+ K4 e" J
        }- K8 z+ W& A3 w* @

3 i4 n1 C7 M, V" Q}0 i2 B" M, k* i; U% F' F

7 [$ b1 P, V/ G//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
+ i- Y1 r: ^# J3 T6 x4 a$ u0 {" b, _9 S7 R9 ?
initLinks('#FF0000', 6, '#FFCC77');
' D2 \( \1 p- I9 g; g0 _/ F5 J& ]
7 i4 N* c' O3 J$ T//-->  W/ T9 d7 C$ o2 T" E1 i
; w8 x  \1 e( C' K6 P
</script>0 q+ g$ d* Y: r$ ], ]6 L' \) |
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元
/ c; d  {' j3 Z. u" f: a/ j: G</a>
: {1 W2 A! [2 d% D# K<br>5 q$ p& l9 s; w- X7 H6 b
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>
6 v) `/ x. f7 g1 {  c<br>
7 g# _0 N% _2 C1 o2 e  D<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
6 U- @6 @5 s6 {<br>       
# H& J0 C3 m0 E- h- C<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>; @/ Z, P, q8 J) n3 b
<br>* q$ R% ]* _6 K( ~' m! z" G
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>$ i- y; x3 A& N
<br>
# m: S( `; _* V' A/ {<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>! r' Q8 K7 l+ s3 [- K* W
<script language="javascript" type="text/javascript">. W0 ^8 e6 l0 B
<!--
) o7 H/ U/ S# i/ Z; b8 \# JsetTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering* P! x' j0 |0 p0 D, a
//-->- h* R$ f1 N) R3 i1 F4 G
</script>