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

zw2004

<script language="javascript" type="text/javascript">
, Z. \+ S% ]8 l* A0 a& _* \2 j9 L<!--
' q+ {6 P* v8 ]5 {: s// convert a single digit (0 - 16) into hex
0 V, b9 h# M. h$ Ufunction enHex(aDigit)( K: j+ a; Y' b! M/ Y
{
) |( h4 B3 `0 Z, r/ C3 [    return("0123456789ABCDEF".substring(aDigit, aDigit+1))
; c& \5 @) U) L1 [}
. q- l5 U; O9 W) }, Q1 e' V// convert a hex digit into decimal
8 Y. ~" l- ^9 q/ Wfunction deHex(aDigit)
5 i% G  {9 P& n- G+ i- v8 u{% X- e% f: W, D3 P0 M' y+ l
    return("0123456789ABCDEF".indexOf(aDigit))0 E# \4 O  `) w
}, s8 y! o% e& B3 S1 X& Z1 v

& A9 |! ]$ n2 _1 ?8 U// Convert a 24bit number to hex
0 @/ D- i5 d8 E! }0 m+ V3 Tfunction toHex(n)9 w2 _5 i" K: E9 y
{. Q2 ]2 q  N; ]
    return (enHex((0xf00000 & n) >> 20) +
, a% f( ?- D7 C, H) w7 }* r1 K            enHex((0x0f0000 & n) >> 16) +' k1 B$ I4 \5 n
            enHex((0x00f000 & n) >> 12) +
7 H0 S/ F4 H6 g6 N            enHex((0x000f00 & n) >>  8) +* c' K1 W' V, F3 [
            enHex((0x0000f0 & n) >>  4) +4 v. _- `; L0 J& y
            enHex((0x00000f & n) >>  0))
' u8 S" ^/ @( a1 w+ Z' W}
; W  G6 _  b% `( ?+ I3 y// Convert a six character hex to decimal
0 s3 M! Z: ~; }9 cfunction toDecimal(hexNum)9 x4 l  r7 w# z, [6 S
{
" Z9 `$ h0 t$ `: e6 u1 O# X8 B           var tmp = ""+hexNum.toUpperCase()
! v. I# w: S, u- \! r    while (tmp.length < 6) tmp = "0"+tmp. h3 r; l. m0 o2 Y
           return ((deHex(tmp.substring(0,1)) << 20) +
# J% J  p) y+ h) M+ T                   (deHex(tmp.substring(1,2)) << 16) + 0 R* w. n( b5 [+ R  i5 G& ]% J
            (deHex(tmp.substring(2,3)) << 12) +/ v1 t+ @, V! f6 D  k- W4 j, R2 c
            (deHex(tmp.substring(3,4)) << 8) +
0 P& k& B4 P! J' I+ H" x            (deHex(tmp.substring(4,5)) << 4) +/ |6 i" X% ?4 b+ \! _# U6 w* g
                   (deHex(tmp.substring(5,6))))
+ ^# P7 Q4 @; G7 k}
* D' M5 t" K) J$ ?" M///////////////////Shimmering Links/////////////////////
$ B7 s' H& C" C8 p# y9 z//global variables; P$ o3 {. K% V6 F
var hoverColour
3 I  W0 K! ]! o; pvar numLinks;
5 h/ y5 g  j: b0 E; n* fvar rate;
# {# h  V  K/ c. A1 ]+ P' S) Nvar numFadeLevels;% r2 I# b& h1 @
var bgR;
6 V# ^# W/ D- r+ D2 Bvar bgG;
+ ~9 ^( \  B+ S, hvar bgB;& o) F3 H* p1 ~- Y, M" j( r
var currR;0 Z9 l2 T7 \/ Z- X  k! t: l. J
var currG;) g' ~1 o  O3 p4 \5 \! h1 d( i
var currB;
( f! R& L/ G, r) f  ~7 evar count;
: R/ B9 Z0 B# B2 _9 z6 i, ovar fadeOut;; X  V5 i; Q( m% ?( Z& N6 ?3 E
var continuous;  t" G1 I- R6 k* y4 k! w% {
var newColour;
# X1 {* i( S  |: Rvar tID;  U5 N3 f2 x: @/ m+ y+ [
var redInterval;; e8 C3 t% Q1 g
var greenInterval;5 ~5 J% M- C7 S  k
var blueInterval;
. z: r. C) A, n- R% @function initLinks(mouseOverColour, numberOfLinks, fadeOutColour): Z; Q9 S5 \2 |3 p
{
" _/ j7 @( @# P+ o" e        hoverColour = mouseOverColour;( i+ f6 k4 X5 |" O- v5 F
        numLinks = numberOfLinks;
, ?; o# ]: W4 K0 k: J+ h7 A        rate = 1;! l# f' }2 ^% m0 `/ n; _: U* A2 l. X
        numFadeLevels = 30;
, b# G9 c: y0 G) X6 T- j9 S2 c  s; H/ C        function initArray(theArray, length, val)
! l3 ?/ P+ x) r$ f: k% g' B3 C        {
+ s( t2 y3 \! d7 A  {' ~& n                for(i=0;i<length;i++)$ ?3 r9 {0 D, ?0 L) \
                {  W, `6 H& }) W
                        theArray = val;
( [2 ]2 B5 Z; D1 F* \                }
2 h( M1 }5 j) ?8 F        }
. e$ `6 r% F, y8 Y        bgR = '0000' + fadeOutColour.substring(1,3)4 W. ]' }# X+ G# G# V4 {! F
        bgG = '0000' + fadeOutColour.substring(3,5)
3 @" W' z' ^! |) b9 K8 b' `& p' q        bgB = '0000' + fadeOutColour.substring(5,7); ~( C; {+ |2 t8 t6 ]& K" Y1 K3 Z
        currR = new Array(numLinks);) g" |4 q' b9 A/ C  W
        currG = new Array(numLinks);8 K3 `0 I; C/ ]  Z" Z* U
        currB = new Array(numLinks);6 D( \# _- }# M% v
        count = new Array(numLinks);& B/ C( ~/ F4 [& g/ L2 q
        fadeOut = new Array(numLinks);
7 u. R" D2 U4 Q# `        continuous = new Array(numLinks);3 L4 ]7 s4 T$ w+ s
        newColour = new Array(numLinks);
' K5 j6 k4 l+ K/ N3 i: {        tID = new Array(numLinks);2 c& W0 t* }% s7 o% X
        redInterval = toDecimal(bgR) / numFadeLevels;% A4 Z( h; @* L* W+ I% R
        greenInterval = toDecimal(bgG) / numFadeLevels;
% R6 h$ p' q" u% k0 i( y" X        blueInterval = toDecimal(bgB) / numFadeLevels;! d, y( K0 _$ d8 u0 @, l( m* Y$ a8 b5 K
        initArray(currR,numLinks,0);
& W  A4 S& c' ?* h0 g) ~        initArray(currG,numLinks,0);+ s; w. W3 d1 n8 o# O, y( [5 o
        initArray(currB,numLinks,0);. l) W$ v. N/ H4 S% x3 G, Z) }
        initArray(count,numLinks,0);) m3 Z( G6 D9 l; N5 m0 a
        initArray(fadeOut,numLinks,true);
% o& {: _5 ?$ l: W        initArray(continuous,numLinks,true);
+ B* Y3 }  u! }+ H+ U6 W' f8 U}       
! ?3 k  K9 `- x; S; O* N/ v9 {function startFade(id)& d" |( q5 `$ ]6 b% `
{
" S) [. ?3 Z& l# z) L        if(fadeOut[id] == true), B. U1 c; D4 x& S" d+ j% J
        { /*move colour towards background colour (increment)*/4 b$ |, F' B8 x5 J3 B0 n: _
                currR[id] += redInterval;
% K% l. t' H4 C& d9 C0 C                currG[id] += greenInterval;
! k, ?, X5 N: L8 F6 t                currB[id] += blueInterval;
6 t3 k* o" r% ^* g                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);5 ]8 S9 n6 {" F8 s6 |
                if(++count[id] == numFadeLevels)3 _" G( b+ B- g+ g, H: s4 r
                {# m: h5 R+ y8 Q+ B( |# C
                        fadeOut[id] = false;% P  ^, F4 P3 D7 w* e( ^# d
                }9 V' r9 K0 X7 m2 {, V% i9 L
        }
6 A0 E5 B! _( B5 X4 a        else
  R! D: D9 Y$ I" p" G$ ~8 Z/ x5 X        {; b' }! X. e$ r: _7 Y4 t, u
                currR[id] -= redInterval;( W1 W" W) v4 r# B

  t. A9 L3 e! U6 S0 h4 c                currG[id] -= greenInterval;
* S1 l9 p" ^) N/ F/ V; Q5 @/ `, k
                currB[id] -= blueInterval;& f8 G7 x6 F( M. h- C7 x5 D6 i' w

/ ^2 @, D* ~$ e. c4 k, V                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);. K/ n! x6 E+ }/ ?8 A
1 ^7 j! o& \$ i/ _# b0 \
                if(--count[id] == 0). @" Z* n; |3 q

" N  U# Q5 n" T                {) C) }  n- M/ c( }) j
. F" d( P2 B% u, G
                        fadeOut[id] = true;
1 j6 o& i3 N. V5 ]2 u6 G1 H! @8 _/ N/ ?' [1 u4 l# g% `. w
                }7 L! N* N4 z* v4 K
3 L$ \5 ^" e% d  t7 z
        }% R' h! h" c; W1 E. U
; U8 I5 Y4 A7 p6 r/ k3 T; z
        if(continuous[id] == true)
! [! ^5 c0 C* N/ i( X7 V* y, l& N
! E) F/ f+ r" M: w+ L# a- K        {
; e. |$ O& }3 a1 D9 l7 n3 h0 V
& w& C! G! a/ x/ Z                document.getElementById(id).style.color = newColour[id];               
+ `% g  r' F3 `; \* i
8 s9 T& S$ `4 Y) k        }1 S2 L% C: u. F

  m6 _2 [+ f7 q3 ~9 R  G& V: }        else
9 U1 T. j" W, |  Z5 t3 i) e  f
, w4 r) T+ T9 J) z  H8 _  y        {
) Z: F- {. J, j# t/ Y3 e8 P5 ~, Q& a2 b. w1 p& n; w- u
                document.getElementById(id).style.color = hoverColour;
2 }* _* s) L0 G* w! z
2 x5 s3 r9 u4 O& _! K# O        }
& O! H3 k- K% @8 ^/ }, @/ Y4 r
2 p8 Q7 k* K$ H/ z2 w        clearTimeout(tID[id]);
( o% S, B# y, Q
( f7 l7 n" V# B0 K/ v+ b0 D0 {        tID[id]=setTimeout('startFade(' + id + ')', rate);& W; U- N2 F: s3 z+ o3 m8 u

6 \; U( ?3 M" X' o1 h# g}
# x$ v4 `8 t; _9 f- L. U1 Z2 ]- d% k2 ]
function continueFade(id)2 M2 p5 ~! N; i

3 {9 R1 _0 }3 w$ ~{
9 i2 t- [# U, D& L& ]" y  |8 C% W" U$ v) N! \
        continuous[id] = true;
5 z: h: x5 x$ d! F
8 _* U5 F! }3 w* x: H) G}' O1 Z+ G- E% q! m- ]+ @4 `, F
( Q2 K6 B0 o7 q# p* H, j# p
function stopFade(id)0 ]7 r$ c7 @! |. c  V
: S4 }$ S3 k" n$ O2 _& M$ b
{% f  K& W2 {) }8 [1 f

* R+ [  L# e: K! G! Z* L        continuous[id] = false;
( [6 z& H7 r  c+ C: E" k1 \8 ~* t2 n4 Y- j6 x. }6 \! |5 A1 L
}
" m- v! n7 p+ @  }
' O/ b" ]) h% M) B; z" Yfunction StartTimers()4 N  S) _2 |% ]) B; x2 c* h& t& I
$ _4 v$ v1 W1 ]+ I& V( Q+ Q
{        //set up an initial set of timers to start the shimmering effect2 u/ d( b4 h; I4 [6 A
1 s; ?) ]5 B5 q; h- T  N1 Q
        for(id=0; id<numLinks; id++)! W- l' d, y# P2 A* h2 ]1 X

! y  W0 ?, Q- _& g% O; Z4 H8 o        {  v0 \; d8 N2 q( g$ A
$ z' a% Y9 H$ N  |, Q
                t=setTimeout('startFade(' + id + ')', id*100);( d) @" m% B& F) t" {* M

3 K9 f! ]. u: B! @7 I        }# U# f0 t" g: ?. ~/ {$ r

0 j9 V8 q1 P! g9 j}
1 R! H% z% j% y0 ]( M$ g' h& U; c
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
1 t1 T( ^) E) Z* f- @! {( N: B# @" q  ~1 N/ q
initLinks('#FF0000', 6, '#FFCC77');
  F; H* K8 c9 K. U; c0 B  o. D
4 b! k* C5 _" x! `  t//-->6 i+ o$ X3 Y1 R" z7 H

7 ?# S. n- o$ N" d# E! g</script>* ~; z% a! Q1 f$ r1 _( F0 c" F
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元6 |9 D* F1 S3 y# h/ k% I  P
</a>
4 y8 _; X6 h' \) {) W( F1 {<br>4 _3 S6 W1 Q* ^* Y
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>
3 Q! ], U7 k; R6 i% N# S<br>
% a, M: Q1 u- ^( O& j/ W" T<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>; j* q7 @  g6 I
<br>        7 L4 [* g# z. k* D: [0 o& L! V1 Y. j$ s
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
  V8 e( |8 \$ Y3 l<br>% a: v. x7 Z7 Q9 t( L
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>* U( b7 n: H$ Y2 z/ \0 g8 C) E
<br>
. O( @# r+ E' T/ l8 P& Q<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>
& r, d+ P' w  [) u8 d<script language="javascript" type="text/javascript">
, A3 \8 Q% Y9 M  S  B, W<!--
$ u- W' A. I* k# `4 x4 qsetTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
6 B+ J, _& i, g//-->
! O- t& _9 H5 a+ ~2 I</script>