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

zw2004

<script language="javascript" type="text/javascript">! x4 v- u# {% ?4 `  }
<!--
+ D: s; i% K: R- W// convert a single digit (0 - 16) into hex
8 V. S! J; O7 Z: Zfunction enHex(aDigit)
( @! h* e) S7 n9 _% [{* O# S" q  q( _7 w; A0 v
    return("0123456789ABCDEF".substring(aDigit, aDigit+1))
7 w1 x' o4 K9 |5 c# y; U) T4 J}
. c, C; D% D0 Q) a5 s) i// convert a hex digit into decimal5 U2 T7 J1 m7 o
function deHex(aDigit)( Z/ I( M6 ]5 \" }0 Z( z4 v
{+ b& g* ~+ `7 O. I" s: X$ W+ R
    return("0123456789ABCDEF".indexOf(aDigit))% s" m: \4 a& }4 U% L. b7 G) `
}
& |" k2 F9 e5 c  b! K( x$ S* f
5 C9 W" o. q- S// Convert a 24bit number to hex
% c, L5 [7 i+ C' x) L, c9 Tfunction toHex(n)
2 n- g0 ~9 B$ U+ A; r{
! D, }9 a; U7 F4 \- w* [( r5 x    return (enHex((0xf00000 & n) >> 20) +, S+ o$ |8 y) i' A: u7 X/ q  i7 I
            enHex((0x0f0000 & n) >> 16) +( _  l* @: H) B- ~6 z% L/ y7 t
            enHex((0x00f000 & n) >> 12) ++ X2 f( M9 P6 a8 k, J
            enHex((0x000f00 & n) >>  8) +& L7 g- ?! n  x+ b/ c8 ~
            enHex((0x0000f0 & n) >>  4) +: M8 A9 _* Y% p2 j
            enHex((0x00000f & n) >>  0))9 i2 E  W* U, H0 S: B: @) @
}
" o  g' t, S0 `9 w" @1 k// Convert a six character hex to decimal# L( F9 P. m0 x, r# |3 w( ?0 O- h6 t
function toDecimal(hexNum)
% y) V5 C: q, J+ I9 x" Z0 N{
, H& Y8 z$ h9 B3 b( e" \" @           var tmp = ""+hexNum.toUpperCase()
/ U/ W' l1 P: w" ?    while (tmp.length < 6) tmp = "0"+tmp
+ L0 G4 l* n% B$ h' {; [& W           return ((deHex(tmp.substring(0,1)) << 20) +
3 T5 n  r/ k* M8 G& ]9 y                   (deHex(tmp.substring(1,2)) << 16) + # y0 d1 R" E5 F: y
            (deHex(tmp.substring(2,3)) << 12) +
( @4 C0 x6 j0 j5 ]7 \" k            (deHex(tmp.substring(3,4)) << 8) +
4 ?/ @# c: z5 }2 X5 i, w3 y; T5 o2 ]            (deHex(tmp.substring(4,5)) << 4) +# w9 |  `8 n, k. S4 y; c7 }+ g* @
                   (deHex(tmp.substring(5,6))))
8 m1 p6 l; f5 _* K}- G. U. b- ]  b& I- Q) d2 c
///////////////////Shimmering Links/////////////////////
1 j* ^8 Z% d; v; X; I//global variables
5 d2 J# u5 b" c0 D9 p8 Rvar hoverColour
1 W+ o4 V" Q7 s* B  g9 Qvar numLinks;
* E9 A5 |7 g: j' fvar rate;
; f/ o) [7 E  R+ i* F- ^; C/ D) f$ Nvar numFadeLevels;
* Q- C$ k: ^' R3 c% |2 T2 dvar bgR;
0 j: r' l' a1 i" ^3 i. pvar bgG;# R3 l6 p9 T9 T' U8 r
var bgB;
) l4 ~$ Z: A" J' o( ?9 Z0 Y- Fvar currR;5 y9 S" Q  P, y& {
var currG;
, E6 ]! G! l) q4 y  Ivar currB;
+ L7 `4 s% W  \" H. Z' y  W3 Rvar count;
, g  p' D+ O! g+ dvar fadeOut;
2 q7 M; j* d2 {var continuous;, X: f& ^; t. {- T
var newColour;1 H! l& M! e4 A; k  I0 D* b
var tID;/ S) A1 p: Z- T4 }
var redInterval;
6 l( v% `4 s, e" E4 h6 W% ivar greenInterval;
9 ?# x/ K5 H, z3 ovar blueInterval;
6 S' s' m8 j  P3 W. D/ tfunction initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
; x8 a5 G* Y5 Y. f# a7 I- p5 r{
# `- \: J1 i- n; ~7 `        hoverColour = mouseOverColour;: I7 A4 ?2 V- H9 e; N
        numLinks = numberOfLinks;! |! j1 f/ X3 J/ `) Z2 v9 X( r
        rate = 1;
  f0 M; u2 f9 k. S5 b        numFadeLevels = 30;3 c" d. H  f" P+ |0 d2 V. t8 H
        function initArray(theArray, length, val)$ }; j* V/ t/ }% z6 h8 [! {
        {8 e- B- Z3 s* K3 r4 s* g7 l
                for(i=0;i<length;i++)
% j# B7 \; v2 ]                {
) ?2 p: L: t8 m                        theArray = val;8 d2 |+ C9 {* E) Q+ {
                }
. u8 \) b. J) G- x        }- d6 G0 ?7 _) D( e& W
        bgR = '0000' + fadeOutColour.substring(1,3)
: V4 V1 p. u* M1 B; D& \% ^        bgG = '0000' + fadeOutColour.substring(3,5)
" D8 T$ H3 Z8 S0 [        bgB = '0000' + fadeOutColour.substring(5,7)8 _9 N  N# J) ~5 g# K
        currR = new Array(numLinks);
1 }, {: X% _& K* t( U        currG = new Array(numLinks);
: L1 \5 m. B5 b0 o; N% f        currB = new Array(numLinks);4 J/ \8 y' C' m  F! ~8 i: U% P
        count = new Array(numLinks);
1 p3 d5 ?# Q2 a6 M' W# B        fadeOut = new Array(numLinks);
& d7 }8 t1 g* M9 ?/ x        continuous = new Array(numLinks);  U9 P5 e' a# c' M
        newColour = new Array(numLinks);
. {' H6 M2 V& P1 E) s- }        tID = new Array(numLinks);
+ y/ q5 g" t# E5 I& D; c% e        redInterval = toDecimal(bgR) / numFadeLevels;
( A. \! ?7 ?, n/ d- @6 u        greenInterval = toDecimal(bgG) / numFadeLevels;
0 Y+ L$ e' W; p* s        blueInterval = toDecimal(bgB) / numFadeLevels;& i; |' {# z" K2 {% l* I
        initArray(currR,numLinks,0);
$ m# S9 k: B0 l1 s- [6 O' t& S0 m        initArray(currG,numLinks,0);1 Y& M& W. }/ k) |- C7 \
        initArray(currB,numLinks,0);3 r, L5 z: D; t; W
        initArray(count,numLinks,0);$ E* ?3 w9 H" L
        initArray(fadeOut,numLinks,true);
7 a( |/ B% O$ q2 n        initArray(continuous,numLinks,true);
+ y% |; h% i- R" T( a" L; C}       
2 S% J. `0 J3 R6 l% T; Dfunction startFade(id)! D1 ?, |) \% w+ T6 {" U1 F. d
{4 x5 p+ a. b6 [
        if(fadeOut[id] == true)/ s, J, G5 e7 v1 r+ M0 }+ ~
        { /*move colour towards background colour (increment)*/7 A" P, d) B" S5 ]+ Q
                currR[id] += redInterval;# }- k# h" u/ O' j6 X+ e
                currG[id] += greenInterval;( l2 c, C4 Y) [# o1 z
                currB[id] += blueInterval;2 @  R3 w- R2 ?( T' P  E9 r
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
6 u# B  G) E- g7 v                if(++count[id] == numFadeLevels)
# l3 e% A( M# t* c$ A9 I                {
* q$ \+ l1 V* i7 V                        fadeOut[id] = false;2 p2 y- \% v" B8 e  Q6 S8 E
                }
6 x% s' g* k- D$ f+ w        }
6 f3 B  f# Q: h2 D        else; ^6 Z; d$ M& o! j; k$ ^- f" A) ]
        {3 m' T. ^9 _0 w% j- J& h+ Y
                currR[id] -= redInterval;, f; d6 d7 y" V6 X% ~6 \
+ i+ c  Z8 G4 ^1 d/ h7 R
                currG[id] -= greenInterval;
6 B. U- G5 F9 h) c
  P* V7 @2 T$ k9 X                currB[id] -= blueInterval;
. u5 Q' i8 Z$ A% x# T
0 n5 l$ {, b  R  n# ~% z: q                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);9 o9 i; ^& p7 O+ ~
, l3 ?: u. p- Y. ?& W
                if(--count[id] == 0)3 B  D! X$ [8 M) B

, s9 V, E( J/ T4 {; n* X/ K! _                {
& S' O* Z( ?7 y' _) c: ]
8 U4 l8 x9 r! j; ~3 E                        fadeOut[id] = true;% K! _# w6 t- J8 @

6 Z9 M9 f4 j, t. V                }
2 L' S3 Y1 u/ W: |' j, ^. }
, }1 y! w7 c/ ~% y7 j        }0 ]1 d+ Y2 d$ o! t

7 B" ^. V2 V4 K. j% k1 Q. L! T' n; ]" x        if(continuous[id] == true)7 Q4 J' Z6 }' O

8 _8 P1 Z3 {, M3 b) M        {4 Y$ K* K: ?; m1 A3 r

2 B# c/ ?2 F* d" ]                document.getElementById(id).style.color = newColour[id];               
# }" n4 Q6 b5 o  D) A: `4 G* F6 E; |+ f1 a9 k9 B3 o
        }
# I0 u7 g1 ?- z5 |! C0 J
* }* }1 v7 [  o5 {- T' n) O0 P4 z# }5 y        else% A+ [% k) U6 u+ W$ p

: s1 {/ m$ d9 o: l7 [( Z% E        {
1 E, K% C" t9 ?- I
. F3 ~( H% O! F9 z, ]                document.getElementById(id).style.color = hoverColour;
, V) H, j  n/ l% M( i2 L. r
' ~- h* V( f$ I/ V' [$ C/ g/ \7 y        }+ A$ p9 @' ?# w9 R

7 b% y# Y6 |' N+ Y2 s( k* K. f3 ?7 b4 }        clearTimeout(tID[id]);4 K3 ]% ]5 Y/ c9 I
  R, o# B) Z" d- h2 P
        tID[id]=setTimeout('startFade(' + id + ')', rate);
8 x# a! d. ?; M3 {+ P, h$ R. U6 a
}
1 T9 U  E2 B/ X- W! q3 @+ @: J3 f9 }. R) Q9 v2 v; {3 x
function continueFade(id)
- z1 I( [( |; a( h! ?; W3 k+ I' D1 h& e% C% Z
{
% O$ P9 u+ r7 t3 M2 n  `3 \8 M1 l1 I9 H* }2 c
        continuous[id] = true;1 j3 p" C& z) U/ K* S4 O& F! ^

; W2 {2 c# t  _' ^6 e' b7 j}& I0 ~, X2 L! y9 [* U) d! ?4 g
2 ~% e8 x0 L4 G" [
function stopFade(id)
5 P! @( [3 E8 z0 _4 y# a* G# F8 d. @9 m$ t0 @# s; L
{+ a" k, Q2 F* y" s" y% x- Q

1 H! h# k2 o: W+ W" t2 K9 Q: P        continuous[id] = false;
" T  {( n* W, @6 X4 F
- R  x( |; U: F0 {2 j}
7 M& _. e* G: g4 O+ l/ y% N3 ]% |7 `6 y0 l" B- H+ Z
function StartTimers()
, m2 O4 ?1 B7 S, F; q% a$ [% w8 z
{        //set up an initial set of timers to start the shimmering effect/ T" n6 M8 V+ J1 ^6 E: I

5 K6 ^' l) {" J& g$ M( N4 e        for(id=0; id<numLinks; id++)2 I; e0 n  H  G8 Y. B5 @9 [

: p& |6 @$ n- L' f. ]" a        {/ O; w  W0 i7 a" T

, S/ @: Q$ q' X  W$ a                t=setTimeout('startFade(' + id + ')', id*100);
+ R- V! s- H9 U& B( ^) R) V! X, _; d3 {
        }! ]6 S; V1 {* g# \
) W  d" z/ P) u+ c+ d" {4 Z: }
}2 d0 U- P% H( |6 E

5 H% U  D: p- j3 K+ W//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')9 H' K. z( _  |
# A. L, V& W5 N
initLinks('#FF0000', 6, '#FFCC77');
' @7 j& c) Z4 `$ \. G: g
7 L" D- g% L' j//-->
% J0 `8 y$ R& c" N6 g
" }0 d- Z! x/ e3 @</script>/ X7 C3 r# z7 u, z  m8 m
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元! G. g( `! C& @) v0 r, N+ X
</a>
) I( Y4 ]9 q+ V8 Q; e% M  D2 C4 j- |<br>
. X6 ^9 _7 d# u! j, \. l<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>
: Q8 ]8 |! K3 O7 c<br>: a/ I% n5 @$ f6 W0 G
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
+ y6 Z/ t7 V1 Q<br>       
# C) C* F6 Z: f7 Q; I4 t% U<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>! ~3 y8 u0 E. M# z, [4 X. e  n
<br>
5 n0 ]; U, e% ?& V3 ^* w/ n- `( `<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>8 `& e. V- o2 E6 V, a# u
<br>( V  h* i0 O: H% _2 [0 e7 W
<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>& h- S2 }2 e2 m. X7 b- O
<script language="javascript" type="text/javascript">
! f# _6 f/ q2 `% W<!--
' }7 \: d) T$ K2 |9 ]# x' |) FsetTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering% D$ M# \; j  p
//-->
" W1 O& M7 n0 V, m- N</script>