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

zw2004

<script language="javascript" type="text/javascript">/ U5 c- I" H3 T6 H; R2 J
<!--
1 J  b% }( P; X0 H; e! _: [// convert a single digit (0 - 16) into hex
3 E1 E5 s/ L9 h. _5 K: W7 qfunction enHex(aDigit)
6 i* g! ~/ {& W, I1 r{
. P4 u  x8 b, a4 O3 q! M    return("0123456789ABCDEF".substring(aDigit, aDigit+1))6 c3 J4 I! U2 i# A7 y! \
}
7 K% {/ z$ R) Q// convert a hex digit into decimal) B( T  x" [4 Y# a' x
function deHex(aDigit)
$ q3 G) X* }1 X3 J: R6 Y{2 i8 ~8 Z3 m9 r+ D
    return("0123456789ABCDEF".indexOf(aDigit))& U, B7 ]# J. _; L
}  N( _0 i2 e4 Z) T3 N% h

; V3 M$ S) r! f; V1 L2 n// Convert a 24bit number to hex1 y; n* I: B# q" e; J& V2 j  R
function toHex(n)/ X0 q5 K, w9 m% J( K" x' j
{: ]/ j& M+ Y, L, U( Q
    return (enHex((0xf00000 & n) >> 20) +
! U4 G8 ]/ ]% H0 ^6 Q            enHex((0x0f0000 & n) >> 16) +
+ P+ Z5 F" c5 s% X3 y            enHex((0x00f000 & n) >> 12) +
/ ?+ R8 m9 O$ U8 p8 X" [            enHex((0x000f00 & n) >>  8) +& A2 [% Q+ {2 V9 |
            enHex((0x0000f0 & n) >>  4) +
4 S/ f7 r* O! y) h! {8 Y2 C8 |8 [+ l            enHex((0x00000f & n) >>  0))
# _; J/ K: K$ @}
" N" C  ]  N; i// Convert a six character hex to decimal; B' d" H0 s. g; y' I
function toDecimal(hexNum)
/ Z# D" y  I1 c  D{# v% k( i1 T# _( u7 f- r( b
           var tmp = ""+hexNum.toUpperCase()
: ]( O4 E: q' K' E    while (tmp.length < 6) tmp = "0"+tmp% o8 P9 @( D) l7 B2 S
           return ((deHex(tmp.substring(0,1)) << 20) +9 C: e+ d0 R& e# r5 R/ Y. @
                   (deHex(tmp.substring(1,2)) << 16) + / |6 a! [+ f, _- H
            (deHex(tmp.substring(2,3)) << 12) +" p% n9 Z" B# B# D) q" i
            (deHex(tmp.substring(3,4)) << 8) +, B, _  }- S/ r9 v- h6 N, P( H
            (deHex(tmp.substring(4,5)) << 4) +6 x' C8 Q( B# t3 ]3 y7 }* A# ?  J
                   (deHex(tmp.substring(5,6))))
3 c' \! S$ `* g3 m6 E1 k}
" P' ^% j/ }0 e( s///////////////////Shimmering Links/////////////////////
9 {3 j4 Z; \4 W9 y7 ^6 V' ?" z; U//global variables% e( [1 X! }1 v' n7 C+ Z9 N
var hoverColour
% N# Z7 ~2 A; B/ Xvar numLinks;
& g- E( w8 H, T& p2 gvar rate;
/ J" C1 Z7 d) S, b# o" Q3 N- W3 \# n- tvar numFadeLevels;% W  C, k- v' Z3 l9 N0 v, ]
var bgR;
3 M" G  [& V. Q  `0 {( {: Y. v% s- {; Uvar bgG;
4 _: ]% x0 [: q1 Lvar bgB;1 D  D) A' Y; {2 g
var currR;7 n8 [: u1 g4 _( M
var currG;
+ x+ J3 [3 m- g' ]2 pvar currB;( `  N  }6 W( S' s
var count;
4 F3 `$ i$ o! N" e" Tvar fadeOut;
9 l* m! M; ?! e+ I  \6 D) r, j  Uvar continuous;
0 N& c* _* s6 s- @" y8 p$ x3 zvar newColour;" g* l# e- {# i* u6 ]
var tID;
/ _- j6 B. O% p  r! G" c1 g/ k8 v* p  Rvar redInterval;7 X- m1 N& x: @) W) p
var greenInterval;
+ O! W$ S4 J& Lvar blueInterval;
/ K5 M6 C" p4 D( O# m; ~2 {- D8 vfunction initLinks(mouseOverColour, numberOfLinks, fadeOutColour)0 Q0 N* S/ Z% b
{2 ~+ d) ~  n  j/ E% \  r" R
        hoverColour = mouseOverColour;+ m6 a" a3 @) l5 y, O* @
        numLinks = numberOfLinks;
/ }0 ?; \# [5 g# r" Q        rate = 1;
2 S. u4 T0 H* a! {/ N- j        numFadeLevels = 30;/ ]" i) a- I. t
        function initArray(theArray, length, val)2 r9 O2 j8 N0 ~& @2 ^  ?
        {
6 u" s9 {7 Q* U( Z  Z. V. h7 Y                for(i=0;i<length;i++)
/ z4 u* H) W: N4 V% E                {/ X8 B8 G4 k3 E' k, h
                        theArray = val;
+ \* S2 o2 K- F8 ?& ]                }
( S4 G# h* e; ?$ T, c4 g2 P% T+ {        }
8 P' @% ^7 W6 X2 a/ V        bgR = '0000' + fadeOutColour.substring(1,3)9 {# N! c* b- F0 A
        bgG = '0000' + fadeOutColour.substring(3,5)
5 P& Q8 t$ Q+ e# D; H- @        bgB = '0000' + fadeOutColour.substring(5,7)5 P$ @; t, Z9 c) R+ x. |6 d
        currR = new Array(numLinks);' z/ P3 q/ H9 C
        currG = new Array(numLinks);
( V$ e! g3 `* C% f# o6 f5 a2 w        currB = new Array(numLinks);0 j+ Q2 E; I, S$ j6 H0 X
        count = new Array(numLinks);
$ `3 H. j; r* F! y$ T3 a) ]: M" J        fadeOut = new Array(numLinks);
# |5 `/ _  I1 k2 |        continuous = new Array(numLinks);* F7 S; E8 ^6 Z! m
        newColour = new Array(numLinks);
1 x, R. L: f8 |; I, y+ w4 q        tID = new Array(numLinks);* s/ C( S0 H2 }% L) e' ^7 q5 j* }, \
        redInterval = toDecimal(bgR) / numFadeLevels;
( w7 }' P4 ^. Q$ T        greenInterval = toDecimal(bgG) / numFadeLevels;" K/ B, [/ m5 M" _: B* F& G
        blueInterval = toDecimal(bgB) / numFadeLevels;
. d9 N( L/ T" Z* R, {, |9 i$ K        initArray(currR,numLinks,0);- w7 v3 V4 q+ d& ?& K$ i& ~
        initArray(currG,numLinks,0);
+ ~: C  p  E! |4 B% \* R1 c        initArray(currB,numLinks,0);- n: X* M1 M* X4 s
        initArray(count,numLinks,0);2 b/ _) e0 C, M1 x
        initArray(fadeOut,numLinks,true);( v' j+ U! X* B& |- Y
        initArray(continuous,numLinks,true);) M, \; x2 `9 h1 B
}        / u8 Q2 s3 F* W. q' D
function startFade(id): |2 \3 B/ V4 h  N- Q
{3 a9 T) V7 Z$ U- E
        if(fadeOut[id] == true)
& {+ ^, b/ h" ~- x0 L  ~3 c+ O1 W/ m* v        { /*move colour towards background colour (increment)*/6 O+ R: a2 U! h! {+ x
                currR[id] += redInterval;
0 B" Y3 J9 S' u4 W; ]: k: @                currG[id] += greenInterval;
3 J3 u0 M. E$ w0 G& Q                currB[id] += blueInterval;  u8 q$ L/ |7 |8 n& H
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);2 k) N( y& ]5 d7 ]. _
                if(++count[id] == numFadeLevels)
$ P6 E0 Q' Z2 T( {                {
8 L  [1 Z! ^% e- B                        fadeOut[id] = false;: ~! d3 v3 v6 |1 g
                }
9 H7 _) `! c& v& T        }
1 e+ ^8 m6 O. S        else
5 i/ L5 U; ~5 i3 S* D/ l        {
9 I: f4 M5 b( j: H- H1 l( ?& h                currR[id] -= redInterval;
4 K- O3 v: F9 t: f  f8 h& A& j( n9 k4 Q/ G
                currG[id] -= greenInterval;& ^7 l: X9 \) @7 a

, K- D' ?0 K' O. s; a7 i                currB[id] -= blueInterval;
3 j) K6 q4 M( l! w6 a+ I6 S
- e+ X' a$ q3 Z4 K* j                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);3 K9 ~, Q3 X4 [7 `6 l# D/ \
3 P' p  f" Z6 R4 Z/ {9 w5 {& s* j
                if(--count[id] == 0)/ X' q6 `4 l- [9 W
7 G* Z9 ^+ Z4 f( p
                {
0 j2 Z  X/ {. y) e/ ]# i* W* \  e3 X% ^0 o( Z6 @
                        fadeOut[id] = true;
0 D8 D  l: E1 [. W  `' v9 k/ U1 Y* q: m' m" P. ]% ]/ J1 U
                }5 |$ Q1 S- ?( U/ _
' P3 f( ~, o+ r, }6 v
        }$ p  \* D3 s/ K8 B
; s& P: N4 [7 f* x7 |
        if(continuous[id] == true), u8 d4 z; D, o+ a4 N3 s

( t! N& F& O. }- ^+ z& D) e# e        {) R" V3 ~) z, \2 _
' o# _( I; F$ X
                document.getElementById(id).style.color = newColour[id];                ! q% z. d, [# l# t# ?) }

: D5 v3 B9 I0 B: K        }
1 _" _+ T  E, M: Z+ O- b: c8 B( ]  q8 T6 K
        else4 U- |7 u$ j* w% u" D
8 @5 P1 [& A1 k; P
        {$ o0 o" P  C0 a

1 Z7 K+ J9 f& T/ \4 D% n                document.getElementById(id).style.color = hoverColour;4 s( F4 T* d4 P$ n7 G

3 H9 F) {! ?* u3 Q% E* I2 U        }, X  N4 r3 y' h! j6 |0 j" x" @

& N4 G: |0 l; V8 ^3 h  Q5 y- f        clearTimeout(tID[id]);2 U, A" W* H0 |
2 m5 M% T5 M' \( s* X
        tID[id]=setTimeout('startFade(' + id + ')', rate);" Y! E# W8 B/ b

+ R6 ]# M8 Q2 ]. O7 m) P9 C}+ `8 E+ A* ~' ~
$ B7 ^9 v( v, S6 J1 A
function continueFade(id). s* c, Y6 X' ^& l% K* O
8 t% I6 A/ C' v2 Y
{# Q. n6 C- B& d  U* ~3 m
) t7 p/ B6 |% j. f( T) v
        continuous[id] = true;0 j6 _, P2 [3 V
  x3 G4 m; u( H5 n4 \$ L
}' c$ ?+ E. m4 ^" e5 U/ |

$ R7 O% r. [3 f  a' }1 ffunction stopFade(id)
" p8 q5 H) `8 x2 U( i$ b5 A# C  ?* z" X0 ]; ~; s# w# b5 `2 l) v+ H4 p  _, K
{) ^  u& Q3 K; F* D
  b, j% n/ T& M
        continuous[id] = false;4 x$ ^+ U  q  a& Z
0 G5 L: L  F7 ^5 R0 p
}$ j3 x0 U0 [* S
7 H( T; g3 {% y+ P! D$ u; X$ R
function StartTimers()# X! P! j2 E! `; W" o1 r

* i( F( j& W3 A% d4 O' I9 H{        //set up an initial set of timers to start the shimmering effect  ?/ |# x* f9 U# I6 ^: M/ @; N3 A6 H
# z3 l1 X; z- p  v( X
        for(id=0; id<numLinks; id++)
$ F$ O, N0 M. ]: U: T( N
( N+ l8 f. z" g) H' \; j" t        {
3 A( Z2 B8 }) n7 J4 y4 P  }% R2 D, N- o8 P# \! \" T
                t=setTimeout('startFade(' + id + ')', id*100);& t3 }9 H. q: u" u1 @

9 Y) F7 @. ?* p# H        }
  J/ ?- x0 e9 u" ^. }( r" q5 D" L
" p7 _4 C- S! v7 k0 {4 t}0 E8 e+ _4 P- M+ X2 P: F, q" C) ]

* m. z9 ]; s3 C+ V1 H/ z. m//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')3 T* m) e8 n+ ~) ?7 c

0 n8 A6 V7 j* `+ B/ `initLinks('#FF0000', 6, '#FFCC77');  l$ A  f7 p/ @4 t: _

/ k) J2 E( I. E0 r2 o//-->
( s5 ^* G0 g  U* i; L3 A, v8 w8 U. c( H1 b
</script>  d) u9 k3 t: w( W6 D
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元2 W: ~" ?( G+ h* T5 X- [$ C
</a>9 [( q- W+ T! x+ a# ?! f/ z
<br>
1 [/ F1 h7 y( z8 M$ T( H  h<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>
, J% R) Z) `' v4 O0 }! v( o<br>
  o" y! B! e2 ]/ I( ^1 H/ |<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
( a4 |5 r) N' O1 A, Q! {<br>        9 e, }* x7 c7 F7 N6 D
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>7 H6 ?1 m' L& q' ~7 B
<br>$ k( X3 P4 V, I, h  O3 f- D% y' E
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
4 d; f0 }+ \" k8 A9 h<br>! e9 Q. U; Q3 g% z9 s: k
<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>, r3 J4 X% P3 T4 z
<script language="javascript" type="text/javascript">
7 n* @9 u9 P- `- q; x. {- q<!--$ w" o+ k- k  y( W+ ?5 p
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
9 @; \9 N% H+ Q% d//-->8 Z/ L; W5 E: D, y* R$ T
</script>