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

zw2004

<script language="javascript" type="text/javascript">1 }; b( c9 Z8 \# d
<!--
) x, _, z1 J9 F// convert a single digit (0 - 16) into hex2 N& u. E& u2 Q5 U- o
function enHex(aDigit)+ r3 f8 `# z" {' T
{
8 y2 o8 M7 I, A4 N    return("0123456789ABCDEF".substring(aDigit, aDigit+1))8 F/ a4 O; q% t4 _, Y
}8 H# M& \. I" a; R" \, a: Q" v
// convert a hex digit into decimal7 ~- h2 W8 a* I: B& D/ a1 j
function deHex(aDigit)
& l  P( O; {7 t7 L8 S8 s0 F4 U) [{$ ^* I5 r2 Q; H5 z+ A6 m
    return("0123456789ABCDEF".indexOf(aDigit))
* r4 O3 q4 x' b8 A0 q; d+ z}* b" i" i: i. N, O. F% \
: C. j' ?1 d( k" w$ o( Z- c
// Convert a 24bit number to hex: x/ e, Q, u: e0 u
function toHex(n), r' i' x$ w* w6 c7 O4 [
{/ }% D! x* T% p* i
    return (enHex((0xf00000 & n) >> 20) +
/ t; ^( g2 `2 X" I7 I            enHex((0x0f0000 & n) >> 16) +; L  z# A& x0 U1 o/ R
            enHex((0x00f000 & n) >> 12) +
6 u" a) O7 M: P& n            enHex((0x000f00 & n) >>  8) +
. M* s8 n: C7 w- [            enHex((0x0000f0 & n) >>  4) +" x6 S# m5 G; @0 s  P" L
            enHex((0x00000f & n) >>  0))8 I: T2 L0 ~$ M& t: s+ V! Y
}# c5 o7 I. g9 c2 `' q/ J
// Convert a six character hex to decimal7 k* @3 g, N: A" M, W; K
function toDecimal(hexNum)
! Y$ C$ l( U& W/ j{/ m) g/ r2 }% y6 a& _
           var tmp = ""+hexNum.toUpperCase()* ~' M0 @  L* W$ @& t1 M" u
    while (tmp.length < 6) tmp = "0"+tmp5 A: F# E0 [  O4 W# l! c4 Q
           return ((deHex(tmp.substring(0,1)) << 20) +0 B1 v! Y3 B: E6 h# x& w$ Q
                   (deHex(tmp.substring(1,2)) << 16) + 5 \0 W' E9 P# ?  ]
            (deHex(tmp.substring(2,3)) << 12) +' ]' v4 U& A( n6 e
            (deHex(tmp.substring(3,4)) << 8) +
  U2 t: [% p, p, p# b9 A            (deHex(tmp.substring(4,5)) << 4) +6 t) K  d4 p4 N3 E# Z6 |
                   (deHex(tmp.substring(5,6))))
! d# U: b7 P% S0 _& X8 x8 ^6 N}
# b3 s6 T6 `+ g9 I: F6 Z6 b. \///////////////////Shimmering Links/////////////////////3 `# K. \, r  A9 z' Q- K! K4 j
//global variables* H/ w6 y& g; Q- i' x) \
var hoverColour
1 k) A; P2 z& `+ U0 e1 o, tvar numLinks;
4 }" O# D& ~6 `  q& c( Jvar rate;
# m- B: }. \. ~! \var numFadeLevels;
) z* w0 L3 A! l2 mvar bgR;
$ l$ a. h4 K  H7 e' m3 {  A3 cvar bgG;0 @, J) p/ D' k/ t" i4 {
var bgB;
" R. Z" x" w: @. j/ {( l0 avar currR;
/ P) G( f3 x/ u5 R+ @* k5 \! [: dvar currG;" u# E& o" U7 w3 n" P
var currB;# m6 D: _# C' o7 J) L0 b9 V' E: U8 \
var count;0 }& a9 P" ?3 l) N( z
var fadeOut;
8 X  }2 b( W( S# W  B; S$ Ovar continuous;
$ c" c* Q# m- H3 [/ ~# z( C  ?var newColour;7 J4 E+ M. [& J2 y3 X
var tID;
+ R4 R+ N" J2 [/ B  }& `+ zvar redInterval;
/ Q% |/ \' I0 q+ fvar greenInterval;7 o6 z5 Q, I9 a' a1 j6 l
var blueInterval;5 w8 a, q" N( s& _: m
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)& L  _& Z) e6 m; h# S
{; I: y9 g) x/ P0 `: B0 t2 K
        hoverColour = mouseOverColour;5 O1 i$ k$ g1 d# E0 A: K( m
        numLinks = numberOfLinks;
" E' O7 s7 Z' x/ e; f        rate = 1;0 ]! F/ V' L! t' g; L% \
        numFadeLevels = 30;
- R6 Y' `$ }, F' N: w1 e% j& Q        function initArray(theArray, length, val)- U% i4 |- |! z& h, B) r
        {+ a+ @' T+ W+ P& d( m0 S
                for(i=0;i<length;i++)  S) M( i: Z7 ]
                {
& ]8 _) S& x  Y; d                        theArray = val;0 S/ Q1 M* @! L- p9 c# c2 g  f
                }' ~8 g0 g+ Z+ Q5 g" I9 H* U. X! N3 x3 D( ?
        }" y' n9 o6 r. M2 [) r: G
        bgR = '0000' + fadeOutColour.substring(1,3)
# X' u# ~- [7 E5 L7 \7 C        bgG = '0000' + fadeOutColour.substring(3,5)
! n1 d8 q# t- ^% R* y( ?        bgB = '0000' + fadeOutColour.substring(5,7)9 h; V; B4 d3 b! n& _6 |/ F
        currR = new Array(numLinks);* c5 B$ w" ]# c/ e) e
        currG = new Array(numLinks);
9 h6 S2 U) X  _  `  }5 `        currB = new Array(numLinks);
4 X( e/ z1 ^. r1 r. t* G        count = new Array(numLinks);
( C2 e: G2 I6 L  ~) ^        fadeOut = new Array(numLinks);/ A( p  P# o; z# k5 m6 `
        continuous = new Array(numLinks);- N# K, c$ O* l) ]/ `6 n) e
        newColour = new Array(numLinks);5 v: N! D: s2 Z. v  a/ T$ z* z2 y
        tID = new Array(numLinks);
) a) X! A( G5 v* K- ^5 Y        redInterval = toDecimal(bgR) / numFadeLevels;
- \" S$ ?2 o- x7 A6 o        greenInterval = toDecimal(bgG) / numFadeLevels;
* q- W2 y2 e5 l, j, p6 k  j        blueInterval = toDecimal(bgB) / numFadeLevels;
/ T- [2 @. b9 U7 L9 Z        initArray(currR,numLinks,0);) T9 c% h1 z& h$ S( F4 a
        initArray(currG,numLinks,0);
* @0 U: L1 b+ o. l6 k* |! d        initArray(currB,numLinks,0);. m" k+ a3 i; E% G
        initArray(count,numLinks,0);) p3 X, D6 h0 @2 @
        initArray(fadeOut,numLinks,true);# m9 G1 Y( _0 a
        initArray(continuous,numLinks,true);, [/ w$ H  H6 \8 K7 S0 K
}        ; }% @- P" b$ C  g% X
function startFade(id)
; ?2 {; I; p" {; l7 s% c. x7 N{- Z/ l4 t5 X* {! ^. X( \. B
        if(fadeOut[id] == true)1 n  h; T) f1 k
        { /*move colour towards background colour (increment)*/! E9 X4 |, t9 S2 X& U, D( t. t! g7 G
                currR[id] += redInterval;
0 q2 K$ w/ A$ m  b                currG[id] += greenInterval;
7 N! H+ S7 N' f: k- B                currB[id] += blueInterval;
$ W9 c6 [3 ^' r. }2 N) N& S5 A; H                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
% v9 U3 I2 ~1 f# z5 W7 G                if(++count[id] == numFadeLevels)
$ y1 V& c4 z5 Y- m; w* u                {0 N) v6 g& T% G4 N' _/ |
                        fadeOut[id] = false;' x+ ^6 X' w3 p( j6 Z
                }
3 `  h. C& ]: r! d1 L3 F        }
3 Z" t# G" c! U. V, T! i; Z& G; L        else, U* W/ I% m) H8 e: i$ d
        {
. @- T. I9 ?/ `- C4 a* {) O                currR[id] -= redInterval;( d7 @! f! c: k8 P
0 Z! J. d, {6 ~6 n
                currG[id] -= greenInterval;
9 z9 E7 @# B: z; U/ I6 X9 O. n
( P2 @! ?7 i% O                currB[id] -= blueInterval;
! n1 b  Z! G. u1 e& J5 o  z# G
5 z. n+ o' Y3 S( Y: p- A, y8 @                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
* T: z% Y, C+ t% Y3 R: `
4 N, ]9 u# A6 x) H  w                if(--count[id] == 0)
) h- w. r: U2 W! S+ I' P, F% G
5 |+ Q/ R0 A8 t* O0 T                {! O% m" o/ h1 N$ |: G

. t0 h7 D7 V0 n& X# H                        fadeOut[id] = true;
" y7 n2 Q4 ?' ]
( d$ s4 v& \8 `; h6 q5 K' U                }0 u7 J: l2 N$ ?+ x/ N

9 o( M1 G0 ]/ N2 [        }6 k' p& N+ F6 E; I: A; a
, @% |- C; X" b- |6 n* y
        if(continuous[id] == true)9 z6 U( t" h2 L
; s) B, ]' Q. }0 m8 Z/ ^4 `
        {6 K% C* F5 W' O

, S" `. C* D( Z* y                document.getElementById(id).style.color = newColour[id];                ! Z/ a8 S; x5 j
8 T; w1 u/ O, B  M' d
        }
8 V' M" u3 u, X; f/ G( L) N& J/ @, H5 V& O
        else
5 i$ `% i; ]  Z* ?6 X6 j
0 B% m7 Q" y( d6 V' |        {1 F3 {- |8 e, c% ]

6 s- [. b. Z# c/ ?                document.getElementById(id).style.color = hoverColour;
2 t) K6 j% i' T$ r
; o2 y9 ?3 W) W: ?$ {! Y        }
' p8 @/ n- ]! M, z( ?5 j* g' i& a" d& j  ]1 @) \+ n
        clearTimeout(tID[id]);* @: {: @& X7 V' u4 ^% b. ^2 e

  n. W) @9 @/ c2 R/ Z% T2 R        tID[id]=setTimeout('startFade(' + id + ')', rate);. _8 v' J/ T3 v

- r7 o3 T$ O! x% ~& w}+ C, w. F5 o+ x0 y6 k" j
0 n1 g; V- g$ N' P
function continueFade(id)
- @+ I, y* _0 z# Y0 z' J5 R& D
' q) v" ^+ V) I4 Z$ X& w{
2 Q  K' Q$ j8 X% s" D; N3 ?. B5 e. v5 F( F8 b7 n. q; b1 w7 z0 F
        continuous[id] = true;1 t! W6 f, F" @8 m
, r! ~$ f% F: A* c
}
6 G; `5 H+ E3 Z# w
! G. [4 [4 q5 y7 `" |function stopFade(id)
6 i# ^9 M* C3 J) R, k6 O  R& ^8 x: W# Z& l3 D
{
6 j5 Y7 {1 e. L7 K1 M5 {
( l, V2 R" P. k( j        continuous[id] = false;3 v5 [& e& g  Q0 `# {% I, K
5 j5 k2 q6 t- A, a* ~
}" ?6 q& A" d/ c8 W  ?
; {& x7 I$ q- Q& }% v; K
function StartTimers()" c+ y2 Q4 P6 z$ d" M8 I4 |! {: O1 r& [
# ~( P! i& U" I0 D, p
{        //set up an initial set of timers to start the shimmering effect
/ B% E' J6 E' N: M7 h4 r9 X8 U" S- u
        for(id=0; id<numLinks; id++)8 k/ T7 f9 S! g$ G9 I0 y; T

' a& z3 ?: I' q! E        {: o" ~6 D) @# O

4 z5 i8 U1 Q! e: I  ?/ j9 u" x                t=setTimeout('startFade(' + id + ')', id*100);2 Z9 k0 J% [! t" }8 x1 J
4 m" W3 d) F7 f
        }6 N- O" m+ t5 F" v8 t! D0 T

7 Z; n$ I0 R' O9 {8 f" m}9 e: o. A( K% m5 k! l  c

! R* D) _- }6 q5 T0 O* `//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
# e, A8 P0 q0 Q6 V) C. X9 Z; z0 d8 p
% Z8 m5 g7 F5 Y, B% ^initLinks('#FF0000', 6, '#FFCC77');( a8 g  C  D+ U# }' V  N( a
8 c8 e9 g3 {  `% D; p/ _$ [/ V
//-->
3 a- \) W  D+ v( u" S+ J: p' Q! C/ y2 d
</script>; x8 k8 M2 j- i; u* X, k: r' ~  w
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元1 l( y: t! L9 X8 N" a" O
</a>
8 a  E6 k! a- a% ^5 g2 t7 }<br>
" O! P- w2 x2 h- E, Q! v<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>$ _! p+ l% r7 R
<br>
2 k" `' p* P  I: ]  n/ U: F<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>; ^) O+ ^5 |; X7 x% f5 x9 W
<br>       
" W( G1 B" D: L% Q( z/ p& w<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>% @6 _1 t: v. O8 `! W3 T7 L8 H
<br>
: X! M" Q/ H' i* a: \<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
1 N5 Y3 Y! M. d" {/ R<br>
, O1 H- L5 X0 O' `<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>* X6 k0 _; Q/ d
<script language="javascript" type="text/javascript">
( r- a5 D% C5 f; o4 n3 l<!--
$ K6 f: S3 @5 M) `. esetTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering7 v4 Z  A% J2 l* _3 U" ]- i/ Q
//-->+ z3 q7 ^; Z4 w" T# K
</script>