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

zw2004

<script language="javascript" type="text/javascript">! {: O$ F& n7 C  {) l* y
<!--+ q; }% m! _4 @, e
// convert a single digit (0 - 16) into hex
& }- H( \5 ?4 F# V$ h+ O2 d0 efunction enHex(aDigit)" \, b. i2 s9 M8 M
{1 p+ @# t, {" m7 t
    return("0123456789ABCDEF".substring(aDigit, aDigit+1))
; [' I  q+ K  V/ r/ I( S}, P4 X+ P% O0 D/ O0 T4 b. ^+ m0 b6 g
// convert a hex digit into decimal
. v% Q& s  u1 r$ U8 N. k& Efunction deHex(aDigit)
7 s( n$ q* R0 t" W{" D% u6 T' U. B0 Q: I6 C' ?
    return("0123456789ABCDEF".indexOf(aDigit))
4 ~" W, H6 h3 B3 s# ~}9 {1 p! B/ D8 `6 m

7 }4 \* f) j1 Y, w// Convert a 24bit number to hex
' d+ t% |, M0 |% Z: ?function toHex(n)
+ R6 N) h/ J: }# J) K/ o/ e{5 Z! u# G+ ^5 y2 y0 ~
    return (enHex((0xf00000 & n) >> 20) +' @+ M; D: O; `# ^
            enHex((0x0f0000 & n) >> 16) +
8 c, F! b& |! H2 m            enHex((0x00f000 & n) >> 12) +
% c9 w  g2 j& a  X* H: u            enHex((0x000f00 & n) >>  8) +. x0 X' [4 s, a8 R( c8 Q
            enHex((0x0000f0 & n) >>  4) +2 u3 u- G, r+ s
            enHex((0x00000f & n) >>  0))
9 j; x! w7 g1 l  `4 L) `+ Z% O}" p9 w* T( D0 [' L2 e5 d1 d
// Convert a six character hex to decimal1 Z% Y5 J$ [% q4 Y' a6 g- k
function toDecimal(hexNum)6 M) d0 J3 U5 Q4 [! a# f
{! t+ d: d! ~2 s
           var tmp = ""+hexNum.toUpperCase()1 P% v) h0 a& l2 q! E  F% S6 ?
    while (tmp.length < 6) tmp = "0"+tmp: w% r* K  t' z
           return ((deHex(tmp.substring(0,1)) << 20) +) O0 T1 `: ?% ?; R/ V" B1 u/ _
                   (deHex(tmp.substring(1,2)) << 16) +
! R8 z4 v& E2 M4 D: \9 E+ B            (deHex(tmp.substring(2,3)) << 12) +3 x& z2 F6 C7 `0 A5 H+ \
            (deHex(tmp.substring(3,4)) << 8) +' r7 P5 W/ |1 t
            (deHex(tmp.substring(4,5)) << 4) +
5 Y! R0 d8 ]: s. {- ]                   (deHex(tmp.substring(5,6))))& I6 }4 [: f( r9 v" x/ z
}
' P" L& B7 C: b" A8 j; J///////////////////Shimmering Links/////////////////////
4 U* n9 y8 o3 U! m//global variables0 U# O7 d6 N; t/ X5 e* q
var hoverColour
6 M) k3 b/ Y. fvar numLinks;
) L! l; m0 q3 p+ {' _( tvar rate;+ R9 ?0 N2 a* U+ v% ]; ~
var numFadeLevels;+ T% \3 E/ k0 z+ t
var bgR;1 K2 ]) H  c3 ?3 y  [
var bgG;
4 X2 d6 }: z) K- i% n0 Yvar bgB;
5 `6 n$ Y2 g& Y: D& O* l4 k6 Rvar currR;: _2 k" e: e6 t& X' f, L
var currG;. W# u* |5 @" E7 \* U# U% o* z
var currB;
4 m8 [6 }( N& s% J: N$ R# }var count;
( t: J; C/ u5 t9 g# rvar fadeOut;
* b# g% {/ D; l0 ]; S. Bvar continuous;( a7 y% {' [& @: x" {  r3 r2 u' Y
var newColour;
7 T% V! t' d2 j0 N' Ovar tID;
# M4 T+ D7 Y' q  C% O+ D: yvar redInterval;
: a  X+ j" S& A( }) [9 ~, ]var greenInterval;; b* i) Y  X# U6 k. H  q# W( S, M
var blueInterval;
5 r( q# K$ N3 N; I1 O4 o9 {6 V5 ffunction initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
+ \3 J- D) \1 n5 M3 T{* D% k  T  s: {* ~* l' y
        hoverColour = mouseOverColour;
$ Y5 H2 B- H" n! Q  A8 {        numLinks = numberOfLinks;
# J' l/ @1 ^$ v, u( O" X        rate = 1;
7 \9 K- Z9 f  b. Z1 Y        numFadeLevels = 30;! A. e& l, G9 g9 Y1 ~! E; c& h
        function initArray(theArray, length, val)# w' A4 c5 N( H! h* W
        {, E- T, H& Y+ {+ I
                for(i=0;i<length;i++)
3 ?# W& X* {$ F: O4 o                {
4 y. t7 ]+ F" P  @                        theArray = val;
6 \. k: D) `  M: k# o                }
6 w- W. W7 A1 T( y# Y        }
0 S0 ?2 D# e; l! v( {* I" k        bgR = '0000' + fadeOutColour.substring(1,3)$ y# m# B. j+ r7 S9 Y
        bgG = '0000' + fadeOutColour.substring(3,5)
$ ~( o7 M" d/ U! M" [5 Z+ Y( @* F        bgB = '0000' + fadeOutColour.substring(5,7)
9 ^5 r1 [8 J/ r; u) ~        currR = new Array(numLinks);
* u6 w, S- ]3 a% P5 g) m        currG = new Array(numLinks);
; I3 \# f. J/ |/ @$ f* |& M/ t/ O        currB = new Array(numLinks);
) }+ g8 `: A7 J: f/ V1 }        count = new Array(numLinks);0 M" ]; [; W: K/ z0 [
        fadeOut = new Array(numLinks);0 Z0 l* b+ U& F1 L- D+ P
        continuous = new Array(numLinks);
' e. ^+ g: t9 a6 z* ^: |        newColour = new Array(numLinks);, a( `- B$ t8 t+ s6 S
        tID = new Array(numLinks);& o! P) j# d. n/ z# Q" l
        redInterval = toDecimal(bgR) / numFadeLevels;
5 U& a) E0 L: G$ f4 r1 A$ q        greenInterval = toDecimal(bgG) / numFadeLevels;
, f/ O1 h7 e7 D. x- Q        blueInterval = toDecimal(bgB) / numFadeLevels;
9 q% w1 J; }6 v        initArray(currR,numLinks,0);
8 j: U' k3 v/ d, ]* i        initArray(currG,numLinks,0);) M' B- P0 a6 g9 t: h
        initArray(currB,numLinks,0);
6 ?7 x. ?; I3 L        initArray(count,numLinks,0);; J7 J, \6 U. x* z
        initArray(fadeOut,numLinks,true);
) m) t2 H/ u: L+ C        initArray(continuous,numLinks,true);
& t0 C8 D/ k+ v. _/ X$ X}       
8 Q; n: L& Z3 N( x: n6 Lfunction startFade(id)( }/ b8 L  N6 X  I/ Q8 U
{
" G! a- B2 M7 X; l        if(fadeOut[id] == true)1 G4 ]$ s; X: g( G
        { /*move colour towards background colour (increment)*/
% O6 p( d  |, @% N( |1 }8 N                currR[id] += redInterval;  q7 W+ E- c# m, g) s
                currG[id] += greenInterval;
0 M! Y- [! r: \( P" K. E' O0 B                currB[id] += blueInterval;
: K! |$ P8 z/ n& ^" t                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
' |, l" V; h2 ~; D. s                if(++count[id] == numFadeLevels)
9 K1 Q7 c, y3 [' c& G                {
/ H, v/ s* X5 Z" L" V5 F* D                        fadeOut[id] = false;; M7 i/ I" A- Z( c
                }- e$ }5 f. I" i7 m
        }0 x5 p6 F5 v/ S& P2 r# J( I
        else- g  j; B6 i7 v3 t. z/ J
        {& x& Q' I% M; Y% Y) S- x3 }" y
                currR[id] -= redInterval;
+ x3 B, @6 n) _, m* ?/ _, N+ [& F
                currG[id] -= greenInterval;
1 w; y% n; Q5 K" P* @. ]7 l7 j' B5 s! p  ~- f2 q$ c
                currB[id] -= blueInterval;
$ s" ~3 g. D' w( Y# X5 @! {- C! a
" ]. j( C+ ]9 S: V' Y! m: z                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);$ z- |) h0 \, K9 e" `

4 F1 s+ @$ P. Z+ G! y6 `! }4 D                if(--count[id] == 0); e! F0 ~/ f( t- z/ C! o" n
  ?7 Z0 F2 e, V$ E( ^6 R7 _% {
                {+ v9 T1 ^8 {9 h/ W( D5 G$ K$ y

6 i# K1 f( q  D3 h* V# j3 ]+ E( Y* n                        fadeOut[id] = true;- c( F) o- g  r/ G

+ h; k' x+ U. ~8 u( Y0 ~6 G0 z+ e! ]                }
: `1 Y0 V/ ^* i" ]( o- D) `6 ]* ~, ~/ T- e0 f& C" q
        }
4 z: h2 X0 R! ~) l+ F+ b. F* e# ]" |6 A/ ^, ]& `: q  ?; u
        if(continuous[id] == true)0 Z* [; w$ {) q# \9 R

) `. k/ s* x* _) O        {
4 H  [, `( @; J3 l. W
$ t1 g3 s/ A+ \3 u4 [4 d% B7 C8 W1 f  L                document.getElementById(id).style.color = newColour[id];                / g0 u) O4 m& u0 n$ s; h8 N
0 w( ~' C" ]: O* u0 d- U& n( `5 l; m
        }
" [- u6 \/ ]' ~9 E
5 u. i1 K- g# x        else
. a0 A6 o7 l3 }' l. {0 O
  ]5 m4 N5 X  A. l8 e6 w        {9 z' s2 d& O% t) M) U' Z" M! e# h$ k

7 p( [/ s9 G5 g0 h                document.getElementById(id).style.color = hoverColour;, Y) W% L" |" }' U$ g

/ ]8 d# S; _) J        }
2 q' z* ~2 _7 {
+ }# W* I, u( k        clearTimeout(tID[id]);( R5 x$ k9 z8 U7 j( n+ F

5 Y  R9 {( Y+ d5 T; g% b" R) J        tID[id]=setTimeout('startFade(' + id + ')', rate);
; J, |5 I4 u1 ?  G# B
- j2 K9 f4 u3 e# O}9 {5 U$ w2 @$ c: o/ A/ Z
3 S2 r1 y; |$ @. o2 q" o: ?7 G
function continueFade(id)) Q1 X4 C5 w5 n6 g, Q* U
+ c( {: R1 W& B$ x6 D
{
; W4 s/ X! s$ o' m' F
- N. W; M! I/ L3 D; g        continuous[id] = true;
7 Y+ U, m/ j# R+ K# |1 t; h/ N; y1 A
}6 Q5 M5 _; v. Q- y8 ^0 y0 [6 U; B

" t6 Y6 t/ p: S' J  k( _function stopFade(id)9 X! C) @/ V# @1 X2 a
+ V! V7 E1 G  f' D8 l" X
{
8 Y$ M5 A+ \+ E. j# w) O, d
; E" G0 @8 P" }% c        continuous[id] = false;7 {" `! I' R. f! B. U: l& V* Q
/ W" p1 j! D5 j5 A! ~/ a5 F
}0 \0 @) M% ^7 {4 J3 F0 d" H
0 n3 F& [: I; {# `% l
function StartTimers()
' o4 Y" Q. T! Z5 O% Q& v6 f. \) i0 `+ Z- i8 `& Q: p3 W
{        //set up an initial set of timers to start the shimmering effect7 h6 f% l4 z  N9 a

% p' f9 R6 C0 [" _' I        for(id=0; id<numLinks; id++)2 ?" g  U& r9 k  [+ p3 S' k$ g1 n3 ^

4 C$ W! y& i1 T( `+ `$ h  W% f% C7 ]* J        {
& q% N! n& T# A
( V. ~, A+ f: e) [                t=setTimeout('startFade(' + id + ')', id*100);/ i6 l3 U$ y: y7 [
$ {. `& e% M  H+ V
        }7 }1 [( y( {% ~* ^, a  ^  o5 s4 H
" `* E# ~' `* }" B3 X$ }) k
}
0 Z2 ]7 j6 C- s) Z3 Q- D  Z4 c* U4 ?2 l4 ~9 _9 L) x
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
: Y% A+ ^# j3 q( A& R
/ F) W3 H* G6 D9 zinitLinks('#FF0000', 6, '#FFCC77');
) S" _) m) |) e) y: i2 O
, b: J) v+ G# E5 x//-->0 b6 z) N5 M, f* z# Y4 `
' x2 \0 Y/ p# ]0 o2 h- I) G
</script>
) |2 f1 O+ h; S3 l( {<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元
& x% E: R; f# j) h$ z</a>
4 {( K, x( h# L( w6 ?( G<br>8 X% q0 X" H9 U
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>
9 p8 p  \; G+ q; O0 H<br>0 y9 ~0 d  O& F/ _
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>5 v  ?( o' d4 u9 ]; R% @
<br>       
( b; C8 i1 F" Z% y: |<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
6 r& e  k3 @1 u2 A<br>
- A- ?6 O8 B6 k. B: S6 i; h$ l<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>2 q2 n! y! R$ o: O( V
<br>( k: x, @7 I( n6 t
<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>
* u6 q% T4 S& g0 q! L<script language="javascript" type="text/javascript">& ~# @; l' b5 U$ S4 y3 S
<!--7 E8 k4 t" e0 e% D6 B& C
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering3 T0 z0 R" k2 ^0 b. ^$ M
//-->5 z9 l. }/ d6 Z3 Z8 i' Z
</script>