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

zw2004

<script language="javascript" type="text/javascript">
6 [  V+ t! ~& `0 \4 s0 P8 H<!--
3 N6 e$ B4 t' Q' v* @3 x// convert a single digit (0 - 16) into hex
# X. p- y1 m6 H4 p: {function enHex(aDigit)
" E; o0 y! u8 j1 A4 N{
% N' V- a  d) y) X. g: F0 B    return("0123456789ABCDEF".substring(aDigit, aDigit+1))
+ W3 l: r- Z$ m0 Z" c% k0 D: e! d}; J" e, y! U6 v* g+ H; u( E
// convert a hex digit into decimal8 H( T) B& U! h/ c3 F* ?
function deHex(aDigit)
! r" {2 j/ j6 @& @3 s# a$ |% _{
+ E: p% e3 M* K    return("0123456789ABCDEF".indexOf(aDigit))! A+ B2 L6 [! d; `8 R2 [
}
7 B3 g% L) p: R! t0 }# v' `* h0 o
// Convert a 24bit number to hex0 F4 m9 `0 R2 F' k
function toHex(n)
/ _8 t. X' k: H% P, j& s{
1 X" b/ _& a3 Q+ O$ O# L    return (enHex((0xf00000 & n) >> 20) +
0 b( U2 p! n0 d3 i6 f            enHex((0x0f0000 & n) >> 16) +
; x6 Y, v1 J+ \6 x! Y! @) g            enHex((0x00f000 & n) >> 12) +
. Q; D3 w- `5 @3 S% a, H            enHex((0x000f00 & n) >>  8) +2 q" O' g& {4 D1 ]3 S
            enHex((0x0000f0 & n) >>  4) +
# u& c( A: a$ ]& z5 V% z            enHex((0x00000f & n) >>  0))( n) u7 s+ j( O; n/ @# \5 O5 r
}$ ^* k& s' X' l& Q' u4 e  r
// Convert a six character hex to decimal
+ z, J0 V, K. B8 \1 Pfunction toDecimal(hexNum)
! Q, d& A; g) g3 y4 ^5 m. D4 i{, Q. M! ?' r+ t- O: d% |3 I+ j
           var tmp = ""+hexNum.toUpperCase()" ~3 G) J; u* Q9 h# A) o0 G; f
    while (tmp.length < 6) tmp = "0"+tmp
9 V% O, ?1 S9 q8 `/ a           return ((deHex(tmp.substring(0,1)) << 20) +
. K2 d& Y. T6 d6 R5 u% C                   (deHex(tmp.substring(1,2)) << 16) + / y* N6 F$ o4 u2 y- n* F; f
            (deHex(tmp.substring(2,3)) << 12) +
( T; ~  U( G$ a; _# A+ H5 _            (deHex(tmp.substring(3,4)) << 8) +
' `; \$ ^* |% h/ D7 F            (deHex(tmp.substring(4,5)) << 4) +! b6 b3 _) H: [6 t
                   (deHex(tmp.substring(5,6))))& v6 g: o! I6 F
}
2 F  J9 `& f; @1 O7 [3 `///////////////////Shimmering Links/////////////////////, s& F4 g3 \2 P9 [
//global variables
5 ]5 W3 d! U7 x4 f3 u4 Gvar hoverColour5 c5 \9 K1 u0 S3 z- U
var numLinks;
7 Q, J, Y2 D" c  e7 t7 R1 C! vvar rate;; v$ Q1 W5 `6 Z( S
var numFadeLevels;
3 m9 L& B  s5 G5 Rvar bgR;, y% W/ y, @1 }6 L% }* k; j
var bgG;8 Q8 v! k9 H& _) |
var bgB;
7 _& n5 l/ T$ J; Z1 k# [var currR;+ r& p- f. w; c! ~) \
var currG;, |5 H3 Q& f' z/ q6 b
var currB;' [' c) Z4 _% g- K4 p( M
var count;* _: D, {9 t, b) m
var fadeOut;
8 ?5 n( R5 C3 X6 x6 n( L5 D" c; Pvar continuous;" j. [  d8 w6 J6 U9 A2 `  H. n! n
var newColour;
6 ?+ V" }* D: @1 V4 d6 s0 Dvar tID;
+ h) h. E7 }1 q3 lvar redInterval;
4 c% R9 Q% D7 x7 P7 e9 J* qvar greenInterval;- @4 r; ?- t6 T/ a
var blueInterval;3 ]+ j/ c* B3 |5 P; x5 }
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour), W* J9 s& q" s8 P
{
4 X- g# d& A; A3 k! L6 `9 V# k4 f        hoverColour = mouseOverColour;
: @- X* K) |0 T: a& d' K        numLinks = numberOfLinks;
* ~* u; Z" K  Y9 W! }5 _/ e        rate = 1;
- h" v/ ?, G. F1 [2 ]        numFadeLevels = 30;
- q1 E; o6 s8 [9 E- r, R        function initArray(theArray, length, val)$ X6 g, [# @) j! ~. A# G/ x
        {
0 G- `# N$ b9 y6 \                for(i=0;i<length;i++)
1 E, P* d+ _& D* I& F                {" {" s+ [# y# o( K7 h" Z  O5 Y
                        theArray = val;
! N- }* |4 Y/ o, I1 ?                }2 H0 H6 g$ _) P. r8 s
        }; d7 L" p5 B% ]! L: B
        bgR = '0000' + fadeOutColour.substring(1,3)+ D% W& M6 G4 k6 D# p: C2 v6 F' j
        bgG = '0000' + fadeOutColour.substring(3,5)
$ S8 ]1 [* [' j* w5 G1 E        bgB = '0000' + fadeOutColour.substring(5,7)7 f0 q$ j: n8 G2 A
        currR = new Array(numLinks);
/ u' ^' ]' R/ e- k        currG = new Array(numLinks);7 n; j6 Q, O! g& o  K: Y
        currB = new Array(numLinks);
8 @0 i0 R6 y! u$ Y. b. N1 r6 k: i& N6 x        count = new Array(numLinks);
* C* i. J& S* ^' ~5 E        fadeOut = new Array(numLinks);1 v6 N" v) Y& x% {4 c0 U
        continuous = new Array(numLinks);, k0 k) {/ N' [8 F
        newColour = new Array(numLinks);$ d$ E' q+ H9 b2 W7 o
        tID = new Array(numLinks);4 ?. ]7 o! V: N) @( |
        redInterval = toDecimal(bgR) / numFadeLevels;
/ K3 x' \: F, `2 q3 s8 k4 ?5 z# g$ M* \        greenInterval = toDecimal(bgG) / numFadeLevels;
4 u9 S) f7 i1 d5 q        blueInterval = toDecimal(bgB) / numFadeLevels;3 q( q* d3 ]' c5 b; `6 r0 T
        initArray(currR,numLinks,0);) B. g1 K7 j) P7 ?; r
        initArray(currG,numLinks,0);5 |# l2 r& ^) G1 L
        initArray(currB,numLinks,0);
1 ^- j9 C6 G) _        initArray(count,numLinks,0);- D* F# Z9 x+ ~
        initArray(fadeOut,numLinks,true);- R$ m% m  V1 e7 {& w: w
        initArray(continuous,numLinks,true);
3 e) Q5 l0 S4 \: p0 ~6 E}       
: U0 }# k5 {5 B6 o1 t1 Cfunction startFade(id): ?' z1 }* J9 g% F" P; S
{
' d+ @' W$ ?, l        if(fadeOut[id] == true)
, o& f. V9 \" J, t8 m. Q        { /*move colour towards background colour (increment)*/" G0 f8 F4 F3 q9 J
                currR[id] += redInterval;6 [- X+ T2 l# X7 ~0 r2 n
                currG[id] += greenInterval;" e  Z; L1 w1 y: @/ ?( U, Q
                currB[id] += blueInterval;
3 C& S, h+ o( Q( o3 {: F                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
/ Z7 X! s4 E0 z& }                if(++count[id] == numFadeLevels)
* |  `  ?$ \! d" y' c                {
+ G$ y  q$ I( ^9 r+ f1 {. `! a                        fadeOut[id] = false;5 J) s0 B2 a1 P% _+ c9 f3 `. x& v
                }
6 R+ I- ~5 O/ _' g4 J0 @# L        }5 A; q% k8 M  \" Z# \+ [1 y% m2 X
        else2 B5 v7 G: e) L) a" s
        {
: Y$ q3 q! v5 K* I( r  D                currR[id] -= redInterval;
1 Y% h* a# b$ V! U) i( b
5 w# N( b# q; y% t* l                currG[id] -= greenInterval;
- {) ~) o6 ~6 Y) I% r0 H# W8 |( y: l" v: Y+ o
                currB[id] -= blueInterval;
: `* f& E- W9 _! W$ W" {
- x  ]8 N: t+ H/ u9 J4 C# P7 |+ W                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
& c/ ~/ y5 ]- `! ]$ t. K: ^
8 ]% }9 p$ V( t/ }5 j8 d3 g! t                if(--count[id] == 0)3 @0 c* @, ?+ E/ n
# @) p, J0 h' k) C! C& X) l
                {- b0 W6 {! I! U
' m: d8 a1 R# u% K9 p
                        fadeOut[id] = true;
3 _, j# L& |, Y8 \" P  o& g3 R; w5 ~( V1 w* i5 o
                }
8 J% l  _0 q* S/ Q4 b: p7 `
6 w& U0 j1 @( n7 f% u        }$ g& s; h" G1 @) L1 M* t

2 U4 _5 ~  z0 |! P# P        if(continuous[id] == true): R0 Z0 n3 k5 z1 M% a8 o) N( T
; n" f8 b1 F6 B2 \$ M& t
        {+ t+ A6 f+ d5 _2 Y  Q  T

( x5 ]& H8 P: w7 v$ }# z: N- }                document.getElementById(id).style.color = newColour[id];                , y- H  F0 u( H  X8 i% r

0 @- ^  w, p2 |        }
9 L, ~* L9 Z$ r  o8 F+ P' [
( Q9 \- Q8 b1 M8 l' T- ?2 o/ c( ~5 S        else
  j' K  M& a5 s1 h2 ]* U+ H; d1 \' g( w1 ^. U( z
        {
5 w- ^- y# S2 U1 k4 ?4 r5 V/ t+ f  X" |4 r- p
                document.getElementById(id).style.color = hoverColour;
$ n; c& \  k, s  |
- T- w8 @) J) P% {8 d9 L2 U& F" b        }& ?6 m7 X0 b2 d/ W
) W! b7 R: v1 Z; j
        clearTimeout(tID[id]);; `2 @* v1 X; @: y+ W9 K( Q7 O: U

* p- Q; X1 d5 L! m& P. D        tID[id]=setTimeout('startFade(' + id + ')', rate);1 s( n$ n8 Y: W+ ~3 ~

6 L7 W7 @* ~  h+ f6 x* k% L! ~; T}
, X+ a! U# R- _0 V0 p; q
, u- J3 m9 L4 x0 s# w( yfunction continueFade(id)
- U' \2 ^8 e' H' t1 _+ Y/ D  Z0 J: d" S- Z5 c( P4 e
{7 n9 t1 W9 l* ~( r0 z
( x- S9 S! P# B
        continuous[id] = true;
+ N4 P9 J; g( w: |, T
8 W+ a9 \9 T- f9 A% v  O}
) r8 z" A0 u( l1 S6 u9 E
2 O# A5 A$ d7 e3 H4 Tfunction stopFade(id)% f! k! S) m# d' M# B
4 [& w' U+ w( d* r; n
{8 M" X( W" T5 l4 o2 m7 `( x. S
, w- r& Z7 S5 C1 s, N/ ^4 J
        continuous[id] = false;! G: g: Z4 b; T# r: v
) j3 T# }1 S' r4 r* m3 v
}
! f! `+ n0 q0 p9 j1 x. b, [) ^9 a* R" w, ^1 f
function StartTimers()0 x: E0 d+ M  O* S
# m: z% r- z$ l
{        //set up an initial set of timers to start the shimmering effect
, [% r2 K  d1 G: g+ ^0 f8 f/ r+ X6 j/ W& E
        for(id=0; id<numLinks; id++)
5 U- N9 j3 N; N9 Z) O) ?( z- K* o) ]4 A1 b7 t. V  C8 L" H: r
        {
, Z- }6 T3 c* o" J) {0 m0 @
9 @4 `% J' c8 I4 K' J/ d9 W                t=setTimeout('startFade(' + id + ')', id*100);% a7 J/ L, E1 k2 a
1 n% ^) q+ p# l! _% |
        }
( _! z* q3 O( B" n) {" Z' W9 E1 [' S) _* U( ^# d
}
4 M" ]/ d2 _% ^6 S
# |- R' v9 A1 Z8 ?( \! U//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
$ V9 h% o& x$ |4 n5 N% H6 `$ V6 w5 b3 L: i( S. g: O! C
initLinks('#FF0000', 6, '#FFCC77');) Y8 D2 j( l- T5 Y5 |
1 g; [1 Y# n1 ~- B5 P% F
//-->. p6 K8 I# n. r6 J# U; F$ B
# G0 D, G9 O: r4 a( T; u! E$ x3 Q
</script>. I$ x! j. c$ D. [0 b
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元: L7 M1 X# \" B! h) ]
</a>
$ O% w+ e' h$ C6 C4 Z<br>9 {7 H$ o+ B4 D0 B" J9 ]/ s' F
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>
; E+ q- n% c' C' s1 r# @<br>
0 G4 U6 Q) D0 K4 G<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
4 W' U% Y0 W) C( s<br>        * \, ~6 h0 P6 ~5 C  Y* S
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
; x6 K9 c* U0 O, ?1 ~! c<br>: d1 y& ^; e( y6 t
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>* F" p. C3 }# [( y7 H
<br>
* H  ?4 E, T) i0 B+ b% }<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>% x  b4 I4 f1 O9 u, ?
<script language="javascript" type="text/javascript">
5 o' g7 ]! }0 w7 q3 h% p0 ]( n8 W<!--0 J" E/ ]0 K5 x5 E1 V; @
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
. G# w* v: u, }//-->, a0 c3 y. K* S
</script>