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

zw2004

<script language="javascript" type="text/javascript">& `8 ^, }, E' j/ W' j
<!--. \, V/ t+ d8 o
// convert a single digit (0 - 16) into hex
/ H7 y, L0 A- u6 Mfunction enHex(aDigit)
5 L% {5 C1 L' w( {/ S{7 f: V6 a$ D! s: q
    return("0123456789ABCDEF".substring(aDigit, aDigit+1))
  t. p$ r* F8 Y! t, m$ b}
& S% D2 [6 ^% x+ o. {$ G% _// convert a hex digit into decimal" e/ P+ M# ]0 O9 R0 q
function deHex(aDigit)
- i/ s9 K* ~3 ~, b{
" L' o; v- t/ |. c9 ]    return("0123456789ABCDEF".indexOf(aDigit))  E' y! t( K6 m' |9 \
}/ `" _* h" r# x5 i" \1 C

/ Z0 i. A' p5 ?; S: _$ I// Convert a 24bit number to hex. P. t! i7 I5 D+ X% o
function toHex(n)
( G* M9 l3 v  F+ {1 F{  Y' T) V' y$ t- z: d% }! h
    return (enHex((0xf00000 & n) >> 20) +
- u* _: U5 g- I0 Z7 q8 p% p1 K            enHex((0x0f0000 & n) >> 16) +
# r* i# n$ x: T            enHex((0x00f000 & n) >> 12) +
" p8 b( w3 {9 h% q! }' X) d0 |            enHex((0x000f00 & n) >>  8) +
8 w. G* `  _9 k; [            enHex((0x0000f0 & n) >>  4) +
5 I! v1 O  q7 t3 p            enHex((0x00000f & n) >>  0))
9 j# |# p8 u- i}# m# g3 V9 F- U! `8 O4 l, [
// Convert a six character hex to decimal3 p$ c& X7 x- y7 Q
function toDecimal(hexNum)+ E. t- E, L% u# ?( W
{0 D; g# s' Z" v" L
           var tmp = ""+hexNum.toUpperCase()
) z# W! Z0 @  @( F$ x    while (tmp.length < 6) tmp = "0"+tmp
. i( B" f. M, P# m7 w4 H           return ((deHex(tmp.substring(0,1)) << 20) +
7 r' x' O6 W% a6 |1 ~9 a                   (deHex(tmp.substring(1,2)) << 16) + # N* E! |7 }( y" p  O1 O/ E
            (deHex(tmp.substring(2,3)) << 12) +2 T: J; m) a3 r
            (deHex(tmp.substring(3,4)) << 8) +8 E4 a: R4 B  Z# V! \
            (deHex(tmp.substring(4,5)) << 4) +
  W  r" L/ X, a; D                   (deHex(tmp.substring(5,6))))
6 ?' L. E$ |, p2 j}
3 M$ _' [0 y( x///////////////////Shimmering Links/////////////////////
8 [9 M- j# t; E7 m5 a//global variables
6 B/ J6 l3 o' r$ ^9 u% T* c6 Dvar hoverColour
1 a( _+ b/ G. Xvar numLinks;1 `1 Z0 I' x3 n$ }1 Q' ?+ K
var rate;! N) R  x7 [/ ^6 E6 O3 l
var numFadeLevels;
4 c, {1 T- Y2 A; a+ [; Evar bgR;
$ l7 u+ e! E) |6 Y+ B- \var bgG;. c2 t3 T! L+ l* p. d) x# Q# @
var bgB;
& j! x6 O, b# X+ x- w- }var currR;
+ \" A2 K# s& c* ?) [var currG;) i' y# E& k1 I
var currB;( h3 q/ C3 X5 [: O7 ~9 z4 s0 ?
var count;' g+ P! A. A% M( R
var fadeOut;
  ~4 Z0 I: Z) D1 g, bvar continuous;
7 q2 g6 ~3 r2 H# ^3 @* V6 @7 k% lvar newColour;
8 V3 d$ n5 |1 Z+ X7 b) x' o/ Z% C5 Zvar tID;
' Q# t7 F) J4 L- E; m, A& |var redInterval;
: ^( }  X; P% g& K3 `var greenInterval;
( u2 k/ X" H; X/ \  ]2 V8 fvar blueInterval;% b5 g$ [; n0 j
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
  e$ G7 p7 W  \! ]% T% R: r{
  c3 S/ L. D: L4 U1 B3 S- m: k        hoverColour = mouseOverColour;
* R, x, n/ F2 r6 W; \        numLinks = numberOfLinks;; d3 W$ r8 y8 |" u: G: P( U4 t
        rate = 1;
1 B$ t. \- R" y" X) z, \! K        numFadeLevels = 30;
3 v, O2 |+ i% T' q! U+ [        function initArray(theArray, length, val)
: K! G) q' @" r, r* e, N' i7 `6 H: f5 @        {% V8 t* z3 J+ l, W+ Z" X1 h! _  R
                for(i=0;i<length;i++)
- J- @. M5 R2 e5 f% R                {
4 `; n1 o+ L  v# x                        theArray = val;
7 Z' r& o5 ?5 v                }* Y! i( @7 C. o& X) B9 @/ u6 f
        }
/ @2 p, _1 T: m0 X        bgR = '0000' + fadeOutColour.substring(1,3). I2 z* V5 |) v9 [, N" |
        bgG = '0000' + fadeOutColour.substring(3,5)
! i2 B: f* p! q# G+ \+ p        bgB = '0000' + fadeOutColour.substring(5,7)
7 Q4 a8 q0 u+ Y9 F$ W        currR = new Array(numLinks);9 X0 \. J0 M% y+ h
        currG = new Array(numLinks);) K" U, o. t2 O4 w! D$ ^3 z
        currB = new Array(numLinks);5 w! B% s% l& X- s
        count = new Array(numLinks);
" X" t/ o9 o9 A        fadeOut = new Array(numLinks);0 a% C3 \, V8 C
        continuous = new Array(numLinks);
, z/ [: O) Q5 Q4 e) A, K4 ], u( k        newColour = new Array(numLinks);8 Z  J9 A3 ]! n9 L  R# {# ?
        tID = new Array(numLinks);
7 \3 e3 g) ^' G8 V" J# l        redInterval = toDecimal(bgR) / numFadeLevels;/ K) K+ J+ W7 o6 l2 r
        greenInterval = toDecimal(bgG) / numFadeLevels;
* h1 }+ b# X' U. K3 C- o; j. u; R        blueInterval = toDecimal(bgB) / numFadeLevels;1 j* [1 {8 a5 K6 T6 L
        initArray(currR,numLinks,0);
8 Q: K$ V! g) {4 D7 x6 U        initArray(currG,numLinks,0);4 U6 C, F' a' Z: b" y7 V7 r7 u
        initArray(currB,numLinks,0);
! `8 ~- {9 Z0 L- b3 z8 o6 L# \        initArray(count,numLinks,0);
# e% b8 U+ n- M" a        initArray(fadeOut,numLinks,true);% B2 Q7 R5 \% M7 y
        initArray(continuous,numLinks,true);& N( u+ r9 z/ C# z; K  r' ^& _
}        1 W# |7 V8 @  Y; P1 O
function startFade(id)! I! \( q+ v$ A- k* V  e8 [/ L- D
{
( ]6 |' x8 R' t; M7 v4 o4 }: N        if(fadeOut[id] == true)
2 [9 G9 O1 a* g3 `9 U        { /*move colour towards background colour (increment)*/, u( m' K  d3 g- U! z
                currR[id] += redInterval;( X) X% S0 U5 v( [2 r" N+ Y
                currG[id] += greenInterval;+ j! g; t& D: \1 }- |+ X# j
                currB[id] += blueInterval;0 O+ e+ n) ^5 V7 F- G3 n
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
. i; u) [+ M& z. R$ j                if(++count[id] == numFadeLevels)
4 q8 q4 p! T: Z                {" O* s4 w4 H& z2 S
                        fadeOut[id] = false;, |* u% }1 s# ~: H% ]9 }: k# c( o1 Y& `
                }9 S, ~+ s3 x' ~" h; |+ H
        }
: e' k0 j# M: W        else2 h1 m* i" X1 }" ?0 f; _$ d
        {: e( `8 b! u3 x4 ^7 r
                currR[id] -= redInterval;
2 R+ c7 h! M/ O0 y, O
: T9 f( N" D+ `                currG[id] -= greenInterval;
3 [, u% T, ^9 j' h1 M- I0 L5 d! Q
                currB[id] -= blueInterval;- J9 ?- @8 t. ?
* K8 [% o% s4 \# v
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
3 t' B9 m, S& B& S7 @; r6 {4 _: A
5 _9 m: [9 d1 e. M4 P1 w                if(--count[id] == 0)
+ c- |# t' l; }3 e/ y, t' f. |" ]
                {
4 N# m0 h8 ^3 g) j
9 N) @3 D3 G6 G  ]                        fadeOut[id] = true;
) d5 y8 T, P; C7 k% X! F4 I8 r
( Y9 V9 ?; \0 {0 e+ S                }3 O( B3 ^; p  h$ e$ l- `$ p
* b# K8 d) p6 |4 N
        }% O: G3 v7 U1 D; [1 f& S

# v' ~( w2 ]$ Z+ k4 w        if(continuous[id] == true): P' Y0 l0 b) z

' F4 f8 z" N4 \$ ~/ v2 u        {
4 ]% K6 n8 |' `! S- S' o  w7 D" N; W3 O, t/ O
                document.getElementById(id).style.color = newColour[id];                $ z: o' Q: f4 E6 z

$ e8 r# h! I; W# A        }
, M$ c* N) u' y7 @+ U7 U
) t) d" c6 N/ Q3 j, _4 B$ ^        else
6 S0 x8 @+ r$ p$ q
4 i" ^+ a. o2 y) g, n        {( W: ^' R7 e/ i% d7 s- e* U
/ |  T; \% ]# b! c
                document.getElementById(id).style.color = hoverColour;
2 @9 D) V% A5 i/ T, o; F8 K
- {3 [. n' r/ S) a2 ^7 `        }
* A. d7 P* m& t& B0 q
( r6 X4 W' n1 m4 X$ {# A        clearTimeout(tID[id]);8 ]: \4 `% v' J; c( @% M

! d/ k3 _: D, A+ H1 E; d        tID[id]=setTimeout('startFade(' + id + ')', rate);
; k1 L) j% _0 z( {# ~
% ?% [# o0 u8 a0 A. t}
5 x' Y- B" t# Z/ J4 B
* o& \1 `1 {: O2 ~function continueFade(id)
; K  V- v( }; m- [8 a* l8 f6 P$ ~2 n" Z2 q& H! l4 M* X1 k
{
9 b1 r1 {( u0 T9 _+ ]- ?1 t2 v
( u4 \- v- z' ?7 ~$ g2 _8 h! v1 d        continuous[id] = true;
$ d( `7 E" ]! g$ t0 ~% Q6 i' d- e- c; O0 a
}3 I% b+ P" y9 J3 V

' y  h" D, ?- Vfunction stopFade(id)
) T  I2 f5 O+ A6 N* F5 t) o* d! s* x# U+ |% {
{2 k0 }; U, d& Z
, c2 B7 {4 d9 E* [: Q8 P- ~
        continuous[id] = false;
2 a. D" z' i# T2 m/ j" O9 F. v2 G( k' ~
}# O1 ~, X8 M2 B+ i4 x) m+ c" N- M
3 M* }7 m6 h# a" _! j
function StartTimers(); d2 H8 _0 l/ z' O
6 }! V$ W* A/ i& P
{        //set up an initial set of timers to start the shimmering effect
  s3 Z0 B# h3 R/ h* I( h: I: N) Z4 z) G0 z4 N; m
        for(id=0; id<numLinks; id++)* n/ U! v# n8 \- ]
. P1 T; H7 w1 I8 ^
        {; V) c7 X' y8 @+ q# O2 g/ ?

8 S: ?" o1 F! Z/ q                t=setTimeout('startFade(' + id + ')', id*100);
# ^! f8 @1 J& a& l
( l  B  o0 N: a. K3 u& ~+ U4 s        }! d! w' F7 Q% q3 Z4 m
9 ?9 Q# Z/ T4 }) s
}( D6 A) b" U7 A. P) e0 P' O( P. v/ B2 q3 _

. Z* y8 {8 W- [; x: X, l& F! ?//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')6 {- t4 k+ X+ O- {, P) @: I

$ Z9 i! ~: |0 {( L: S3 h+ zinitLinks('#FF0000', 6, '#FFCC77');
2 }- q1 m' G/ K( B- I
* L+ b  q( F; O% b//-->- p, {6 p" {3 Q7 i( @/ Q, x

. c0 P/ D2 R3 F8 E' ^</script>- a7 O9 ~2 }0 y
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元3 E# w9 L$ [0 x
</a>
0 E: W# `6 _( z# ]6 t& u) Q<br>
, ?( N) X& g/ d9 y8 g% i9 b( Y! z<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>0 A! z- b1 f. e$ G
<br>
4 t, n# y, g: }<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
1 `# R' {; }+ |1 e8 `<br>        8 N# K- A7 c% x0 \+ r$ e
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>4 P) o2 `) l& F, M- Q% z
<br>( p9 d) P7 I; x7 ?$ Q$ S8 z4 y
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
: |. v- P! V5 S" E4 i<br>7 h* A" V# m  J8 y& }( e
<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a># G$ }  p2 |" Z! J' J
<script language="javascript" type="text/javascript">
. p7 l9 L( N/ R# j1 l8 ?2 v<!--; g' H4 m, j8 |/ M/ X4 M
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering- b# I) c& Z, O8 x
//-->
  J) `) Y, R, }* N% b! B4 c& P- \! M</script>