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

zw2004

<script language="javascript" type="text/javascript">
, ]2 @7 x) `$ e' s. m2 h0 l<!--2 h5 b2 t: w9 o2 m3 l# {. y
// convert a single digit (0 - 16) into hex
; b; k. R3 a9 bfunction enHex(aDigit)
, `- A' Z' E7 i3 w{
1 u+ ?/ t4 D, w2 M! a- H, B0 g    return("0123456789ABCDEF".substring(aDigit, aDigit+1))  V+ @4 _% S' i1 a
}4 r* H! U. ?0 @. o2 D+ f' z/ ]1 u
// convert a hex digit into decimal
) W( j2 K4 g* p# [' Y% {; }& ^function deHex(aDigit)1 h% v6 k8 }, r& m- ]7 Q9 }/ C
{
7 R7 X* v  j( ^: b; P# @    return("0123456789ABCDEF".indexOf(aDigit))
# d3 V3 c, o, z}* i! T6 v% V6 \2 B; `

' R+ L  K% }1 W3 v7 V( S6 X* S% a; [// Convert a 24bit number to hex' X& M1 V" V4 _0 A4 m' X+ o" t
function toHex(n)
% o) V3 O. J. D8 L+ U$ h{5 m3 B3 F7 F1 W$ i
    return (enHex((0xf00000 & n) >> 20) +8 _  B$ y1 i# J7 x! U" q
            enHex((0x0f0000 & n) >> 16) +7 P" r" q/ k5 W% H+ ?3 d9 _
            enHex((0x00f000 & n) >> 12) +* I- y% s. a2 e+ h; y* Q
            enHex((0x000f00 & n) >>  8) +1 q  E, C& L5 k* a
            enHex((0x0000f0 & n) >>  4) +" `- i9 ^4 `3 x% }2 \
            enHex((0x00000f & n) >>  0))
8 M7 ?, B1 m& Z% _}
2 {' ^% q5 G. N/ r- {0 l/ i// Convert a six character hex to decimal' k( K2 s- f6 L+ D4 \. \
function toDecimal(hexNum)
- q, Q) r4 F/ M* l% F, S7 E5 n- f{" H9 b8 v( s, L4 q, m6 p
           var tmp = ""+hexNum.toUpperCase()
) `/ _0 A( v+ q3 c  J    while (tmp.length < 6) tmp = "0"+tmp9 Q% P, D; D8 j5 _$ e# k
           return ((deHex(tmp.substring(0,1)) << 20) +
8 n& O0 L: A! j) O) o                   (deHex(tmp.substring(1,2)) << 16) + 2 k- x" i* t0 Q) U. t: T
            (deHex(tmp.substring(2,3)) << 12) +( o- i6 }1 r, ~# p6 l
            (deHex(tmp.substring(3,4)) << 8) ++ X6 U- u' i- {, P$ w
            (deHex(tmp.substring(4,5)) << 4) ++ R; t5 p+ u/ ?+ }
                   (deHex(tmp.substring(5,6))))
' Q! i2 Y* l8 a; m7 a}& Y3 Q/ T# \+ H- L5 u0 u/ L+ z
///////////////////Shimmering Links/////////////////////- ~2 n4 O5 U$ j) e. O  x1 X
//global variables
: o9 X) A& y: X$ o' kvar hoverColour
) I# q# _' ]7 ~7 x5 j$ }var numLinks;
9 Z9 ]# \2 ]* o% ]+ o1 ~var rate;
& t/ p# o  Z$ j/ tvar numFadeLevels;# Q( A* y7 d* P1 |) p# T; ~
var bgR;& S6 M* k& v+ E
var bgG;
0 ~% D2 D0 k) Kvar bgB;
, m9 n" ^7 z% f' `var currR;
1 n3 X- u3 ]! Z; F* X) z- yvar currG;
6 x. k$ S; @7 n" A2 I, vvar currB;
5 t5 ]8 ?5 g, `9 Svar count;: W- ~) Q! x8 h& I5 U
var fadeOut;
  v" q1 S4 P) m, f9 {7 uvar continuous;; t4 H$ B2 f4 E! c: E% z; O
var newColour;5 e! r. m! @3 T6 H0 x3 b1 F- ^9 E
var tID;' ^- a" }+ b/ P/ r8 e( V
var redInterval;
$ B( F  [8 K$ t6 h" p% W7 Tvar greenInterval;
5 o+ `! a$ @& G( Mvar blueInterval;8 J; l9 ]: g& L; P" }* _8 Z
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)- D7 Y3 `+ i  a% R3 K, a; Z
{
4 S& v# O# Q! C" ]        hoverColour = mouseOverColour;
8 f2 X2 w8 v8 }% T5 g8 P        numLinks = numberOfLinks;! K* ?2 R& M& S2 c
        rate = 1;/ T5 ^2 y- F- g5 D5 \( S  H
        numFadeLevels = 30;( N1 J7 _. @- B2 v7 {% t/ j) H: C; |6 l
        function initArray(theArray, length, val)
5 a4 M. z( d' |        {
3 q4 f; n$ L1 R" X& I3 I( w8 \4 y                for(i=0;i<length;i++)
+ S* F  Y( [# I8 z# ^8 m                {$ e0 a* Y5 z6 m0 d* D
                        theArray = val;
( C, L% K5 e5 z8 U# q                }
) D% a7 k6 y4 p        }
/ ?' W- N/ ], X3 I6 }! n2 o        bgR = '0000' + fadeOutColour.substring(1,3)
& P  d) X& L& a" Z        bgG = '0000' + fadeOutColour.substring(3,5). [+ z5 k4 |  H& T; I& J9 a6 i
        bgB = '0000' + fadeOutColour.substring(5,7); C7 s0 k9 t- D' g. X, m0 N- Z
        currR = new Array(numLinks);- B6 {' d" w" c6 s8 ^9 y8 ^# e' }- R
        currG = new Array(numLinks);
, Z5 O7 E  r! e) G9 T$ z; u        currB = new Array(numLinks);) B/ L8 |7 E0 W& }# |% d+ d
        count = new Array(numLinks);, @# t5 W9 Y7 z
        fadeOut = new Array(numLinks);+ u  R" A! Z0 {
        continuous = new Array(numLinks);
$ e1 e5 d  U# I        newColour = new Array(numLinks);' q: _6 t; x5 G. m& _
        tID = new Array(numLinks);1 a6 Z! S  M, v( }2 D0 y! k3 E
        redInterval = toDecimal(bgR) / numFadeLevels;
, |- u; j' k: X' z0 x        greenInterval = toDecimal(bgG) / numFadeLevels;, X6 t2 r0 o. ^4 @0 i
        blueInterval = toDecimal(bgB) / numFadeLevels;
, s" N3 y6 g! l! G; l" k        initArray(currR,numLinks,0);
& h( v3 m6 h1 c9 V% k8 N        initArray(currG,numLinks,0);9 Q% N( I; g# S, Z  s
        initArray(currB,numLinks,0);
( G: y/ {# S& |; E% i        initArray(count,numLinks,0);3 m7 I% C9 {6 K' [
        initArray(fadeOut,numLinks,true);
7 l3 @! V/ C0 T5 a3 c        initArray(continuous,numLinks,true);9 k* T0 d' Y. i) ]! F, f% B
}       
* A* S8 T' R' d8 jfunction startFade(id)
# {0 A5 c, u6 I. J{8 U+ ~& k& x6 _; `7 i! I
        if(fadeOut[id] == true)
7 v; A( N( s- [# y4 |        { /*move colour towards background colour (increment)*/7 k0 @' I* e5 O/ F
                currR[id] += redInterval;
; q. O9 P  Y3 F) J) X3 m                currG[id] += greenInterval;/ h2 Z) P7 q  B8 F+ ~
                currB[id] += blueInterval;) [4 ^$ {* Q4 V: _6 c) j
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
) N2 t/ W/ u% X7 b% R# V                if(++count[id] == numFadeLevels)
3 ^, P1 @% `9 p5 a& ~1 z                {  Y; F5 l- b  b* N
                        fadeOut[id] = false;
+ C/ r8 I6 I9 F" \; Q                }
+ U8 `2 v7 l6 z8 B; @5 O        }
  u7 B8 f% Y  j* j        else( w/ B2 R( k4 r5 t/ G
        {
1 I/ m0 L- I5 V# `) C* b                currR[id] -= redInterval;
4 Z' W+ ^7 q+ Q5 Q9 q+ @& X, D/ s% e8 T5 _( Q0 X9 u: V
                currG[id] -= greenInterval;5 u5 M, f4 W! h
/ a7 a% j. g$ B, h) a. Z9 d
                currB[id] -= blueInterval;
, L3 u9 ^& f: R# y- r, u
* w3 _2 l# M: r! @  g3 G; v                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
9 ]' U0 ^$ N7 \" }" m" y; G
2 J/ n( J4 e- C$ L8 _4 r5 k                if(--count[id] == 0)
! k+ Y. F! p$ O
1 e0 W) [; j; ~; I/ J- N                {
  z% h3 f$ F1 y! M' B" h! _3 E5 |! d  z8 m4 o: z* {
                        fadeOut[id] = true;& Y7 Y* g9 C# N

6 A; e' J  A8 ^) q: |                }
5 h: t: X9 R: k3 p2 d
) x5 O0 k5 ~9 U# L/ G6 t0 n6 C        }- L/ x# N6 D6 G5 D" j

7 M1 O! p2 o, h        if(continuous[id] == true)
8 j; [' p" X# R3 K  m" u; U3 v# l7 G. }6 O9 E
        {
0 p  \5 K, O% E9 t- ?2 P. |, o' M1 w! H# K+ _) l
                document.getElementById(id).style.color = newColour[id];               
$ u- N, R/ M$ h2 B' H/ Y0 O8 [9 c$ D! \
        }0 d; {) f# j: R& U& C

6 Q/ \5 W) I% \1 a$ x        else" q* w) D. S  K
0 P( X4 T4 s% O1 f
        {
, \# ]$ y2 f# T5 e/ H9 l; e
# {, ]# `7 d, M+ [. T                document.getElementById(id).style.color = hoverColour;
8 F9 k' O+ U! M- @' W
# n" t5 N( y# Y3 \        }
; z" B, R! y4 `! \7 f1 z6 h7 |  P( l# q8 u4 E. W5 Q
        clearTimeout(tID[id]);/ }/ A6 t! @# n0 ~; u
6 M( P3 S2 t$ D
        tID[id]=setTimeout('startFade(' + id + ')', rate);3 ~% X% [( `# F+ |0 f
4 V0 H! I& n* C
}( g) s% m+ j* v( e! j
6 m) h/ K, a1 R- l% W3 F2 S1 b
function continueFade(id)
% L5 Z# B4 h5 I9 O/ e; T* r- o+ ?% r, `+ z+ \/ S$ ~% {
{
3 p# R; w+ A& C* }' k
& `% X, |% w  I% p( \, W% ~; N        continuous[id] = true;
0 |& b- D- A  o  t: t6 ~! s: a1 v" ?, P
% T- E1 G* H" w3 C; D/ ~}' a! a; d& C; `

8 |( ]' C+ `) ?. W# ^7 c9 C  U6 b* m0 ~function stopFade(id)
' g3 B* D/ [! i+ M4 ~4 t7 f( r7 T. p
{
% B& z# |4 e- q- C$ y' J, Z
, I  j3 A/ k4 T& V; Z3 q. [$ `        continuous[id] = false;1 `5 H- D3 Z! D1 }5 l2 v& A/ `
  ^4 b1 r9 E. y( t3 a
}
* ~. j9 K0 W& j+ c( ]) u) U, J0 W0 j. J6 L
function StartTimers()2 {; q: C4 H+ P9 n1 _

3 m) r& p0 S0 m- ^, h8 q1 y{        //set up an initial set of timers to start the shimmering effect6 O+ v: d+ z/ {- r5 K
, o4 L) H) Z+ ^2 t: r
        for(id=0; id<numLinks; id++)4 x# w' |( E' C
$ _$ c0 O( Y, \% B
        {6 V6 c$ ?2 B; z; S
9 t6 Q2 @3 S8 V3 N8 x1 t! M
                t=setTimeout('startFade(' + id + ')', id*100);' l( q0 i' A- z3 ?1 ^; |9 }1 U  @& d  e$ B
) O* @( i' v% h/ |
        }
. d  ^& P" R& O  S; d5 i: z% P$ t- X/ \7 l3 f! Q
}; b9 O) D9 ]/ b) d6 f
% }; c0 [4 b- f0 C, P+ ^
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
/ I8 D# m  H3 S8 g
( W6 x) A( x! ]* xinitLinks('#FF0000', 6, '#FFCC77');: R8 R7 j6 L8 |* Y, K. t  L

% \4 ?( q% S9 Q( f" i1 y//-->+ ]/ N" W; x* v4 k8 [0 R

; c- _1 T& J5 j' m) `' N</script>
3 C4 c# W$ M7 Q<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元7 ?  O" L5 `4 r
</a>2 Q1 q+ I' f$ x
<br>- D( U8 c( j4 q. C
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>: `# J5 _. t! `' \5 M3 P1 e4 V5 O
<br>$ i  R7 o1 S* L# L& Q
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>' F! T! H4 U8 j" V6 C
<br>        . [( d% E* y) @2 e- ]# V: v" _
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
+ d5 o% G# n1 g+ `<br>5 Y  F, J; l' Y# Y
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>/ z7 J- Q, W/ s  [6 e
<br>
6 ^# B& k$ f, `5 E' o0 I<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>
# T3 w. ]3 G" \9 u; r<script language="javascript" type="text/javascript">
  T; g3 Q8 g! n0 C2 G2 A' {<!--5 m7 r6 s+ W! q  b
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
1 f! |" Y& Q& I" l$ {+ c//-->
8 E  l0 i4 z6 g  E* t3 \6 K1 P</script>