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

zw2004

<script language="javascript" type="text/javascript">0 |" l0 u% m' b: b" F# s. e3 Y
<!--: W2 K( E) \7 f/ ]6 Y- A, @9 Z: S4 z
// convert a single digit (0 - 16) into hex
) l9 t0 W! w  Jfunction enHex(aDigit)) O% d/ W6 A# e' R2 x& J: R4 Z
{, m2 C# V3 F4 v% h
    return("0123456789ABCDEF".substring(aDigit, aDigit+1))
  [5 z) R) Z! {% i; y}
  h5 a' O& _7 w4 O// convert a hex digit into decimal% w) d* s* S8 E4 I( w' g# K
function deHex(aDigit)
* u* E% m& v3 i/ r{1 F* o0 i3 o) G% I
    return("0123456789ABCDEF".indexOf(aDigit))
( C5 k2 W: Q; o0 P6 |8 U, Z}# y5 {* m3 j6 A/ J% N, k
" C9 [- V. C6 @! \" a  `, J
// Convert a 24bit number to hex# x. M" e7 r; ]" {6 w2 @$ K
function toHex(n)
$ _) G: ^+ @, y4 e  e  m{
$ e; H7 r: i% i: _8 U+ Y    return (enHex((0xf00000 & n) >> 20) +: d1 \$ B& }) `; }
            enHex((0x0f0000 & n) >> 16) +0 ^; g( k/ {: |9 B; N1 c' B6 y
            enHex((0x00f000 & n) >> 12) +/ b9 {: o' j2 |
            enHex((0x000f00 & n) >>  8) +# G# |- g% j- p9 _4 w
            enHex((0x0000f0 & n) >>  4) +* B1 ?0 ^' O7 t# C, {
            enHex((0x00000f & n) >>  0))
4 d! k* G, r9 t/ P* f2 i}
  b6 s  c. `. v* G// Convert a six character hex to decimal& ]% ~% M% m# y- G; Q/ N
function toDecimal(hexNum)" F7 s4 x7 K2 y2 l0 x! v! {
{7 O; p6 J& O7 O! Q
           var tmp = ""+hexNum.toUpperCase()
. z: s( v( T% `- V    while (tmp.length < 6) tmp = "0"+tmp. Y: G1 H$ K% o. q! c3 U( U! E
           return ((deHex(tmp.substring(0,1)) << 20) +" j" p  {8 e+ N; z
                   (deHex(tmp.substring(1,2)) << 16) + + F- i# R9 J. g* V( B4 B" v# y$ o! r
            (deHex(tmp.substring(2,3)) << 12) +$ N! R! h6 t6 |. _; P
            (deHex(tmp.substring(3,4)) << 8) +
: f2 \& x) F, k4 {9 k            (deHex(tmp.substring(4,5)) << 4) +/ Z0 s$ I) U. i; R. ?
                   (deHex(tmp.substring(5,6))))9 }% [; E* }1 [0 y% _
}
8 i( a) q% u9 _///////////////////Shimmering Links/////////////////////
* ]: @$ n% C2 k7 B//global variables
6 V0 l: V8 V( U) Q6 ~% Lvar hoverColour
& @. G4 r4 B, S! g* N  Ovar numLinks;
  A; W/ h" I9 C% u. s# B" evar rate;
! h) U! B  t- z. v' }var numFadeLevels;
5 F3 ?" ?) K, ?7 q7 Y$ T8 N" Ivar bgR;
! k1 ?3 r2 e# x% J9 o* O8 }6 t/ m  avar bgG;
' ^3 J* v% m: U! C% a2 }var bgB;: u% X* ^8 O) b3 D& m/ ?
var currR;" b+ [! ?% b- c: @8 s6 P/ O1 }
var currG;- A( j. n7 H% f+ d/ U5 X% S
var currB;: ^  ^: _' S0 h
var count;7 g; m7 U# z$ _" g7 |6 X; g
var fadeOut;6 _* F* `% X- @* P, r
var continuous;
; l! c% s: X6 N2 }/ t. Vvar newColour;8 I9 {3 x; \4 ]+ b- ~
var tID;
+ C/ s' C  @4 v; Xvar redInterval;
/ n  @9 v# z9 L4 @' w6 d# uvar greenInterval;
0 ^4 T. Q( S( G; X' ovar blueInterval;* M  [. L4 D. Z* u! D' d
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)8 q4 ]$ Z& M3 x7 |+ P; V5 k
{) R0 r* q" `+ ]7 ]
        hoverColour = mouseOverColour;9 N6 ]9 x" O" y7 B" C
        numLinks = numberOfLinks;
+ o. @0 Y. `2 |8 V& W        rate = 1;" L- l6 \8 H7 v$ M
        numFadeLevels = 30;% v: x# V' k% \
        function initArray(theArray, length, val)
$ a' J& j8 w+ x3 H        {  u. R2 n/ ]  F1 C4 U  h( b
                for(i=0;i<length;i++)8 b$ F1 |9 B6 k% e' r4 h
                {  Y0 D% Q0 f: A# y4 f( B) W9 |
                        theArray = val;
& C. ^/ {% |0 }& j$ ~8 ~                }
% x% ~7 k) U) t3 V0 n. B        }
0 V2 Y5 s9 k( g6 v        bgR = '0000' + fadeOutColour.substring(1,3); y$ A0 C! L6 G* j4 B/ ?
        bgG = '0000' + fadeOutColour.substring(3,5)& V; G6 }  q2 B
        bgB = '0000' + fadeOutColour.substring(5,7)
$ u6 a6 \, [8 d        currR = new Array(numLinks);
5 N1 ^0 V: p  J) `$ Y        currG = new Array(numLinks);
; _8 @2 u7 b( @4 m; N        currB = new Array(numLinks);
" s* @# o+ `. F0 ^% h8 @  F        count = new Array(numLinks);7 e+ j' T& u0 |" x6 w
        fadeOut = new Array(numLinks);& N( M+ h- p- O
        continuous = new Array(numLinks);
4 A( s, g5 W& z) K        newColour = new Array(numLinks);
1 m6 I8 U1 g# a5 {        tID = new Array(numLinks);
' I+ F" m+ o/ w) U% r        redInterval = toDecimal(bgR) / numFadeLevels;* w, {) P! F+ z, b; _
        greenInterval = toDecimal(bgG) / numFadeLevels;
3 v6 y! [! p! ]7 P, ^* L; M" ^! a3 o        blueInterval = toDecimal(bgB) / numFadeLevels;6 s& |1 ?  A+ o: t# Q. o" e
        initArray(currR,numLinks,0);
2 T- M& q+ J9 g$ y5 S1 j        initArray(currG,numLinks,0);
. q5 f# j. l3 x' E( B3 Z2 f        initArray(currB,numLinks,0);' m2 i1 ]  @, n3 H) v  }
        initArray(count,numLinks,0);
& q" C6 m# k$ O        initArray(fadeOut,numLinks,true);
( S3 J  @. t4 {/ S  ^6 ]" N        initArray(continuous,numLinks,true);7 B4 j6 W8 M4 V7 A( ^! x
}       
  _+ G/ D" U- \; q. ^1 e/ w1 ^function startFade(id)
/ N' V7 Q1 d" X, T$ X{% h9 ?# |- B+ F  T) r
        if(fadeOut[id] == true)0 ]. ?1 W6 l" Z* K: N' r$ P
        { /*move colour towards background colour (increment)*/
$ @4 l" L# b' }                currR[id] += redInterval;% ^) T3 u0 t  X( n2 R
                currG[id] += greenInterval;
) u. I1 S* M. u5 o9 q/ n/ ~4 {                currB[id] += blueInterval;: @5 V& _! w0 s* h: z
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
5 }9 B4 _. s/ y' b) A5 E) q+ C% @                if(++count[id] == numFadeLevels)
* f6 k8 h" W+ u                {
- c  c4 ?! ]6 l! W2 g8 {) c                        fadeOut[id] = false;" q* m  @' b7 T6 L: N0 N  _/ n/ ]' T* w
                }/ M( ~8 A2 w9 g- @, t5 X
        }1 q" Y! @7 P- n& U1 D& b
        else
$ c; ~1 Y; g0 b, S, e3 s        {( R: C/ i7 r, I- N' t# V
                currR[id] -= redInterval;
, c- B9 b6 |; X& d# _* D$ o( X  c) a6 f, t& ^
                currG[id] -= greenInterval;8 ?6 _3 `/ v+ ~, [, R

1 z3 J* K4 p9 [% w                currB[id] -= blueInterval;. K) o% x( z, F6 {# }

1 x2 p2 e4 Z1 G9 a1 m. \) \                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);3 `* [8 ], Q8 n0 F

: ~. N5 C3 X% R$ C                if(--count[id] == 0)4 s* U! [* f7 B4 c$ t+ u

5 N% k$ f+ {- g                {
1 @2 Q6 f# Y; r' B: z
3 I! t- i* A! x  ~, p7 V! S                        fadeOut[id] = true;
+ H+ F8 k! K1 x2 n9 F2 `7 ?; `  [2 o" Q
                }, s6 m, n  O$ V% @

( p1 T( T4 p$ u# }$ o3 m* V        }
1 r3 B* v! p: a9 y% ?  Z- x+ o
' C% E0 \, d$ n6 L  P        if(continuous[id] == true)
1 T5 n5 A/ ^; c7 A
" c# |( \/ f' n) ?* G* \1 @        {
6 F" E  c: B0 K& J. R# m8 ]/ z" _' I# T% T! O
                document.getElementById(id).style.color = newColour[id];                4 x2 B" G% B6 `, ^" A
4 {; k/ @# `* u% R' ?- x
        }+ p. ~! W, M% b3 |
+ v" w; S' p5 \1 R) a$ {
        else8 G9 J1 _+ G$ ~% {: Q( P( n
4 \- L7 i' t1 D# Q
        {5 l1 V* x  R/ K' Z" c' b5 c
9 V) X! p( I% j- a. F$ _  e$ B; h
                document.getElementById(id).style.color = hoverColour;
( L# L6 J" o7 q( R
3 n; F4 [" ~$ h% f        }. _+ a) J- ?- o8 k- |+ O! M$ i

4 [# K" |3 D' E) n7 D) t        clearTimeout(tID[id]);
- s: x/ w+ y) g* ]% i( ^, B' O( }  S/ |! H- f5 D+ h
        tID[id]=setTimeout('startFade(' + id + ')', rate);
  l* w! D- C, N- Q; \4 i$ u7 f3 c" h* D
}
) ]. r8 h# x: f# Z# b% t
1 o; J7 a; j. L7 n3 K. Hfunction continueFade(id)( y. p/ G$ J- X
8 b8 ?/ ?' r0 S/ b, m% E+ ^
{+ _* T, V6 x) C% {/ W5 M
" C& B; a: s0 G- ~" Z2 L
        continuous[id] = true;
" c" S6 n  a9 K4 G" }0 v( A% Y' L* h3 j- S- L$ G, q* v
}: [$ A7 Q5 }. X. z

0 Y& _& c9 U9 _2 K- i$ L# Lfunction stopFade(id)+ L  x! v+ `7 ?0 C3 U
. H# p+ k2 b; k- f& V
{
$ `( H/ s1 e+ G, V6 l1 i+ |1 o- j7 F  L. Y% ]" S
        continuous[id] = false;
8 p& u! o, h% o; G% [( a- a/ S* H  E9 N, v% B# Q) x$ ~
}
" }7 Z. k; n7 w/ Z* G
' W. q! z1 b( h& {( H$ j& U5 O+ Hfunction StartTimers()6 B5 k; c  M1 E2 ^

( ~, m5 u1 R9 P2 b, W7 k{        //set up an initial set of timers to start the shimmering effect
2 s3 M1 c& _& U! j" {: D% Q# G
; ~* [' ?& Y7 e/ C" B        for(id=0; id<numLinks; id++): ^5 v. \8 W- o! H# F$ T, G

' ~& ~0 M  I+ c3 w. T* K9 d        {1 I% \2 J+ K4 H) i

- H% U$ b8 A% ~* k9 ?                t=setTimeout('startFade(' + id + ')', id*100);* F/ C  [8 r. Y. \' P
7 S6 ?, K1 Z/ d% `
        }
4 ~' z2 u! c3 K
7 t# C' m6 E' I" k# J}; }# q6 P# f: g

$ H9 \  ^" D+ c9 {/ S0 k8 D//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
& O/ S. ?$ y- a4 s% l
2 {+ B4 g" _* ^3 }: ninitLinks('#FF0000', 6, '#FFCC77');
2 @7 s6 A' F9 M$ Y" E6 n; G/ A% f; c& j* a* H0 D
//-->$ s- ^$ I8 R! W$ G# n

% h/ _+ m* [; Q5 P4 _</script>& _) m0 C/ ~7 [2 w+ j& v2 Q
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元
# G$ g# a/ p8 c/ t* V</a>
7 V6 O$ W, M8 _9 q* V) L<br>
" H6 j8 E+ R" y! P% D# r3 y7 o<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>- ?% \& N+ L  ~- k
<br>9 A* u- c! t7 c) ?4 f8 R9 p
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
$ q( p9 o. G0 m' N; E<br>       
- ?+ m) T- W% B' m: r' U<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>* N* Y% x5 A& l' q+ u' n
<br>* X5 t9 ]# ]3 ~' T* E7 G
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>3 ]5 u/ R6 o. ^4 ~3 I3 Z
<br>
: }* [& q4 W- p& e$ T0 Q8 u! M<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>2 F- w  {. E! n
<script language="javascript" type="text/javascript">
$ S  I( d# r! g$ W8 `- C3 P2 t9 C, w: k<!--
; t" D$ `+ v$ XsetTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering/ J, u6 I* p/ R0 t( b
//-->! ?! u. m" ]4 S: j) S& \
</script>