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

zw2004

<script language="javascript" type="text/javascript">
% c/ ^; x( ?+ A<!--! s3 b4 F6 R$ m1 A4 r% {) I
// convert a single digit (0 - 16) into hex/ F: p* P$ S# r/ w
function enHex(aDigit)
( x0 b2 `: U) f3 L9 _2 e{
8 H1 i/ u$ H* L6 c- ]    return("0123456789ABCDEF".substring(aDigit, aDigit+1))
& e% \0 t- J( a, W4 Y& W, l}" ~, H$ i& f9 @' ~; q8 A1 ?
// convert a hex digit into decimal' y* P# Q1 ~5 i, _
function deHex(aDigit)& P, Q7 p: |& j  z+ @- b7 G" T
{$ l5 [; U) ?* Q* X0 [- J5 `/ b
    return("0123456789ABCDEF".indexOf(aDigit))
3 V1 P. E7 ]8 }* a9 O}5 x+ a# h3 I. \
/ ~8 D# z3 O; B- z1 x# f+ H3 M
// Convert a 24bit number to hex8 \9 M$ ~5 K& z, P- C5 y' _) D
function toHex(n)9 [; S+ X" L  |" q3 @
{/ |& n" R% _( ]4 @5 O. A/ V
    return (enHex((0xf00000 & n) >> 20) +% W! ]( d* E3 v' X+ c
            enHex((0x0f0000 & n) >> 16) +" d# v3 C* K# r( m9 z  Q
            enHex((0x00f000 & n) >> 12) +  m& N7 A, Y5 v* `  J, e1 Y
            enHex((0x000f00 & n) >>  8) +
) T" K; M0 j, c# w8 j$ G7 ?; v            enHex((0x0000f0 & n) >>  4) +$ v% L- d) Q- u) t4 s# z, e+ Z
            enHex((0x00000f & n) >>  0))
2 X$ y( g  [% M8 m$ a}
0 k$ O* J( Y- k( c// Convert a six character hex to decimal+ A& P$ W9 I( G( D+ h/ r  H
function toDecimal(hexNum)) ?9 q  {1 Q' [( n
{& i! O- s, s/ w$ X/ {; q: |% W8 \
           var tmp = ""+hexNum.toUpperCase()  V& t2 \8 I$ N: t1 k9 j( n
    while (tmp.length < 6) tmp = "0"+tmp
. ?' ], k' g; E& Z; i; f           return ((deHex(tmp.substring(0,1)) << 20) +. z1 B2 C3 O/ x) b
                   (deHex(tmp.substring(1,2)) << 16) +
  M* z8 E! |1 B6 `1 {7 a            (deHex(tmp.substring(2,3)) << 12) +
; V% k) z, a# y, M2 Q  y            (deHex(tmp.substring(3,4)) << 8) +, y( p8 f- w2 P5 \& K
            (deHex(tmp.substring(4,5)) << 4) +1 T3 O/ y2 R- I( o4 P2 L$ L
                   (deHex(tmp.substring(5,6))))' u+ H3 z6 X( l6 r% T
}7 {0 G3 l* ~. O4 K! p
///////////////////Shimmering Links/////////////////////
, I5 t. d: F1 Z/ W( w# L8 O1 a//global variables7 z( a) b. O6 ^7 W. w- J
var hoverColour3 ~; M* h' ^" U" C+ J1 J* h
var numLinks;4 x& E3 i$ z8 `
var rate;! L. x. i' g8 N
var numFadeLevels;0 V9 ]. }% @. c0 N# C
var bgR;
& A5 }( l) B* s5 Nvar bgG;/ Q$ m, p2 @+ K4 F: J
var bgB;1 {8 F  s6 z6 ^( m5 z1 U
var currR;
1 s: H; |$ I( x4 r6 Tvar currG;
5 v/ K+ ?+ m" {var currB;2 n1 C: E" L$ u& k8 k# n
var count;8 G# W( q+ L( Z9 i- a" A, k9 e- s
var fadeOut;& e% F5 Z1 R4 `; {
var continuous;& R3 {4 L# M& i) |
var newColour;# q9 ?& I9 p# d7 V
var tID;+ R! t' t* W/ r! i2 w3 ?$ W% x; \
var redInterval;
0 R5 i- W( j) A* s0 jvar greenInterval;/ t' J$ m# X7 P4 {7 Y- `
var blueInterval;
) Y9 c- A/ Z8 g' |* Z$ d, f! `function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
0 m5 r* `! ~' k  u/ p8 c{
; r. t, N9 E& E2 `+ y& Y        hoverColour = mouseOverColour;+ M3 ^$ Q4 J# P% D# q9 R7 o; T/ ]. }% a
        numLinks = numberOfLinks;7 d  T  O8 U$ c
        rate = 1;
# d4 e1 N5 k3 G0 o' A2 d) e/ a4 F7 B        numFadeLevels = 30;2 q" ?2 V7 }' j
        function initArray(theArray, length, val)* C& w. Y$ u$ Q! r
        {
# x) O& A; _* _; E+ P3 s2 O. O+ C7 H                for(i=0;i<length;i++)4 ]- y/ T/ R  V6 }7 t5 l7 Q
                {0 O/ B0 _( [6 U
                        theArray = val;
3 {  k# O5 u! I7 V9 V8 E                }5 i, _9 p" I/ a& h, h
        }/ \5 O" u- Z) R8 e& P# r
        bgR = '0000' + fadeOutColour.substring(1,3); G( {; N- T) K9 O' g, ~7 t) N
        bgG = '0000' + fadeOutColour.substring(3,5)" L7 ^$ }& R" M8 D0 K+ c, S
        bgB = '0000' + fadeOutColour.substring(5,7)
) R! C9 H% m5 A; B0 s        currR = new Array(numLinks);
) A( A: I0 L6 `0 S/ j- H  O7 j        currG = new Array(numLinks);
' d/ l5 A0 H7 T% ?        currB = new Array(numLinks);
8 z# O  ~& E& k, `# g/ t4 V2 z8 \$ q( D        count = new Array(numLinks);
  a( T9 e3 \$ B) H$ G        fadeOut = new Array(numLinks);$ M# F; ]. ?* O  g
        continuous = new Array(numLinks);/ ]& \  \9 B* H+ W, i( ^3 a
        newColour = new Array(numLinks);3 i- n! L& T  H% `% b( d$ k) S
        tID = new Array(numLinks);" q, h2 R; J4 |0 T+ I- C
        redInterval = toDecimal(bgR) / numFadeLevels;
  [, X6 e' V1 ~, c$ X, {1 r' K        greenInterval = toDecimal(bgG) / numFadeLevels;
' p3 @/ ?8 [# r- Q8 D        blueInterval = toDecimal(bgB) / numFadeLevels;0 i! V$ p: m9 s) j7 U
        initArray(currR,numLinks,0);3 {7 m% c, p9 A$ u
        initArray(currG,numLinks,0);3 ^! g- O6 i8 l) |3 s
        initArray(currB,numLinks,0);
# o- P! a1 }! y' y$ J* b        initArray(count,numLinks,0);1 O( [7 X; X; p% D; p% X
        initArray(fadeOut,numLinks,true);
# E+ S) i$ Y; J; M4 k  ]        initArray(continuous,numLinks,true);8 j( M+ _$ R4 a6 Q* ~
}       
8 Y/ R0 m  M' Z# p* Nfunction startFade(id)
8 O4 O  W# f5 |* [( r. ^& d{7 Y: f9 b& w3 M% j: W9 j- ^) ^
        if(fadeOut[id] == true)
" F% ~) D) B- @# i' l7 [" v; X- S- K. n        { /*move colour towards background colour (increment)*/& W( Y- ~, G2 ~) ]% g+ e& F, ]
                currR[id] += redInterval;
6 K7 K* i! ]' I' Q* @. D! r                currG[id] += greenInterval;
3 }, @* @  W% I/ a8 W( _                currB[id] += blueInterval;8 n3 d5 {! i" m7 [/ B1 e
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);+ P' y$ [7 W+ [
                if(++count[id] == numFadeLevels)
  h2 P- \3 r5 [( V3 e# H$ m                {; I" I* u1 K  C
                        fadeOut[id] = false;' C/ e6 Y' U3 u: G9 x3 C2 U
                }1 b. F0 {7 k! x& j
        }
4 R' c$ O# G' Z# j4 P5 j        else. S- v3 \( @" _; z& Y* [: q: [% Z
        {1 b3 i# K$ G1 h7 [7 N9 p/ h
                currR[id] -= redInterval;
4 t; J, F( X2 o, k" r) R# D& V% V+ Q, p: X8 g7 l* p
                currG[id] -= greenInterval;
" M& Z2 x/ i% }: q$ ]( L- {
2 }) d5 s2 x7 f" }6 h1 T( |                currB[id] -= blueInterval;! A- ^. B2 u+ |* Q& l

4 e5 K9 B9 Y; \                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
' t5 a; E% {' C1 n+ L" s0 p4 }( R# m  E
                if(--count[id] == 0)* [6 q  V; y1 r  x: x
) `: N1 q) {5 f1 I
                {* _7 g. d8 U% _  `$ K
+ I4 ^4 [$ l* `
                        fadeOut[id] = true;& k$ S; G" n6 t2 d1 {* O1 O
+ d0 o. d. M; {5 E; J. c
                }
4 o4 v8 A4 L/ D- l3 v' r! I3 p* R* b$ Q  |
        }" r, p, H* H0 |8 k/ A  ~4 P

- ?# _# S; C4 U2 w1 ^        if(continuous[id] == true)
% @1 L' Q0 c' g) N3 @
9 `0 P! t& E* o; e; ^' N8 t& C2 b! |        {) C# ~5 X8 V8 ^0 I6 X8 j0 U
5 C1 m7 o" I% {0 F5 K8 Z
                document.getElementById(id).style.color = newColour[id];                ) F7 _" w5 f0 k2 J$ g
$ M) h7 f4 n& _: p0 z
        }
* ^2 D. t5 P$ d  m4 M
! K0 T2 s. n1 w) ~        else
4 {8 p4 q6 g' e- E) Z7 Q% r' u% o  b0 r9 ?* P: @+ \
        {. r9 h/ H5 I  P+ x; w0 f) }
) O; G1 W& T5 K+ V# P
                document.getElementById(id).style.color = hoverColour;3 F+ p1 [; {- M$ j" x! R: g  N0 z

: T4 [9 w! B  a/ V4 d& Q8 ^        }
3 O3 D# f& a+ l! i9 k) @/ ^
# Z2 ~+ ~$ g# j        clearTimeout(tID[id]);, {0 k) q7 N( M" b1 ?+ V: t% N

* W4 K$ }( `/ T; _, B  D6 ~  b        tID[id]=setTimeout('startFade(' + id + ')', rate);+ ], B) R& g5 i  [) ^4 E# Q

0 I, s$ C5 B8 ?; k}( R& ~2 S3 {: Z4 G+ v7 _$ F
2 R5 A9 G+ Q, f# ?) L
function continueFade(id)
& e5 o$ H# {; @. s7 q/ d3 L* g& r6 b) l8 ^/ G% A% W- U
{# [, u+ ~% j- G+ b, ?
/ T- l2 v6 U: l9 ^# c  V8 E! q
        continuous[id] = true;
' X3 c/ O% w0 I
+ U; S% y0 ^$ p}
0 l5 [# b* u4 V+ t3 F$ y% I
0 C* k7 {% _3 zfunction stopFade(id)* `# U2 ~/ B! b' ?

7 u# m9 |1 z3 P$ e2 f( |{
+ i8 F) d& s& M+ }
8 r" h% T& K0 P, C2 O: t" \        continuous[id] = false;
5 W' ^$ M1 |: e8 `- |6 t/ |& Z& }; r% C
}
4 H; h: F- o& m' [+ i7 q( C6 C; G; a: }- I5 {
function StartTimers()
0 p5 e' F3 d4 }& c& u/ r0 ~3 r+ d1 O) E7 l+ v0 ]9 T+ {# f
{        //set up an initial set of timers to start the shimmering effect
' ]) P' e8 E/ Z! w$ f' z- n
: R* b; `: D  Y1 H8 z) K( Z/ p; T        for(id=0; id<numLinks; id++)3 O8 Q. t; y- \
& k" }& I/ ~% p7 U, U
        {
3 o8 d# ^. \$ u/ b" s8 m+ b+ |
. v' z, S6 _. o0 X! u. M                t=setTimeout('startFade(' + id + ')', id*100);, F4 w& J1 I) ]; h: q2 a
( S9 n2 l8 D: L- ~. \
        }' a% w. B% o( y

8 J3 ?5 i6 R& B: T5 Y& w% I5 m}
# ^, q6 c* u) C0 E# Q; S/ j2 u+ P
7 i: C+ O, ~2 n' y$ |7 m: F8 V7 R//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour'). [& J, n. l2 b& e0 K% Q! A0 _

7 U* U0 }- Z, l; YinitLinks('#FF0000', 6, '#FFCC77');
/ ^( v  [7 ^; l4 z" _( D- `
1 v1 L% x+ V0 g9 d' m1 B( }//-->( j' C; P3 J) T3 P
. ~! E. {# a- V4 c6 w( ^
</script>
  M1 k/ H3 n0 G<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元5 Z* `1 i2 F6 B8 Y2 y: w. I
</a>
0 x+ e: P. p1 u& @! j% M<br>
$ b5 U+ V' K$ P) T5 I<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>
% T" Y' `, M: g/ V9 G" e4 L9 H+ n! d<br>& {& \, \7 E  a# G8 A1 C9 G6 S
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>' N+ f; x: W( b2 @4 B# W
<br>        3 h: s7 j% {! Y- D1 C
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>' W! B( q+ W2 v3 f& v
<br>
# D) d/ j5 q8 A; j. o- h, b<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
  E0 u, x4 |+ E* ]% Q/ H6 e<br>
# Q+ Q1 |1 R( t9 c7 l<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>9 K9 r: |9 x/ [3 Q( q
<script language="javascript" type="text/javascript">% ]# S3 P" e! W- M) ~2 f& a& s$ l
<!--
: E0 P1 T& T% R$ G' q- A  ssetTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering  m4 q0 x$ U+ x. N8 ~. i9 q
//-->" P8 Q6 h  a7 O
</script>