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

zw2004

<script language="javascript" type="text/javascript">
: ~/ ]- Q7 t# [; b' l<!--
8 }6 B  C: V- \+ X/ B// convert a single digit (0 - 16) into hex
$ j9 N  M% p8 Z7 g# \function enHex(aDigit)
4 H3 M% z: D8 _* N) r{4 I" W1 `9 \5 X
    return("0123456789ABCDEF".substring(aDigit, aDigit+1)): C  Y8 B! Y7 T) q- N$ _
}) R7 J8 y9 L0 A! @6 y, K( M
// convert a hex digit into decimal0 [# j" R& p" l; u
function deHex(aDigit)
: ^& Q$ |! U0 v4 h5 k- \: b: O{% L& B1 ]+ V) x  X  u: M* q
    return("0123456789ABCDEF".indexOf(aDigit))
+ ]% X$ O: y% X8 r8 u% e}
: ?' m1 M' I. H+ {
' v+ l, L* A* A// Convert a 24bit number to hex; w7 B- D6 s# W5 i4 ?' _2 X
function toHex(n)
1 x6 j' K' l9 |+ I2 i5 N{  t( _; w4 G) o7 g: d7 H
    return (enHex((0xf00000 & n) >> 20) +
: t# j( E$ Z! B8 Y# [3 n: g/ z$ ?            enHex((0x0f0000 & n) >> 16) +, q4 p# @* v7 D" a& G
            enHex((0x00f000 & n) >> 12) +0 D. {3 j, \4 v: c# _& `
            enHex((0x000f00 & n) >>  8) +
9 u7 D! e7 g  P# w' w9 @            enHex((0x0000f0 & n) >>  4) +
0 Z1 i" u- v( ~- G            enHex((0x00000f & n) >>  0))
* D" s/ t. G8 o- r- m1 V5 Q' y}$ n, {# a7 H3 a% s- H
// Convert a six character hex to decimal0 }! Y2 W1 F# ?
function toDecimal(hexNum)3 @2 a, C2 U6 H
{8 m, a' k" X' X; t
           var tmp = ""+hexNum.toUpperCase()$ v( R0 N# P; U5 y7 P5 B' Y
    while (tmp.length < 6) tmp = "0"+tmp6 |  C; v: p1 P+ g" k  u
           return ((deHex(tmp.substring(0,1)) << 20) +
* m* w. T$ p/ G                   (deHex(tmp.substring(1,2)) << 16) +
8 F' w: S4 L3 T( t" f0 Q& O            (deHex(tmp.substring(2,3)) << 12) +1 f% W) v- q" h2 F  |* h3 Q1 p# o6 S
            (deHex(tmp.substring(3,4)) << 8) ++ ?; c/ E6 v- ]
            (deHex(tmp.substring(4,5)) << 4) +
2 r: p) w) \) A8 ?                   (deHex(tmp.substring(5,6))))6 a8 i0 }' t; z
}3 i( h4 |! j% c4 _
///////////////////Shimmering Links/////////////////////
% @8 e! C8 T/ _0 e- H//global variables
3 g; R# o  Q3 F! uvar hoverColour9 u( x. u; ]" S
var numLinks;$ i1 c& m$ k/ U5 x0 j* E
var rate;
7 B" O& }. z# j5 q- e7 G7 k. ?var numFadeLevels;
. `- V4 m0 u4 p9 Y. Y- r) e, cvar bgR;0 {4 Y- E1 f9 D5 v0 B+ @
var bgG;1 g1 v3 l( y. w* B' |
var bgB;
0 J/ @) `, Z2 K7 J- Yvar currR;
4 x  ]) t' F6 w. X& R2 Vvar currG;
3 W6 \9 n2 u. C" h* Q1 _var currB;
1 C8 p/ a* G, i" G8 W! Ovar count;! Y0 X5 s% {) A/ b& z1 f
var fadeOut;
+ _! T# o* Y6 y6 D  o" Rvar continuous;
2 D2 Z( S8 e9 M0 V6 lvar newColour;
0 Q3 @& i! S% nvar tID;$ c/ [) j' Y' K
var redInterval;$ {8 C/ m/ K1 b: d
var greenInterval;
, _6 U4 g- b4 u; Rvar blueInterval;* e: [0 _1 A7 r# D
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)- ~* K$ L% _+ x; H4 h) |
{* K6 e% v9 e/ a( _9 e6 [8 X
        hoverColour = mouseOverColour;
% j$ F$ d2 e2 a! `* a" E        numLinks = numberOfLinks;
9 u, ~3 y- R7 Q5 j$ p/ s  S        rate = 1;3 H  x  e  t& \
        numFadeLevels = 30;
8 [0 g' M+ S& a+ Z! Y/ V        function initArray(theArray, length, val)
- a) R  C# h5 E0 o! A        {  o9 F: S0 L+ i" |8 s5 c; o
                for(i=0;i<length;i++)
4 e  y- k7 U( W( V* s, U                {" A1 b( x. `  u4 S+ h# n  c+ S
                        theArray = val;
/ `. u6 E+ `" q7 W+ [8 T0 _                }) K2 l0 q9 P) G( d/ W+ v+ s
        }
" G! a$ f3 P2 b' f0 ]5 S- V# O0 m- x        bgR = '0000' + fadeOutColour.substring(1,3), T5 h: b- Z- P( S( i1 O4 k
        bgG = '0000' + fadeOutColour.substring(3,5)8 k: r2 h9 O$ I7 _2 I8 }
        bgB = '0000' + fadeOutColour.substring(5,7)9 J5 i1 l8 z7 {& q% @. n1 c
        currR = new Array(numLinks);, |1 R2 d; i( l2 h
        currG = new Array(numLinks);3 q" E9 g6 R; w- j  N3 m0 \, N
        currB = new Array(numLinks);% y4 ~2 {3 S1 j
        count = new Array(numLinks);
9 @4 l% B) J: k8 h. L        fadeOut = new Array(numLinks);" N- P" K6 c1 v* A" M& {2 n5 T
        continuous = new Array(numLinks);' {) y- E  c( g$ R
        newColour = new Array(numLinks);0 @4 \' i2 D$ ^$ I
        tID = new Array(numLinks);0 r# B* I8 R1 t
        redInterval = toDecimal(bgR) / numFadeLevels;
. i# V$ Q0 l+ g& S" q' M8 U8 e        greenInterval = toDecimal(bgG) / numFadeLevels;# @) S& r- x2 T% b( f
        blueInterval = toDecimal(bgB) / numFadeLevels;
4 U& `0 b5 l" J) B* P* R        initArray(currR,numLinks,0);
% @6 S- r8 J% y: G        initArray(currG,numLinks,0);/ J1 ?$ f& [* ^$ Z' x
        initArray(currB,numLinks,0);
4 O8 w+ N$ V% z2 G        initArray(count,numLinks,0);
( Q3 d: s, |2 J# {. a$ m( c        initArray(fadeOut,numLinks,true);
% O% E+ w" q# o) j        initArray(continuous,numLinks,true);6 t. {; ]+ `1 C
}          b) [1 r7 e6 T2 ~% [% L
function startFade(id)
/ f6 D, t& w2 b9 H# \* p# c1 o{
/ j8 T( K, d+ t4 ~0 B        if(fadeOut[id] == true)% j+ C* W! h% {) z1 ~$ \3 w7 Z+ f( O
        { /*move colour towards background colour (increment)*/1 P4 q" D( H3 `* o3 Y
                currR[id] += redInterval;3 k$ D0 g5 a: I1 t% r
                currG[id] += greenInterval;
, G0 o. D  \0 A! U6 _4 O. y                currB[id] += blueInterval;
3 G( `+ ^) Z* `! w: _/ J                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);' G& N/ _6 Y& C
                if(++count[id] == numFadeLevels)
2 n' j! c7 z: O                {* [* ^- O* r  Q% \
                        fadeOut[id] = false;! a& E1 I7 ]  R9 k
                }
0 w3 }% L* _" f6 A        }
, k8 j5 G: U' {3 c& k# Y7 `+ o        else2 X0 n, }' e" A
        {5 l+ F$ C) ~4 ?( T, F
                currR[id] -= redInterval;, O0 \+ f# W( _8 ~) P3 N0 P
5 }( w; X* o/ D9 C$ }( \) r! V. R
                currG[id] -= greenInterval;
  U$ m* d6 y) C# `2 y6 H2 e8 z, x* N+ C  _8 S  w
                currB[id] -= blueInterval;5 }$ D. }3 u7 L  E2 k" b

% z* q% s( D  I& F4 L                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);  t+ }9 }, g% U6 j
3 n0 w+ c5 y& ^1 j4 k
                if(--count[id] == 0)( A6 G# ~2 G) A

3 \4 p: g) `. U$ r0 [                {
$ ^2 Y9 c& P! H- i  k) f- X- A
3 t* d: u- L) A                        fadeOut[id] = true;
* {' B$ {8 u/ @
* F, V" t1 A  U; w$ m! R                }( ]+ E, X3 h' g. W0 n  }
* ~4 V1 ~. n$ Z
        }( r( @2 Q$ S# h! e
# x0 U) _& P* Q) ^2 Z8 B
        if(continuous[id] == true)8 M' b0 Z0 ~2 R6 M# U% w

  O% c% t5 x9 p$ ?5 c        {
  Y( \2 |5 ^; v  K( _
/ \  m8 b% ]0 `                document.getElementById(id).style.color = newColour[id];               
# H4 N- t6 K+ _! e" R/ m' f0 R$ n$ [- J* }1 y/ f( V: E
        }
$ s0 o, \" m: j& B0 k- i
! b- y# z8 D2 t* p0 m        else
. T7 X; V6 @% o' ^) q
( r6 M2 |) D: e        {
' o- W' ]( B5 p0 a9 n& _; M" I0 d
                document.getElementById(id).style.color = hoverColour;
1 b, @! u. X: @
' h+ D$ [4 u- @& Q        }) t6 b5 v8 g" q( r
6 f0 t# \' C5 S. W' j
        clearTimeout(tID[id]);
9 {: Y2 L4 ^3 Y" n# U% v' A/ t4 D6 _3 R$ v4 S8 C  J" a! R
        tID[id]=setTimeout('startFade(' + id + ')', rate);
; [2 ~+ t( ^5 B; R6 T8 r" S  \0 @4 a: R6 j$ a! a5 b7 e  k
}
% l0 H4 Z2 c7 c# z3 _* S5 y# X6 W* t. E' A. {* A  h- S
function continueFade(id)
# u1 O! ]4 l& G& @  Y) k- W) g9 _
! H; p4 c( z! I' w3 c+ e{
) ?* Y6 ]$ g- E. f
; ]- ]5 I- K  [6 K* b        continuous[id] = true;
" v1 r$ o( C+ p. c, T
2 ?* e: @9 }* P1 i2 l, m}
9 x2 v2 P6 }2 T7 x; _" u& t! z# m# ]. g& @* Z! s" w
function stopFade(id)/ j5 H# o3 g; k2 F6 m% b: o! g" x

% J6 o! ]; i% {. ]{- Q8 y( W0 ]# o. {8 Z' S

- x9 o6 e1 ~& Y  d+ r" Y        continuous[id] = false;
4 D* u5 `# i) U$ v5 k' H! P& W% f, j1 y- K
}
' Q- P; Y4 ]+ i1 X& \2 V8 f
3 l9 w9 M/ t. k* w2 X, Jfunction StartTimers()6 ^% E8 e8 J# Q3 B" n- X" O- q
( p5 ?! R# A6 U. f; ~
{        //set up an initial set of timers to start the shimmering effect
* D. j, b3 Q6 O9 L/ Q  U4 Q( ]5 m
        for(id=0; id<numLinks; id++)- L& `5 P3 y- J5 y; r2 b

* A" V( F6 K6 k. u7 F- V7 Q        {
: V  u. u9 ^, C* x' q# }' E7 L, U
7 j% Z4 Q. d1 V  @# V" c                t=setTimeout('startFade(' + id + ')', id*100);
1 V5 B. |. U1 m7 U9 R
& M/ s! w3 g# \0 r2 P        }2 X0 u0 A/ n. v: f

% n/ Y# }7 q: |/ ^( [) S. I}
1 r3 p0 X9 M/ ]( F: T5 W: b9 n% t& X; N! ]& `
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')4 l1 R- ~( H7 g' `$ N" T
* q3 W( T% [1 O( \" X
initLinks('#FF0000', 6, '#FFCC77');
9 E7 `# |6 d& ?* Q) ?
) g% V9 j* F$ v* O, S: @//-->
; _  a0 ~! U& V. d; B0 G
8 o( n; }6 m7 m( n# u* V</script>& I+ [, d( {, `" T$ c; Y
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元* Q6 N3 A2 `8 M& y& `
</a>
* _1 M, O: J. j4 X<br>
6 H8 a/ S* h8 w1 Q8 F* O<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>. n" d4 m6 k( F" ]9 Z  i
<br>9 i+ J9 i8 _2 H+ e6 n8 V
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
; M- o2 v! w! W& K9 n  l, C; `<br>       
, F  B9 `% |; o8 T- z! E5 |<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
8 o: o) `% `6 M6 H1 F/ _: N' h2 W2 ~<br>4 s( e0 x) T" z0 w5 s. e
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>  i8 N; ^% a' M) k7 b) j0 a- s
<br>
6 F8 i( B5 B- o<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>: H+ }" p/ V( D# Y- e
<script language="javascript" type="text/javascript">
  m9 p6 b* N2 [0 N8 i<!--
/ O  z$ Q9 }  H, ~" @3 [6 isetTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
0 M  l+ D4 C, s8 n+ F* S//-->) j; p8 M9 ]" U5 N" c7 j
</script>