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

zw2004

<script language="javascript" type="text/javascript">
; }0 F$ @1 i" B0 w5 k# o- I<!--, C; d$ F7 T2 b
// convert a single digit (0 - 16) into hex5 e; A$ d5 g9 X1 A2 E
function enHex(aDigit)
/ p3 [1 v) D+ Y8 f! ]{
& p; P9 W# W0 O  n8 o* W" _    return("0123456789ABCDEF".substring(aDigit, aDigit+1))% q; `, ^- K3 i! e* d
}
$ X/ Y9 L* d  L// convert a hex digit into decimal: H" ?6 k1 s% E& M7 p
function deHex(aDigit)
# D4 u$ _: \% n7 [( T{
2 x* U3 X. m3 e2 W& F: H    return("0123456789ABCDEF".indexOf(aDigit))
4 ?1 f0 P; T2 ]1 n2 a: @7 O$ o}- R) M/ o3 J7 C/ r  l
! z+ K) d+ G* O# X
// Convert a 24bit number to hex
# @, P( C  P: b( K: }8 q; S# sfunction toHex(n)2 T, M$ e+ ~. l
{
2 p, F. @8 Z' g; Q2 k    return (enHex((0xf00000 & n) >> 20) +
5 `9 D9 u5 o# n8 s            enHex((0x0f0000 & n) >> 16) +
+ x$ \; Y+ Z9 {2 `            enHex((0x00f000 & n) >> 12) +
" @5 c2 y% X7 L- Y7 ]- c; v  O            enHex((0x000f00 & n) >>  8) +4 X5 c+ h; c9 R% @" x6 R# r; v
            enHex((0x0000f0 & n) >>  4) +4 n# T% R) ?; A; G6 f$ }; \
            enHex((0x00000f & n) >>  0))
  u: s8 @6 _7 _# J& v- ?}
" G6 W1 Q9 s% ?' X& Q// Convert a six character hex to decimal8 l& d; l! v! Y+ J& W4 Y
function toDecimal(hexNum)
$ i4 u1 o* q+ T+ S3 n) }{6 h! L7 v( _% H4 |5 a' Q0 m
           var tmp = ""+hexNum.toUpperCase()
9 `  v' x) W4 u: ~2 G    while (tmp.length < 6) tmp = "0"+tmp
! |2 E' r$ u; S6 {9 R           return ((deHex(tmp.substring(0,1)) << 20) +
1 \. S* N1 ^6 T- `. E                   (deHex(tmp.substring(1,2)) << 16) +
5 Y" D( `; |/ ^, {( f            (deHex(tmp.substring(2,3)) << 12) +
8 }, ^4 C& ?  `5 l& H1 p2 i            (deHex(tmp.substring(3,4)) << 8) +1 f) v2 h/ m5 @. E/ M# Y) J0 k
            (deHex(tmp.substring(4,5)) << 4) ++ \2 i" Q1 |7 k+ w' W
                   (deHex(tmp.substring(5,6))))
! R' W( w2 B5 a  k( M2 b+ j8 T}' D  s" I7 R1 @/ v6 ^9 B
///////////////////Shimmering Links/////////////////////
9 R/ h1 K& y. N4 L//global variables
* N% I6 I# Y' B! e: Uvar hoverColour3 H% _6 o3 i* C
var numLinks;
9 h5 D* f& F) ^) k) r6 U( r* yvar rate;4 j, _9 P3 @# Q/ W% t1 F1 `$ q
var numFadeLevels;
, P- H8 [% R" d' J5 t7 @6 ~: |var bgR;
- L3 s8 f; F1 Rvar bgG;, M1 Q$ d/ r# p( S$ ^- B
var bgB;
+ `% {. i+ P% x4 Vvar currR;5 C1 I4 C$ W& }
var currG;
  ~, ~, z1 l' c+ Cvar currB;6 i0 l) y! a! {: F1 j+ n2 e+ B. H  O
var count;/ T* ]& |( @9 r8 O4 V0 E# z( q2 h
var fadeOut;
% k8 K5 {4 r$ Z% {var continuous;, z; L# Q! k  b1 w# W  y5 y; E1 R
var newColour;% L2 D/ u( g  x6 Y
var tID;8 X: ~7 ~" k2 y* a% M8 C
var redInterval;$ l( q/ R/ O7 ^' _8 U) T
var greenInterval;
5 j# _' Z" `8 {& N/ L/ a3 Evar blueInterval;
, \& w+ V! H8 ]- B/ D4 v1 Cfunction initLinks(mouseOverColour, numberOfLinks, fadeOutColour)1 i/ l/ j6 {0 _# g$ _, f
{
& O( g% @3 m$ A        hoverColour = mouseOverColour;" J' X- h- j& S, V$ N3 f* L
        numLinks = numberOfLinks;" F- R) ?/ l, ~, Y
        rate = 1;
9 M7 Q4 o- U+ g: c' S        numFadeLevels = 30;- G' P4 K; g+ L, o" v1 P0 W
        function initArray(theArray, length, val)
" ~# D" f! \) J* l5 Z' _9 u        {
% i& ]  [8 r' _9 `# e5 b& F$ @0 C                for(i=0;i<length;i++). C. R% I6 k) K. H7 V$ O
                {% I6 N$ e: f4 G6 m1 t
                        theArray = val;
- \; @" v* ~3 R/ `7 j( i                }
7 u! D$ X4 _4 v. G1 A( A        }
) j2 l  ]- p) S6 Q- g! O% ~        bgR = '0000' + fadeOutColour.substring(1,3)6 h1 y$ }% T' q: Q0 |: L
        bgG = '0000' + fadeOutColour.substring(3,5)
% j8 a5 |8 z3 g5 O- h        bgB = '0000' + fadeOutColour.substring(5,7)
% ?/ K* W) _: U3 E        currR = new Array(numLinks);: |' \  Z' g8 x' e! Y
        currG = new Array(numLinks);
1 j* G, U2 @5 c  ]7 q7 c        currB = new Array(numLinks);
7 V3 B9 _7 T, r: V2 Y" p4 F        count = new Array(numLinks);2 p0 P: b3 u/ y5 ?5 Z
        fadeOut = new Array(numLinks);7 Z9 }5 U& g. @  n
        continuous = new Array(numLinks);
' [1 T# x" q$ ?4 |        newColour = new Array(numLinks);) v9 _5 `$ a6 Z5 O. o) b# l
        tID = new Array(numLinks);
* B- R2 \- f  N& l/ @        redInterval = toDecimal(bgR) / numFadeLevels;
& z+ D) e( {! a: o  w& `        greenInterval = toDecimal(bgG) / numFadeLevels;( I: q) N2 k& F
        blueInterval = toDecimal(bgB) / numFadeLevels;
7 x& p5 R- N# w; `        initArray(currR,numLinks,0);; C, m8 c: p3 g+ J$ m
        initArray(currG,numLinks,0);
/ ]& v" P% o& Q" ^0 X: F: q- Q1 [        initArray(currB,numLinks,0);- [6 Y# R2 m' L+ l$ h5 J" Q
        initArray(count,numLinks,0);- G3 H+ S4 H9 M3 i, F
        initArray(fadeOut,numLinks,true);4 J; Z) g" |  C% N4 Z: ]5 l' R9 b
        initArray(continuous,numLinks,true);/ i: S+ `: d2 I6 f, `/ E! |& M
}        - \# I2 j; i4 V0 w5 f% L- t6 i# x7 n
function startFade(id)! h! l' L- X) Y. E) s9 y
{
$ S! N- I3 c3 L3 ]4 Y        if(fadeOut[id] == true)
# t4 O8 w; k( Z0 x# A: \        { /*move colour towards background colour (increment)*/; p) l4 a+ w) l# v+ S
                currR[id] += redInterval;
4 `- `+ `, M9 Q: w9 T% O- N( K5 d                currG[id] += greenInterval;( k. c0 q3 x  R
                currB[id] += blueInterval;
5 b3 W0 w' T0 r                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);; w6 j1 m- z/ H6 O6 x- C; P
                if(++count[id] == numFadeLevels)+ g9 A8 L9 t9 `* v2 o0 H$ B# O
                {
" R3 l' H! |& `- ]                        fadeOut[id] = false;
8 v+ ^8 M, e! N% A                }+ S6 R' h- ]! k( D  \8 A4 P' s. D3 R
        }0 n# V+ b& A# J5 b% z; S
        else
1 z6 x& U$ L0 C- c5 P        {
1 d+ X$ }7 U4 K/ r5 T                currR[id] -= redInterval;$ K, I7 u: X2 i, E' n
& g4 {7 O+ w) i- |) z0 {
                currG[id] -= greenInterval;, J1 N# N8 c$ q, a+ c8 p, z7 x

8 ^0 [7 Z: Y' ^* M                currB[id] -= blueInterval;
2 d$ ^: ~8 f2 \) o# x5 E; ~* z$ t7 B" }2 _
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
3 O- A0 s2 [! J
3 D+ N* C0 f2 O- v! N/ r                if(--count[id] == 0)" d6 h: L- U4 u* B
1 H, x5 A& D/ y9 q: H' b
                {
. R- `* a( r' S: l* B0 V9 i3 ]+ |, h! W1 M
                        fadeOut[id] = true;
7 ^$ n  ]6 u  y2 Y
; p1 z) c0 Z/ a                }
7 s( G$ K+ ^4 I* R8 m, p6 I! N/ i
        }# g, i$ ]  R, m) i" w1 t5 w+ Z
5 N5 l& w) a- C$ t
        if(continuous[id] == true). P# J. B8 ]) @

/ l/ [& X+ }, O( @        {
# O$ f  W3 k( S5 q9 z6 n3 \
, R/ P' T3 J: `( m5 u5 j                document.getElementById(id).style.color = newColour[id];               
) h# e/ h' l! `5 a4 ~. p" u+ M0 E% |  L3 T
        }, X# P  a: x6 q# y& G
# |' e* ?& n! X, w1 }3 L' [) X
        else' A+ V  d: C3 o. U- _( m
5 R7 o. j* h( i4 E! p! p
        {
: ?. a! {# A/ B% s, `& W! [1 O. }- ]$ B! u9 _8 y3 r/ `# R" X
                document.getElementById(id).style.color = hoverColour;; \. \" k( J9 o' g& b
2 }* q+ L" b" W
        }
; I6 n8 w: C1 O  r% I: [2 R+ }) J2 A/ j& p
        clearTimeout(tID[id]);) {& t* u7 k- S% z3 ^  u, a; c2 P

/ J+ X: c: C+ h        tID[id]=setTimeout('startFade(' + id + ')', rate);) @7 H; n7 X9 K6 `5 e

* k. g* A/ u  d6 u}
% G" n( t6 ]# d$ n5 S  ?! V
" V3 W- o- [' @7 T) u" ~( {function continueFade(id): k9 S: v. q2 B5 ?: p

, L& l5 w2 X8 @. M{/ J6 S1 B" c6 c% C

; x& d6 T! {% H" f0 ]        continuous[id] = true;
  r3 @6 ]8 \6 z2 e; }  j1 b4 O; c0 {3 v# `! B$ V
}* A# p$ X0 V0 w4 H3 Q  ~; r9 ?
: V2 `0 Q( q; [  V
function stopFade(id): ^# v- ]9 h! l% [1 w( s) R4 \

* N: W1 X! c8 y& w  r5 x{) N1 w$ t! D/ u( n+ {
/ j7 [3 e5 t: C' T$ i8 j6 o& V
        continuous[id] = false;
5 f  v% E; B. r" P% Q: w& M5 W+ I# A' {0 ^- J6 i3 P* y& ~& Q0 T
}7 A$ e7 q: C; D# V9 E

* P" }$ s- S4 jfunction StartTimers()
# W" S  c7 v9 z: c  I2 G9 C" ~/ V8 t. ~; P
{        //set up an initial set of timers to start the shimmering effect
* O/ j- K' Y" u2 u! c, E* P! [+ |$ J/ H# g  i: J1 G$ a
        for(id=0; id<numLinks; id++)
& R% G5 o5 c" x4 ^- ^  w$ i
* U0 W+ o2 i( o% M) Z        {
( t" g9 Z/ r0 }# W( _( ?9 z& f" R1 w& i/ J5 {' \' _5 x0 [" S0 @# ~7 Z
                t=setTimeout('startFade(' + id + ')', id*100);3 }$ V( ]" y' E' g7 g0 J& \+ t

7 O8 y  l6 V2 Q* l        }' c+ ~6 r) W& Q  P, S7 @/ V
5 ~3 `. X6 [- ]; s) ~
}! T9 w6 p5 q9 W1 k8 g# }; Y7 O
8 m/ R) |6 M7 r7 }% [& z+ X
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
1 K3 i! q  U* x
2 b/ i, }; g( g5 V. B" X- `$ n/ {initLinks('#FF0000', 6, '#FFCC77');8 P) h3 z! T, W+ m  N. t2 v, V1 U5 G% z

, |  t9 s9 M* \% D0 l//-->
; V5 g$ Q6 l8 }/ ]% u; D6 K5 `- f; ^( P/ t
</script>
1 ^+ Y1 O# s3 @7 L6 Q7 Q<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元
4 \4 k$ o+ }; c& l$ a- m1 T' }</a>
- z( v: N8 ]+ N" f5 B) q' q<br>6 N8 Q: R  g$ O+ r7 U' L& O
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>6 t7 J: m/ \; x3 R
<br>8 r6 T9 b) |! L. x/ N6 T4 m
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>% C. k: n+ T3 t
<br>        - a: L0 d2 e1 c3 M6 X% k% i; m
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>) g6 |) q3 I, @6 z, x
<br>
! a$ a& j0 z  s$ [+ K) }<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
6 Q# X, N' F7 L4 b* i" H% q! F$ Z<br>  |' N* J7 B  m7 T; r- G1 d5 w
<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>. l% V6 _8 X4 ?. F" x
<script language="javascript" type="text/javascript">  ~) {/ h- G. q0 a. J, {( q5 m
<!--
7 |1 x4 @3 r6 c& X8 G4 v. H$ XsetTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering0 C1 E3 X# b; M2 o/ h" V0 @
//-->3 [7 ^$ W2 E' @  B
</script>