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

zw2004

<script language="javascript" type="text/javascript">5 [7 s4 o8 _0 u' x
<!--
; D, D" F6 d: O6 U& x// convert a single digit (0 - 16) into hex, a9 l. B! ?. K( y1 l6 w& R$ I
function enHex(aDigit)
- J4 k, j! q3 R{
4 z% Y: _4 z. s) U# v! {: R    return("0123456789ABCDEF".substring(aDigit, aDigit+1))
$ E! K) \5 N6 v: w, A}
8 n" T  m/ n+ V2 G1 f// convert a hex digit into decimal
+ q2 y' U' Z" n1 L) Ofunction deHex(aDigit)
, w+ m; Y: U; T0 }4 ]) J{9 ?5 P0 h; X  h( d+ D
    return("0123456789ABCDEF".indexOf(aDigit))
- N. Z9 V  {5 P/ l( O+ o}; G  i; W7 m7 u) s8 M- N

' y0 |$ D7 `9 S& e// Convert a 24bit number to hex. U0 t3 q+ \1 a. I; e* k
function toHex(n)6 h7 n# H/ v$ q
{4 h$ r; U( e  x* }$ B* n
    return (enHex((0xf00000 & n) >> 20) +
% d) q1 X7 o6 q! v4 x! r, r            enHex((0x0f0000 & n) >> 16) +7 i% j; I' S6 V3 Z7 b# L
            enHex((0x00f000 & n) >> 12) +
' A1 m3 Z/ l7 D5 G* f  m            enHex((0x000f00 & n) >>  8) +( w* s9 A" g) s$ d0 f
            enHex((0x0000f0 & n) >>  4) +" f; r( _# ?) v! P; E' m5 V1 ^' K" F
            enHex((0x00000f & n) >>  0))! J2 E9 t& S3 x- c1 E! `8 t. ]
}& P+ B2 W, K& ]5 m/ t
// Convert a six character hex to decimal1 I2 U3 z: o9 }3 P5 J
function toDecimal(hexNum)
$ i% @% r0 d* H7 Q2 Q: v4 n$ Q4 q0 U{- @, C8 H+ n. V6 Q, [- P, p8 B
           var tmp = ""+hexNum.toUpperCase(). A. f0 h; r* _2 Z) W* _
    while (tmp.length < 6) tmp = "0"+tmp0 N* L- \8 s+ l+ u, H- q7 c6 K# V
           return ((deHex(tmp.substring(0,1)) << 20) +
- i* x5 i0 i3 ^5 k3 {/ |" l& Y                   (deHex(tmp.substring(1,2)) << 16) +
, B* H% G$ {) g) t2 N            (deHex(tmp.substring(2,3)) << 12) +8 f- q7 U' ~; D6 U; p. B8 s7 ]9 G
            (deHex(tmp.substring(3,4)) << 8) +
( o5 ^; F1 ^) I( Q            (deHex(tmp.substring(4,5)) << 4) +
/ G9 ]' d( b9 d2 h0 a, B) p$ D. C                   (deHex(tmp.substring(5,6))))
; o: A" Q9 H* b( e1 ^7 j}
+ E! b/ P3 G, W8 ~. n///////////////////Shimmering Links/////////////////////
8 \  [8 A8 b. |+ S//global variables
) ~) H4 V1 ^# @* Rvar hoverColour
+ N7 {! t, F6 F5 i0 z8 `6 d' Evar numLinks;
" [: \9 P2 ^( r4 w( j* Kvar rate;
4 G& `- n7 X2 u" q8 X3 evar numFadeLevels;( {5 @  A8 v6 V
var bgR;6 A7 [( |6 O1 t( ?* f" w+ x
var bgG;
/ i3 c! _! m8 z, a2 T5 D$ Qvar bgB;
  X) F- o' h" N! Y% B- B2 E" Evar currR;/ Z' c- q* R1 k) P
var currG;  {9 U, c' ~" d$ J# z, U4 o- e: Y
var currB;
$ G( L7 o) U3 K  z, nvar count;
$ ^. x( S6 @# C# ^; k3 K$ `; Vvar fadeOut;- c9 ?" x4 X7 [. u
var continuous;
* n) [8 E) q- v& F, r' |6 yvar newColour;, F. c( T/ @. e  v0 e
var tID;5 p  o+ k( c, U" n% d
var redInterval;' e" G" c; A, {! \
var greenInterval;" {3 N: ~' {6 z
var blueInterval;
* @* P1 ]5 q6 y0 U6 Vfunction initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
# [- s. V" a" a+ E{; B  T2 y& i' T7 L
        hoverColour = mouseOverColour;: V9 J" G+ r( `
        numLinks = numberOfLinks;- @% t' N+ J* e. K7 _2 F
        rate = 1;
  d9 g( X+ C2 ]9 J+ `: T        numFadeLevels = 30;4 ^$ N. b% S0 F$ i6 A2 c" q
        function initArray(theArray, length, val)1 T2 C% D, X; M" j: \$ e# l/ a
        {  m6 f& p* q9 Z  ^  n0 W8 Z
                for(i=0;i<length;i++)1 x+ @  q% ~$ s& s4 E4 W5 i: m
                {1 E! D1 A- ?" p1 d: T: v* f
                        theArray = val;) h7 s+ W8 z+ F7 z- ]: }* F: \
                }
5 |$ [- I+ G& y: }4 }5 F% c        }
% K$ q) S$ D( Q3 z% A        bgR = '0000' + fadeOutColour.substring(1,3)
- B  B6 F0 d' r4 Z- c) G  ~' ?        bgG = '0000' + fadeOutColour.substring(3,5)6 Z2 q4 q+ T+ _
        bgB = '0000' + fadeOutColour.substring(5,7)+ a5 M7 L0 \7 X5 J9 T, q; P
        currR = new Array(numLinks);0 `$ g  G5 e2 b3 O6 Q3 A1 m
        currG = new Array(numLinks);
$ Q6 q+ v5 N0 M& S        currB = new Array(numLinks);
  r9 a" ~4 H5 f. k0 l* |        count = new Array(numLinks);
: E5 S4 N1 X9 R! }7 r# W# [        fadeOut = new Array(numLinks);
% F) `: n6 z- T, {8 S0 B  K9 I        continuous = new Array(numLinks);
! }  t& C1 H3 D6 z) F/ `# _        newColour = new Array(numLinks);5 i. C2 i: h& [! `) {7 _0 y. t" R
        tID = new Array(numLinks);
. p6 n( O, ]2 P        redInterval = toDecimal(bgR) / numFadeLevels;+ D- K# q6 c! L4 h" Z3 |5 W
        greenInterval = toDecimal(bgG) / numFadeLevels;
) K! [3 T' M* e/ M        blueInterval = toDecimal(bgB) / numFadeLevels;3 {. t4 r1 y2 J
        initArray(currR,numLinks,0);
- n) g8 Z9 c3 v' b% ^2 m9 @        initArray(currG,numLinks,0);0 O3 \' Z2 x& C/ R
        initArray(currB,numLinks,0);& ]8 L) P, f4 r- W) J- p
        initArray(count,numLinks,0);" e# `& M6 ]" ]/ k5 \
        initArray(fadeOut,numLinks,true);
$ P1 \2 w* k5 m* a  v8 l9 ~5 t        initArray(continuous,numLinks,true);5 Y! y+ G* H& l5 g5 K+ L9 ?) _
}        7 N1 G+ j# n! k1 ~( l' _
function startFade(id)
) A6 M5 I0 {: j3 M{
& C9 E: M* L* A; a" U* E8 L        if(fadeOut[id] == true)
$ \* r: B2 y, W4 |( O$ U7 B        { /*move colour towards background colour (increment)*/
/ i7 U# X& [* v% J+ c                currR[id] += redInterval;" |$ t: f: |: X$ z2 C- R( q8 ]/ z
                currG[id] += greenInterval;8 T( R6 c7 G" y6 r/ p; @
                currB[id] += blueInterval;
3 d  w3 ?0 |/ K' o                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);, |- d, B4 K1 v# j, \
                if(++count[id] == numFadeLevels)
" w5 S( a% Y* l# b/ y1 S1 n                {& G: g6 T) M% [
                        fadeOut[id] = false;
8 q9 |2 T* r0 Z" W4 a9 O' k9 ~  {                }' i1 r: W/ A* q8 z* F" {
        }
+ w" C; S7 B6 N5 E% `' p7 {        else
0 c9 S0 J& v4 \' W( O1 B5 K9 n        {
7 s: y* }: H* u9 D$ d9 ^                currR[id] -= redInterval;, R' q1 F# b2 t- Q* r7 H

1 Z& y6 [: s" N/ v) O                currG[id] -= greenInterval;
; t/ H+ d) h6 L; A4 Q2 C9 \9 d4 A
2 F0 p0 A/ c; O5 K& I: p! Y" l                currB[id] -= blueInterval;1 _+ |8 h* b$ O. e) j/ Z+ y
+ j9 T% F1 O0 Y
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
* l% Q+ e# o: X0 n3 y" C9 M$ U! I; `  i$ O. v4 s6 P
                if(--count[id] == 0)
9 p# k; H- m+ I! l; C. p& o. y+ y6 P5 p7 h
                {( R4 G- }4 H5 `5 ~
" ~5 Y! l, N+ z  @+ l
                        fadeOut[id] = true;
- |" {/ e% m/ q; A+ \8 l0 V: d& A
) ?3 e8 t5 G6 c5 b/ p                }
0 X) q0 X3 v6 h8 J) ^- z/ L8 Y% T' P# V( o# Q# P$ Z
        }
/ w4 a( L$ ]3 c5 b# R; p7 V- U; Z7 [8 v7 L$ Y0 p
        if(continuous[id] == true)
$ @" r" V6 `% T* r
$ s! [' R5 O$ O* }0 j, i1 T        {6 J8 U# F1 l  u( p2 L- q( K- M: K
6 K# ?  M3 Q6 [. ~* y
                document.getElementById(id).style.color = newColour[id];                ! u1 s0 _7 R1 h* J9 ]

+ ~' Z* _+ R5 E* W        }
, W+ h  ^7 b7 S( Y( k% f* R% M; m: c0 K
        else
& _* X: Q. N' l: H
$ _7 w9 }; I/ B7 H/ H        {
2 o0 ~( j$ p% O& `4 z) B+ k" K
, e& S! U4 L" z! f- x                document.getElementById(id).style.color = hoverColour;
+ Y/ B% C& e4 h  d" J* h6 k; l/ a
        }
2 ~" Q' W, {* \; T/ q  y- k+ i+ g7 Q" ]# I0 a8 e0 I
        clearTimeout(tID[id]);
5 V% y/ a: T/ u0 S) o  }1 U, [! g2 @5 b9 t- K8 |4 I4 I! Z
        tID[id]=setTimeout('startFade(' + id + ')', rate);
: P" m4 U2 f# V! ]
: f2 c* i# w: |8 b2 X$ Z}  F5 d$ X& M- x) ]2 e  f9 g& ~

  T: E$ @8 T; x1 F, y; yfunction continueFade(id)
) }, z" E5 B: v8 M0 H7 @% P2 S9 [( G) X4 x
{
& U5 c/ F  i9 |% ?
" n+ g9 n2 c" G- R        continuous[id] = true;
, G, v. T! X0 B, }9 }+ b" Q, O4 h. C. k% J6 M6 I; t2 n
}9 i8 r' _) X. J2 M# X( i

0 s+ k1 [, i" k6 yfunction stopFade(id)
" `- o  N5 U: V4 P9 z" H6 ~
2 w' ]! Q" N0 M- q{
/ k$ L3 \9 H! Z0 |$ W% N( o( m% l5 Q
& L  ~/ ~+ ^- c( ^$ t7 u        continuous[id] = false;
& \. J6 ]# W" p5 ?  |( L- x. _+ J' P
}4 \( Z# J, }3 ^. n5 b- c6 G) B
2 ^! X8 Y7 r) \5 @, E8 k) q; p$ D8 o
function StartTimers()
' Q: O; ?* L* S$ N' x" d. l5 h8 j: y: M
{        //set up an initial set of timers to start the shimmering effect! `9 a; {. G! g& J) F* Q" h
2 m- Z$ l/ h, u+ }3 X' H' w
        for(id=0; id<numLinks; id++)
2 \4 V0 W% M6 E% }' H: z# |( `" ~; g  l7 G
        {
& m6 z: T1 N- `4 Z8 W
" D& ^- S; O$ u5 J! p                t=setTimeout('startFade(' + id + ')', id*100);
1 U; s! n6 o  X" V, [, Z/ ]& j8 K
2 H% c' s# o9 F% w+ T$ m/ M( i  |/ j        }/ W( Z) T; P. k* `$ S  {
, C' x. N. _) [0 X! x3 N
}
$ r. Z) d- V2 [6 R& Q; q9 \# P  H7 ]  _
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
* L3 g+ i' \% ]  j/ q# m$ j
. b, J  A( q* XinitLinks('#FF0000', 6, '#FFCC77');+ y$ d& o  {0 e: p- K9 K: ^

5 o1 _& A$ |$ m. A/ z+ I% T//-->
0 R9 R# h: y0 z0 L! B$ U3 D, [! l" ?; h& N& n6 d; i
</script>
5 y9 L8 ~6 p- J5 k( |( S<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元; h/ {+ G) Z+ y6 ^
</a>; `$ r5 Q! Q6 @
<br>$ L1 Q* G% ]$ a' V; b) P9 B8 m" d! r* y
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>
: S! s2 f; z* y( N<br>) Y5 x5 R  ?! J( l/ U4 H
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>2 B. f7 V1 w# d' I+ b
<br>        9 k5 \4 v3 L" h1 A
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>7 b- c3 |, {$ N' k( D4 b" v6 q
<br>
( ^( M  @7 A" w7 ]. I<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>! e, t# g. Y0 J; z( a
<br>' T& n/ i! H( i9 G. w& B# r, \# ?
<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>  \1 H$ x+ u4 B5 I7 x
<script language="javascript" type="text/javascript">) j# S: w2 e  H- D0 F
<!--2 R! f: s4 |) j4 h' d& i' n/ c/ c
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering: u3 }! ~/ J; E6 c2 ?4 U. g
//-->
3 c4 X( y* S: t- Q& {# x9 A$ G0 a</script>