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

zw2004

<script language="javascript" type="text/javascript">* d* ]  B% z' a* N; ^
<!--2 S6 p1 l4 N8 }4 V  Q/ k6 R
// convert a single digit (0 - 16) into hex
+ q' `! D0 Y# Y8 ^1 d* F9 Jfunction enHex(aDigit)
. w4 I3 s# c0 K) G4 }; D{
* q# t/ ?2 M- O$ h; V9 u    return("0123456789ABCDEF".substring(aDigit, aDigit+1))6 S" X' d8 z# C, d& F0 \0 B0 s1 B
}2 }( ?; |+ C3 y% x4 M  h( f( o
// convert a hex digit into decimal, S" j. y  d6 P! h/ r; W% i
function deHex(aDigit)
3 r8 \+ o4 j) Z2 X/ [{# j/ U. {9 s' X4 w
    return("0123456789ABCDEF".indexOf(aDigit))$ m5 T0 K* |9 C' O& E. b) H; G
}
! g. A, |1 U* T* t9 R; j7 @! J1 l, f
// Convert a 24bit number to hex
8 x+ P1 v4 D% }& B. \6 O) qfunction toHex(n)
* e' _1 v0 u* C# z8 {3 j  a{5 A# k" x0 y% ?$ M9 U5 v" ^
    return (enHex((0xf00000 & n) >> 20) +/ K, a) S; q; U8 y+ G
            enHex((0x0f0000 & n) >> 16) +- E) [4 a( r  l, e  x2 U  i: t
            enHex((0x00f000 & n) >> 12) +. h8 @( w* R/ I3 P$ f4 A" C
            enHex((0x000f00 & n) >>  8) +
0 j! G5 \7 u7 N            enHex((0x0000f0 & n) >>  4) +. }7 G; e1 ^" ^* M9 Y4 F- q# J
            enHex((0x00000f & n) >>  0))( V2 k9 s. \+ M6 W+ [4 q6 |5 M
}+ ]7 Q1 `& Z- A, `% t- ]* A
// Convert a six character hex to decimal  \) n% N, M  V9 {
function toDecimal(hexNum)
( H4 O5 ^& d4 v( ~4 U& L7 j{
. |2 }  ?, T# E, H) q* b           var tmp = ""+hexNum.toUpperCase()/ y, U! f! }  J3 z5 r# n
    while (tmp.length < 6) tmp = "0"+tmp6 Z# s/ C4 Z' p" z4 }
           return ((deHex(tmp.substring(0,1)) << 20) +5 N8 ^# R8 }7 N0 |* K, t
                   (deHex(tmp.substring(1,2)) << 16) + 8 a" p: C; b: [% h/ V
            (deHex(tmp.substring(2,3)) << 12) +
0 m" k% b/ k. j. E. [+ D            (deHex(tmp.substring(3,4)) << 8) +2 ]9 P$ J. U$ d$ |
            (deHex(tmp.substring(4,5)) << 4) +  _8 F, p$ k) x" ?+ V4 n. j
                   (deHex(tmp.substring(5,6))))
0 M; m4 |1 X" T}% Y4 D% g: W3 ?; S& x! E
///////////////////Shimmering Links/////////////////////8 a" p: x1 i& ?$ c: d" }
//global variables" Q  P3 ?, b* n- Q
var hoverColour- X% [. t& F4 {8 B4 c
var numLinks;
$ y. N! }3 n" D! z5 o5 n8 wvar rate;
' P  Y) ^2 x# D/ P. R+ d' Kvar numFadeLevels;
* B) U% ]2 b. f: ^6 svar bgR;
# n  z, h3 d! h) g: o% ]/ C0 Z! avar bgG;' e; O% e  u/ |, e- l
var bgB;
8 |3 m! D& f. |" `var currR;
: S$ V: _; S0 q$ t5 G# T  l0 Vvar currG;
. s) I+ |+ p8 c! r! Mvar currB;
1 J+ ~6 K- {/ c: t) {+ yvar count;
6 n3 @6 y- x6 dvar fadeOut;" Z6 G, Q$ k7 j1 s3 V  O
var continuous;, i0 B5 B- N% o3 M+ V
var newColour;9 j' {4 Q7 j- K& S* @2 f9 j
var tID;
5 x% g' ^- c5 ]9 [var redInterval;$ f6 u" j2 R) _7 M
var greenInterval;
0 I9 A, b& M) ?# `) W/ ?, fvar blueInterval;) k& L& j; ~% H( m3 [) q
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)9 H; L( W5 r2 H- x1 b4 V
{  @* }5 u8 q% q. w2 S) z
        hoverColour = mouseOverColour;* U/ k& P8 k8 h  {. i6 F
        numLinks = numberOfLinks;  ~4 {9 c9 C- c7 U  u) ?3 S! _8 C
        rate = 1;! m3 b. ^1 K) f# @9 r
        numFadeLevels = 30;
/ E  v& w) B& B2 M" D        function initArray(theArray, length, val)
% V5 u' K  @2 j        {& F4 Q3 Q( e6 r; r" V
                for(i=0;i<length;i++)) x* |+ x" A, n" |* r" O
                {0 l; A3 f$ w2 V( @( w) R; L6 C0 {
                        theArray = val;/ [! X! ^9 v5 N& l
                }
. X2 u& [$ x; W0 x) K7 n8 F; P        }! g- a: `  W. f. A
        bgR = '0000' + fadeOutColour.substring(1,3)7 a5 M5 x! s. H7 @6 T  a
        bgG = '0000' + fadeOutColour.substring(3,5)9 U, c' w7 ?( {8 n3 Q$ h. V; F
        bgB = '0000' + fadeOutColour.substring(5,7)
# n, i! z" H# [        currR = new Array(numLinks);+ T4 h  C, ]$ \, _# K4 t
        currG = new Array(numLinks);/ v5 p: r  ^' x. R+ a
        currB = new Array(numLinks);, {4 Y- |! |, Y) E" E$ n3 U
        count = new Array(numLinks);  }+ {& K5 ?# D0 I
        fadeOut = new Array(numLinks);) H; H; _* _: [; P; u$ U
        continuous = new Array(numLinks);
0 i+ G, i0 i5 j* p5 m        newColour = new Array(numLinks);% J; [* }$ Z% Z
        tID = new Array(numLinks);
. r1 Y: R" `( x: A: p! C        redInterval = toDecimal(bgR) / numFadeLevels;
7 K5 p* n# a0 z        greenInterval = toDecimal(bgG) / numFadeLevels;
$ I$ M$ C. o0 o- v* G0 N- {: l# g: w        blueInterval = toDecimal(bgB) / numFadeLevels;
5 g; a5 o/ V& I/ g9 J# h7 n: A8 f        initArray(currR,numLinks,0);
; o! R+ U, ~: P' V; Q$ O        initArray(currG,numLinks,0);, H- ^; f5 c- Q' I2 R9 u* U! n7 |
        initArray(currB,numLinks,0);
  d6 O( u8 I. a& s$ {        initArray(count,numLinks,0);
- s. f* h" H7 z9 B3 `6 V: \% R3 ]9 z7 @        initArray(fadeOut,numLinks,true);
3 W0 L" s* Y/ B9 \2 o% w% O        initArray(continuous,numLinks,true);- n1 P; c" m/ m6 {+ E! F; E+ X
}        , B5 J! l8 z1 M* l6 d, M* {
function startFade(id)
' W/ P$ M' R1 p' T! i0 M" b2 d{
' H  ?) |# F0 j2 k* E3 L+ v        if(fadeOut[id] == true)
+ E) k8 ^6 |: |; q8 I# R        { /*move colour towards background colour (increment)*/
* Y' U- k& Z6 h+ m                currR[id] += redInterval;! A# {+ h/ J1 q  L3 R5 }0 L; u
                currG[id] += greenInterval;  K; E: b9 }; p- R1 H$ J
                currB[id] += blueInterval;
, P" _& r! P7 Z& Q' b# k/ H                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);) b* Q  @# o8 a- l. s0 ^+ K
                if(++count[id] == numFadeLevels)% f8 J& b  W1 i" u# T. P+ l
                {
" N6 V7 L& Q+ k, T                        fadeOut[id] = false;1 G, h% `) J" a: z% w5 {
                }% b, v) H$ @' R& a
        }5 A/ K4 z0 K! Y# m. P& @  x- I! t% S
        else, D1 `4 g. u7 r% l9 z
        {( O. }7 o' i( H9 [: u2 V( V
                currR[id] -= redInterval;
, g: K0 x$ n4 R0 H
3 j: h0 K6 _( C9 h0 h                currG[id] -= greenInterval;, k: i; D- Z& w, w9 X# J3 d
7 D; ^7 }* F( c
                currB[id] -= blueInterval;
7 l. x5 {1 o/ i2 X2 w  k& _! Y% c. a/ H) @+ ~9 H5 R. x
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);6 n) x5 G; ]! n2 K" @( c# o* f0 X
* {0 K; n& r: M/ F1 V
                if(--count[id] == 0)
- K- T0 f+ n) P  L; J8 ^& j- `+ [* m. g$ {# y6 Y' P, P: {
                {
* G7 ^3 ^; k' w5 o5 E0 W6 v2 E5 z/ G1 c
                        fadeOut[id] = true;
- D9 r: P  Q. w
% R5 c$ t) @% u                }* @6 z3 `0 d, W

, _; O7 P0 ]6 m* |& N2 R        }
1 b$ ~" N: R" G7 A$ m5 k3 Q" V/ W2 c3 U
        if(continuous[id] == true)# C3 k. g2 J5 K
' y% ^9 V" L& Z2 c+ r* r
        {# |" @8 ~! D- F1 D2 _+ }
, u# M  A/ V( u# M0 e7 x
                document.getElementById(id).style.color = newColour[id];                / q( S! E3 D$ y

6 E6 o: F% ~( ]        }' D5 s9 j- [& a' ~; x  q0 `) d

: W' v7 O/ \0 q& _$ y* a: h7 Q        else# R; j& E- G4 ^/ X
' N9 l  ], m* Z( }
        {
( t# L: I/ v! B8 u+ m+ W. D2 A. J" D& |6 V* |8 j. ]
                document.getElementById(id).style.color = hoverColour;6 O$ w1 F8 y9 d0 K8 a4 A! m
2 a; B% f. B/ i" F
        }8 u" i5 i' l/ O6 @- W0 R6 l4 E
7 k: E* J0 N# I& j. G% O' D
        clearTimeout(tID[id]);" ~$ y" X1 S  C5 r' m7 Y

1 _- r7 b# ^7 `        tID[id]=setTimeout('startFade(' + id + ')', rate);
& E+ f  N; f9 O$ d/ v
: t' u! i4 ]9 A- [: `1 J- i& G}( v) R$ }  T  d! X4 B$ V

( `9 n1 H" }% ~  h9 T1 gfunction continueFade(id)  K- M8 p/ ~  }; x" f  U

& p' U2 o3 @' T  ^" \. U{5 R$ j0 g) }. S8 ~* P8 d
' ?1 E# ]( i7 B; p, a- O9 }0 ~
        continuous[id] = true;
# G6 B2 r) g' k" \. U2 [( ?5 p/ C
2 a3 ^( @* s2 u, E, F! K  S& @}
6 p5 b5 H6 X; w5 s
9 k) d' D& H6 o" Yfunction stopFade(id)
' C# F7 n* v; r- P! a1 h& W- \8 d; A5 v  l& m
{6 V) x( ]4 u/ K! X3 ?3 u

2 w9 H5 y; f9 |; X& T6 @3 Z5 w9 s        continuous[id] = false;, D( r( Q+ d( m. N2 t# g7 n: Y4 E2 P

8 ?5 k( Q1 S* C. i- y( z) d}/ o! t  j1 d3 ?
+ z& N; f+ Y4 c& n9 T8 F. Z
function StartTimers()  F3 }4 b( U7 W; }
+ M- Q  k0 l0 S" q7 C1 z
{        //set up an initial set of timers to start the shimmering effect
, ~) x+ g6 f  B" w8 q0 ^$ X5 l" F& r) U9 D5 q5 {8 Z
        for(id=0; id<numLinks; id++)- @: A9 g% g4 R* d
& k" i2 C' g; _+ X
        {
( D4 W/ ~( W2 |8 v& v; U8 H1 J' m/ [3 S! H1 d2 Q
                t=setTimeout('startFade(' + id + ')', id*100);
: b" ?: m6 e- ^; _/ k3 k# ?+ o! v# q
; ?# k9 m1 H# @# ]3 K9 u        }
5 c" _! O4 H, d
" A2 q2 V; @6 h}
6 N& \* F5 [7 Z7 a, G9 R2 x2 l. K) C) Z  B
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
! q4 E* u4 y: B3 L; y: j' V/ r: l
$ X7 ?3 z( `/ Y; O' Z+ vinitLinks('#FF0000', 6, '#FFCC77');
1 E! R) [) p% O; F+ j
9 ^& \3 W. \& T% I. [  i* ]//-->
# s* W5 S1 x+ j. \5 ]' f
8 o$ A! V; V$ @" P* M8 ]</script>
5 G7 _1 K0 {% {0 h$ }<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元& N9 |% S5 v: A+ {8 l
</a>
* a" Q( H; m  Z8 I$ \  z  v<br>
) m3 E7 x' Z9 v* a( o! A* P4 k$ h<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>+ o4 N( D1 t( M
<br>8 y: [% i, B$ N( B- D5 c3 h
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>9 h- a- @. C% D* ]' A
<br>        7 M) @) \/ W3 ]
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
- J+ L% T, T) F1 Y<br># I. h# r- G, x3 _; s
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>' M0 p: r+ w' O, U: F5 g+ |
<br>
4 T# R8 ?$ X/ d  C<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>  R: X" x4 \: o( M' T3 y6 {
<script language="javascript" type="text/javascript">3 u* C4 p" \- b- X! {8 J' ?3 p
<!--
% I7 r; g3 z! ^" r( u' RsetTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
! B) ]! Y, w: h/ a//-->
; B2 N2 m# x4 x8 O! B( x% j6 f. v</script>