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

zw2004

<script language="javascript" type="text/javascript">: s- Q3 E! m$ Z% d
<!--! c1 {5 |) H4 D7 ]
// convert a single digit (0 - 16) into hex: @( g0 j0 {6 c5 y1 W
function enHex(aDigit)6 z+ I/ x# Q+ f: m( M. W. I# M! E& S
{
# c0 r) q; N1 e8 F8 j  |+ z    return("0123456789ABCDEF".substring(aDigit, aDigit+1))
  c- J8 w7 V# D/ {}
5 b  s6 H4 i' Y6 [- H. ~: x+ k// convert a hex digit into decimal
; S% U/ y3 \4 dfunction deHex(aDigit)
8 J& `7 g1 Z* J; Z$ z4 m2 z{
6 W8 B9 a0 [6 }. Z) U0 F7 n    return("0123456789ABCDEF".indexOf(aDigit))
" `& N* d" [; R7 |4 g6 `}
; d% E6 i5 y; v/ T
6 Q/ t* Q8 g8 e" E// Convert a 24bit number to hex
0 \8 l  b& i, j- ~function toHex(n)
- h8 |* F* Y* }6 `$ h9 X8 m{
8 L% Q! G, ]2 G) \0 D5 F    return (enHex((0xf00000 & n) >> 20) +
& ~! @; @$ V# |9 d( }, O" x            enHex((0x0f0000 & n) >> 16) +
7 t- X( t1 }! ?" F            enHex((0x00f000 & n) >> 12) +7 X' z2 `6 y* i5 f- m
            enHex((0x000f00 & n) >>  8) +
2 U  p0 M1 C$ @1 ^- B0 |            enHex((0x0000f0 & n) >>  4) +: c# ~* E: u+ U. Y/ W) t6 g
            enHex((0x00000f & n) >>  0))
4 K0 o9 Y8 m" [' n6 D- k! P}1 P$ U6 Q8 W( _
// Convert a six character hex to decimal
+ I1 M4 ^* |3 }/ S, k( p6 Bfunction toDecimal(hexNum)
8 x2 n+ V6 ]2 t6 ?7 {4 t5 I. T{
, k( R, b$ o5 g0 B- w           var tmp = ""+hexNum.toUpperCase()
  v7 [2 R9 s2 H0 T5 F* w+ {( [; M    while (tmp.length < 6) tmp = "0"+tmp
) J, W1 R% k0 M) r- ^4 S7 Y; ~           return ((deHex(tmp.substring(0,1)) << 20) +
2 V0 v' l; K; |" U1 s1 Z                   (deHex(tmp.substring(1,2)) << 16) +
. y( u( E7 g5 i& U4 J            (deHex(tmp.substring(2,3)) << 12) +7 W! f6 H' ]- \' I) C6 o
            (deHex(tmp.substring(3,4)) << 8) +. s1 v* i7 w& R# K5 b5 D; ?4 F; i
            (deHex(tmp.substring(4,5)) << 4) +7 `, `6 w4 P  {% ^! u6 U; i! Q3 u' X
                   (deHex(tmp.substring(5,6))))
; L1 I" q  z) f9 @, [}6 ?) N7 T8 o2 f, ], p6 g6 J: o& ?
///////////////////Shimmering Links/////////////////////1 D1 ^0 k4 ]2 x1 K5 A$ z/ Q
//global variables  r5 E5 E2 T3 w3 p  A$ _1 X# B
var hoverColour
- y# G5 A  l, _, D/ |9 X) zvar numLinks;& I  Y: `0 t" Q0 [' N/ `
var rate;
1 W' x2 g- T: N6 X5 lvar numFadeLevels;+ m+ V  L; V& [& t5 ]- y: N9 B! J
var bgR;
: @2 c  f/ K/ @var bgG;
  }+ ?$ e. E; s3 nvar bgB;: `0 n9 p2 D$ W9 @; k
var currR;
1 e4 j) b  |) n% P0 N5 _var currG;. T" n. {; |" a: I# W% q
var currB;( g0 p5 `- I, ^: @; c
var count;
% f3 ^" d' ^, [var fadeOut;
/ U1 A" Q3 _  |& v  g7 r3 M' _var continuous;' Z6 q3 l5 H0 S8 ?2 h5 u8 n$ T
var newColour;1 ?' f" S: f6 {6 Y! a! @
var tID;- v: V! @% e( Z) u6 X
var redInterval;# C4 h# J2 J; T6 f
var greenInterval;
0 d& b$ E6 m5 e# g( Y4 {8 Hvar blueInterval;7 v/ u5 Q3 r" f9 [; l: a3 p/ x
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)- i' E1 @6 i; E! ^  e1 m5 d
{
9 [! \) i' D4 }1 m/ E, _/ j9 o        hoverColour = mouseOverColour;
; H# p0 z+ p7 v4 x+ n2 [        numLinks = numberOfLinks;6 B/ b; [1 a8 q$ t" c
        rate = 1;
  W, N# y; m$ ~        numFadeLevels = 30;8 I# N( c# [. M  n5 `& F. _, T
        function initArray(theArray, length, val)9 }0 p" h/ ?2 y: I  s, }
        {
! v; j/ A3 R. [& U                for(i=0;i<length;i++)
9 S2 E. g& g5 P" e                {( J0 ], O, d7 j- }' H8 k+ r/ N
                        theArray = val;
1 y( F0 z! |" u4 b0 V0 @0 ^                }
  {0 g* ], Z/ @: u7 K3 n5 E        }
( Z6 `" o% @/ w        bgR = '0000' + fadeOutColour.substring(1,3)
* L2 y5 S3 a& n- j  `        bgG = '0000' + fadeOutColour.substring(3,5)1 e' c$ h( y$ X4 R7 `1 S
        bgB = '0000' + fadeOutColour.substring(5,7)
1 V- f8 v5 g# Z6 G' g& P: h        currR = new Array(numLinks);3 ~3 a: Q( |' Y0 K
        currG = new Array(numLinks);9 r0 v* k" k3 _' `, o
        currB = new Array(numLinks);
# i- _( }+ d; l; _        count = new Array(numLinks);2 P3 H& U6 e( \  O9 W) \2 w
        fadeOut = new Array(numLinks);
6 x+ v8 |: M: Q" x. b        continuous = new Array(numLinks);
! k- y: y) h* v5 ]! u. R7 Q1 ?        newColour = new Array(numLinks);
! o8 d& w/ Q2 P  {        tID = new Array(numLinks);
2 p+ {, L2 J- G& H9 h0 X; e. |0 T        redInterval = toDecimal(bgR) / numFadeLevels;  D* G$ X8 F  [' f2 F
        greenInterval = toDecimal(bgG) / numFadeLevels;, J* _8 Z) |- q% N5 i
        blueInterval = toDecimal(bgB) / numFadeLevels;: T: c. s' h8 e" \/ @1 k2 D
        initArray(currR,numLinks,0);
' t7 A( u2 o. Y5 X7 o) u4 K" ?5 f        initArray(currG,numLinks,0);  o: U8 K  d) t8 {7 p2 E/ t0 n
        initArray(currB,numLinks,0);; i( S$ G6 W0 Q+ N4 D) d
        initArray(count,numLinks,0);7 `8 z4 N% ~8 H/ h2 d$ G
        initArray(fadeOut,numLinks,true);
3 M' Y1 m/ a/ R* a$ K        initArray(continuous,numLinks,true);  g8 v) Y# m9 ~" y4 w8 U
}        $ g& `& L& u  O* Q- t* k5 C/ g; M
function startFade(id)5 I# K8 `' a! q! p0 G* ^! W
{
9 D5 Z: Z6 \. I! o" z        if(fadeOut[id] == true)/ V, k7 d) X' ]
        { /*move colour towards background colour (increment)*/" D  s% S: x- u2 i  @1 U
                currR[id] += redInterval;
/ [0 R1 L& `9 J* q& L                currG[id] += greenInterval;: Y; Y& B0 I. O) |' G2 d- b' i
                currB[id] += blueInterval;# U7 Z  }+ d7 J" a
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);. S% \- V, h6 \, W& m: _
                if(++count[id] == numFadeLevels)
6 g0 E8 G  a) n! S  @                {2 M: \  u% ]+ j% W
                        fadeOut[id] = false;
. A9 b0 w7 c7 H; R/ k                }1 z' {4 c; l/ r0 H5 \
        }
& Z1 z* r: w2 _9 J$ r& s        else; Z* B* \4 T7 ]4 i- M
        {* |4 O6 a1 U# c5 i$ a( @
                currR[id] -= redInterval;) L0 }4 L+ F( [& t
+ Q) C( _8 t- k0 D& [
                currG[id] -= greenInterval;( {, ]: x; p  @4 p' i# L8 |# v. A

8 w) j" m4 {) t                currB[id] -= blueInterval;
# T5 B; H: ~6 F3 ~$ g# h9 W! K! ~
( e( O% ~1 A8 w                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);" p- Q9 H# Z# a
' b4 |  B' ~# J6 P1 k9 X
                if(--count[id] == 0)
6 |) [' e- v. ~0 R3 C6 ~# Y' a% a4 ^
                {* ^1 l8 p5 |2 x- j/ g

  \4 f7 {- P3 F" }; L" i                        fadeOut[id] = true;
4 V2 d: Y, U% s9 f; K/ p0 _: Y. u/ m+ q2 R  F0 r
                }+ C; `1 l7 Q/ _& u
: W" M0 b  s( w6 R2 }4 U
        }" N* v: k0 `4 ^) h

( o8 @5 z+ H- c' _" U        if(continuous[id] == true)
- C9 w! k9 Q1 p5 g" V6 O& e* R* D2 r
        {
; e0 `) {4 x. q8 D1 e  P+ _. q
                document.getElementById(id).style.color = newColour[id];               
- X, E- k/ {  G/ O# b( ?1 \" R- B# [* X1 V. I* J/ N" P$ b" L
        }& P$ C& `5 @9 J7 R% K
; ]5 g* M0 w0 t( j' ^, y
        else$ M5 k0 r2 m: V/ `- W* s

/ {$ ]- x1 ^$ z( x  t9 w        {( ]3 \6 t5 i/ A7 N
* d2 k: Z( {+ R
                document.getElementById(id).style.color = hoverColour;: \7 j9 x# o+ L6 T) F+ Y

: B& p( C# S6 U: E% m, f* x# T        }, E7 q$ I' ]0 l

# F% l; `4 p$ u) @* i* D2 @( K        clearTimeout(tID[id]);6 J; g2 R. Z  C% F+ y3 R% K

% g' n0 v  J+ r2 K        tID[id]=setTimeout('startFade(' + id + ')', rate);
- V8 R$ O- K! P/ v
5 e9 ~' u2 I% V$ A  ], B7 M}
+ i. H8 i4 M0 ]' o& q. C7 U, Z: C3 c! ?$ H
function continueFade(id); y9 B4 p$ o+ E; t

2 j7 E7 U7 T  G5 x, c{
0 R% F2 i% o) E. T4 J) t
9 K9 G' z3 P& }6 d* ?7 P        continuous[id] = true;  G+ u* A6 E  s7 m6 {  G

3 M& v# R/ j3 n1 d- h}- m9 @& ]& D5 Q7 O; w0 X4 [

, R# ]6 `$ b9 ~' Mfunction stopFade(id)
* P  _- Q2 X. y0 F0 s: a$ l3 X( t; T' O. f, r3 s
{
4 S& j6 d- Y! G! b$ b
+ G, Y* a* O) d- z6 G        continuous[id] = false;
' ~0 t, v8 Y# t# T( O: g. p9 ]& U6 {2 A- G: y" }
}5 e7 {/ W5 r; ^8 e
" W/ k1 O5 p- h2 S& y
function StartTimers(). A) ?# t, A7 \0 V
1 q- ~0 X. D2 w1 ?/ r
{        //set up an initial set of timers to start the shimmering effect
% c. I4 B6 Y5 O6 J6 k" U0 D5 z! ]6 y) Q
        for(id=0; id<numLinks; id++)
) G" B5 v0 Z' ]8 w- M0 H2 N& |8 T, k) h
        {6 C0 d$ S& X8 U8 y* V
- i- C$ V1 }2 P7 m
                t=setTimeout('startFade(' + id + ')', id*100);9 F9 A# d3 w6 K) ~5 D* `7 p4 C1 n
& N7 d2 I6 `0 i: q
        }
# u- V2 W, h& c$ N* [- z! P: q' M/ G8 \2 N
}
% Q4 X; h, {( S) Z5 E' z8 l; C. v6 W9 I& d4 c/ O$ j1 G
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
/ c  _1 O0 w" d& G5 U. s" z" {% g2 _2 e3 Y5 E
initLinks('#FF0000', 6, '#FFCC77');
6 c; U5 g& F6 F- l; |
/ V2 v' B. ?# D//-->  V9 a% l. g$ D& ^
, I0 A' f8 u3 Z# h; i% }
</script>, l. v) n; H  }7 t" s/ i
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元
! Z( F# o1 @2 a. D3 B8 \1 \; m</a>6 B0 ^3 [1 g1 c! q
<br>
' P  T- I+ L" M' K" H$ ]<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>
) R4 i% u/ S. }* d* Y# ?<br>2 @3 r$ q$ H$ h) O
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
1 _$ t8 w# y- `3 x. H' [<br>        $ r  Z6 R  N5 h3 a. p
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
! x' `9 j! J! D<br>. V# c; g) r1 J0 R+ n# ^
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>' F7 v1 v4 l8 X( W. F2 n
<br>
1 l# X* {$ R5 {% G" g; e<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>9 @  f4 q" c. a& U" A: W( _
<script language="javascript" type="text/javascript"># ~8 r4 J0 h1 u4 H% {  a
<!--
' e, X2 m+ ~7 T8 OsetTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering' }, ~. n- ~. F8 E0 }4 ~0 O4 S
//-->; z4 E" x/ M# `- v3 E" [. U9 ^5 o
</script>