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

zw2004

<script language="javascript" type="text/javascript">
8 j# l2 N* {  |6 Y, z  B+ P; {  w/ A<!--6 L4 {3 U) p/ P. i% |- t) L
// convert a single digit (0 - 16) into hex$ D7 U$ a$ A# f
function enHex(aDigit)
. p  X# q7 d# X5 `{
4 V( n- P3 C- h1 R/ o) i    return("0123456789ABCDEF".substring(aDigit, aDigit+1))4 p4 l* I7 \6 K
}) T  E. p  M3 y6 c- f" _
// convert a hex digit into decimal! \2 K4 Y8 H. U
function deHex(aDigit)$ V. T# d6 s$ x% ^0 C2 l
{% s! G: H9 |4 w- j7 ?1 o# v3 J
    return("0123456789ABCDEF".indexOf(aDigit))
! x4 T9 k4 l- S% m  s}
! R- @7 N" L# _- M$ Y# j
! U$ }2 e7 U4 F// Convert a 24bit number to hex% m0 o3 K5 }% a; W8 G6 U# C
function toHex(n)8 w& K5 \6 ~2 F5 s1 n
{
9 @6 h9 c; I  S  I1 \    return (enHex((0xf00000 & n) >> 20) +' {; y2 ~$ w3 k4 L! \4 X
            enHex((0x0f0000 & n) >> 16) +
; g3 H$ c* h3 u5 @- v            enHex((0x00f000 & n) >> 12) +1 J7 a( e  U: {0 O
            enHex((0x000f00 & n) >>  8) +
+ @- S9 i; b3 U8 t            enHex((0x0000f0 & n) >>  4) +
$ H& r9 n% i- \6 J) D( g+ Y1 {, T            enHex((0x00000f & n) >>  0))# O1 ]( S* U2 ?
}4 {0 ], l, j" H1 ^6 z0 ^
// Convert a six character hex to decimal
. D8 z# J6 n, e& @. o9 afunction toDecimal(hexNum)0 n  |- B& d: w( Z8 H- f. s+ u/ E" @- E5 S
{2 |; S- [8 A. D2 m. M: D) Q; y3 b2 `
           var tmp = ""+hexNum.toUpperCase()
% I# a1 L  R- h6 D# K6 M  F    while (tmp.length < 6) tmp = "0"+tmp
: Z% t/ l9 i8 i3 U# W( j' d# t9 H           return ((deHex(tmp.substring(0,1)) << 20) +5 M9 f$ a: s/ t4 P! o
                   (deHex(tmp.substring(1,2)) << 16) +
& _' ]7 w, P5 s& Q. A            (deHex(tmp.substring(2,3)) << 12) +' K( `' ?4 E4 M1 M% U
            (deHex(tmp.substring(3,4)) << 8) +9 A" Z% O1 j) c* o
            (deHex(tmp.substring(4,5)) << 4) +
, f8 z8 U3 v2 E( h8 B) I5 S9 w* b                   (deHex(tmp.substring(5,6))))
" C& d6 o* p6 Z! D4 }, ?}4 {3 m% _$ |" O
///////////////////Shimmering Links/////////////////////% v/ b2 \' ^$ P. u" b4 ]
//global variables: N* R* g7 o* ~3 I" u
var hoverColour
' J+ y$ X: ?! e) T+ F8 _( W% F* ivar numLinks;8 `8 d  |. B6 S6 K* S
var rate;
( \' q2 q- Z( s' Q8 ~' ?7 vvar numFadeLevels;
6 f' M8 _9 t) W( V0 _var bgR;7 x+ T* P$ L, ?! J
var bgG;0 Z# Z- Y7 C; l7 A& b
var bgB;
8 B5 r$ v- ^& gvar currR;
- d) p5 H. g1 o- w, \var currG;- B0 |: M$ f, [8 E1 U; `5 V& e, l
var currB;+ i9 k$ u6 |/ ^- x" o$ M
var count;8 G- b$ f; M. g' {! d2 U
var fadeOut;5 L7 n0 I6 u/ |8 x& y) D7 `
var continuous;0 K% N* f, I; C  ?" c, I/ M
var newColour;
" g/ w! [3 w4 o6 X  |. Z: ~var tID;( @7 y2 a( B6 O; x) z
var redInterval;( m9 e% Q6 B; R, w( Y5 |2 a9 q, R
var greenInterval;
" u4 Q* s9 O3 N9 dvar blueInterval;+ z# {5 K( r" P  {" P( ^6 y+ X
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
  P- O* `- p4 Z& s{
  n+ L; M+ b2 _  [        hoverColour = mouseOverColour;
/ g' y4 _" D! s* T& X        numLinks = numberOfLinks;
; P9 c& L; M( n' ^$ |        rate = 1;: v$ \9 g9 K4 t; J% f
        numFadeLevels = 30;
# h/ ?! G: ?0 w& |+ H        function initArray(theArray, length, val)
; T( z& L; o! i8 @        {
& y+ S9 N2 ]8 {+ d. w+ s/ \                for(i=0;i<length;i++)
6 |' D- H" R1 W                {& O2 Y( t" b6 A, [" q' V
                        theArray = val;: i' }  w2 W, B7 V4 s; [
                }
+ s9 _/ T: k! x) d7 L, k4 R, q        }! H: |8 c! C% X# v/ A! M
        bgR = '0000' + fadeOutColour.substring(1,3), w  z1 d! R3 N- n; v
        bgG = '0000' + fadeOutColour.substring(3,5)' A: r& D; f& X* t
        bgB = '0000' + fadeOutColour.substring(5,7)
( X; J: q2 g! s0 x) y. y& l# X        currR = new Array(numLinks);$ ~' D0 y4 Z; x5 }# b+ m! }3 S
        currG = new Array(numLinks);
# a8 a. d, w5 {4 r/ R7 K        currB = new Array(numLinks);
2 d& ^# U5 a  q& f$ @$ w) J        count = new Array(numLinks);% ^1 l  C8 V4 ^) ~
        fadeOut = new Array(numLinks);# N8 O3 m: T! K3 F
        continuous = new Array(numLinks);5 \" }1 \* [% E( U8 j& n& y4 ~5 g
        newColour = new Array(numLinks);
  i- @1 b1 p; ?. A! W  O        tID = new Array(numLinks);8 \9 l  n( j  _+ K1 ]
        redInterval = toDecimal(bgR) / numFadeLevels;+ _3 y0 t% n+ }- n: r5 f( L8 [2 J
        greenInterval = toDecimal(bgG) / numFadeLevels;
# o! C% A' \  u/ k& V  r        blueInterval = toDecimal(bgB) / numFadeLevels;
; ^$ M. Y/ s  j3 K8 l        initArray(currR,numLinks,0);& y% W  x% z7 S/ _5 }
        initArray(currG,numLinks,0);
' H6 C) V/ M. @% C        initArray(currB,numLinks,0);- w  s# |9 m- c% m4 V% G) t: Z
        initArray(count,numLinks,0);
  C+ X; m3 N  b5 O) u        initArray(fadeOut,numLinks,true);
* w0 i' b$ o' O7 @1 t, g- k4 }        initArray(continuous,numLinks,true);
' z& _4 f# ?. \0 t}        7 c$ b( _; p( ~( x
function startFade(id)
0 f5 y, T- k  L{( C. h' ]$ C) V: v
        if(fadeOut[id] == true)
6 j5 g7 ~8 ^$ i' [9 t        { /*move colour towards background colour (increment)*/& n# a2 k9 p- m1 A* q, ?
                currR[id] += redInterval;
  ~7 m/ R0 l( O/ d% a8 \                currG[id] += greenInterval;7 c+ r- |, T/ k/ y' o8 t' k
                currB[id] += blueInterval;
6 r+ U# M4 e8 J& d" [+ x: ?, }. d                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
& c4 J8 C- a- t4 ~; m                if(++count[id] == numFadeLevels)
6 n8 V5 ?* R& m- q                {
  E8 h+ H3 L. }' \8 J' i+ w: j+ [                        fadeOut[id] = false;( |/ w! T! |6 h! u% d1 {
                }
, }! Y4 E; L+ g' C( x  z8 _        }" u1 u1 Q9 v! f4 x9 I6 z
        else( z7 \3 |/ H$ K+ Y" e) U
        {
7 W7 d" ?) R- M                currR[id] -= redInterval;
  L3 B. E; ^; f5 b2 X7 t' {& ]# o! }$ ]
                currG[id] -= greenInterval;
9 x$ r8 X) B+ _9 F' S4 R/ p4 h9 c* H. W
                currB[id] -= blueInterval;. G& `! O# q# K6 l: T7 I* K, _
, n# t8 i( x5 K
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
3 W; O. `! s+ d/ {, R# f) y6 r, k4 s7 L6 @3 \8 q! g
                if(--count[id] == 0)4 [! t% }% y9 L
+ J) w( N6 E( z, i4 e
                {4 @5 B1 s% Z5 r4 V" Y( \7 K

% O5 U& }/ H; U5 Q8 i7 J  p                        fadeOut[id] = true;
. e) n+ F) U3 u- w' d3 n+ ?$ U+ l+ f8 |/ c8 o% F( O
                }6 ?: @8 ]& I; [7 H% U! q/ M

4 j* V4 X. M, y) p8 h% H  Z; T        }$ w4 Y( @: Y, k% T. e) _, S+ S

. P: q. w3 A! Z        if(continuous[id] == true)
; s' d8 t6 x! C; ~. v% _8 t! Y5 F! @  q
        {
' ^' ~! V2 P& ^7 H
7 `( s; S- Z3 _- g% f. D1 m                document.getElementById(id).style.color = newColour[id];                , ^7 k& u, M$ q- }2 \. G

% K1 Z7 T: k; K4 a! t7 u5 r; L        }
: ]2 M3 b! Z: s/ a$ X5 j' N: R3 g) t7 S1 r
        else
9 V2 W% }% {. j7 A2 R( |7 B  Q9 R; c6 S8 v" P! @
        {
4 t3 |3 D4 @  u, `1 e" a, m/ b6 L2 i2 ?( S
                document.getElementById(id).style.color = hoverColour;4 [& [- n( X( j$ d
3 h# I$ z; b' L: @" J; l$ S; b6 i
        }& ]1 w5 N- ]6 E

. p! m2 ~" i: k$ r( V        clearTimeout(tID[id]);" |% f8 d. }- T. r; n; R% i

/ P: k/ [% \$ g. l$ E# p+ z        tID[id]=setTimeout('startFade(' + id + ')', rate);% X8 S9 @  c$ x; {
% n' P8 e, D  i5 f
}. g- m* D! c* m6 t  N+ A
) `' h  K/ D8 n4 W8 o
function continueFade(id)6 J7 Q0 Y% i0 v  p- c

/ W! j6 M5 \" `4 h* B{) |8 }, M0 z+ C* ?

  j# V/ U, j$ q9 {/ j1 i        continuous[id] = true;
8 {6 c% i6 k  q( Y
2 G& A9 j: B) F: M# i: _% }% j}
: {% ~: ~3 {: v, Q" @# Q
" p% X. A0 _: \" Z8 X1 \& cfunction stopFade(id)
( Q3 m& e0 _$ k6 H: N) p, a( c
2 q3 Y  R7 E; }{# W3 E$ H2 x3 J7 D. V

1 n4 e" S7 }% q  ]        continuous[id] = false;
0 i/ g( i+ l/ p) K( j: {6 {- w" B# z: M* H5 L
}( j) u( p6 n, V1 j6 r/ T
* U" D0 N1 T4 v+ r2 h% V
function StartTimers()1 ~1 @6 _' v: J+ I3 P0 W' ^
* E4 w- {" [9 T% j- ]
{        //set up an initial set of timers to start the shimmering effect; ]+ L' F% g' v' P& y/ b

/ B  I0 j- ^4 x        for(id=0; id<numLinks; id++)
2 `$ T2 J5 K( w+ @% Q' j
; ~3 @. z: B+ Q" \        {8 @& V4 B8 t4 a% R+ W/ k' o
8 @. Z% s, G5 x: W
                t=setTimeout('startFade(' + id + ')', id*100);/ z9 b! Z  p9 @" G6 E6 @
  Y! y5 i0 l' p6 \4 h
        }
. I0 E9 z; u6 S, i3 @0 k9 Q# n9 Z# q+ l# I& M# n% n
}3 H& M8 V( I7 s  F0 y

! w1 m8 C/ W, J//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
; \: _5 ?' L3 \) m+ B9 X: s( w# x+ n. ]
initLinks('#FF0000', 6, '#FFCC77');
: L& d! e6 H2 B1 r6 N
# ^  G  u' `7 @+ |! r7 Z//-->
/ Y- h, k" F. I* Q0 j& b- m6 ?5 p% V0 M( z0 a
</script>
0 Z" r" l4 p# A0 w" z<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元6 ~: t( O9 W5 S
</a>
4 I% ~0 u, r2 Z4 {( K# [: ?7 p<br>
" a# @! X% X3 L<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>* w1 U2 d) R( e" G
<br>" N- _0 W0 v( R1 [' h
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>: s+ L( T, `2 D& X9 x* s* J
<br>        + `* J4 h( s! o
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>. t: N* t9 a3 K! F: v  v7 D
<br>
  n7 Q( X0 T& w6 y2 E9 W/ P. Q8 o0 T<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
( G* Z2 S; p( C: X7 f<br>9 i' ^8 P6 K6 I+ G# e9 A
<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>
8 A: V6 N( t8 {( b1 @9 r5 W<script language="javascript" type="text/javascript">2 J  _7 {/ \+ {+ t1 M2 X
<!--' }" H( y) u% y+ ~
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering# i3 z  f( A# X; p5 ?( L9 ?
//-->9 i/ h0 A2 k( t8 ?  ]0 V% z% l- f% ~" m
</script>