返回列表 发帖

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

<script language="javascript" type="text/javascript">: ^1 m' ~; h  E" T) m3 x) d0 h3 T
<!--
/ A( n- Q+ b' E8 R- w: F1 M// convert a single digit (0 - 16) into hex& _4 z0 C7 J! R, e# u2 |
function enHex(aDigit)
" ^( t4 q0 [0 }# j1 t{
4 A% B4 ]" [- L9 i    return("0123456789ABCDEF".substring(aDigit, aDigit+1))7 e" R5 x0 q! Z' A7 G6 x0 o
}
& \6 B! w7 U5 i* n/ @// convert a hex digit into decimal
' o+ m6 m, n3 e5 afunction deHex(aDigit)
! Q% e$ b( v' z0 D3 Y  N{
) e9 G, z8 s0 I+ Z& E    return("0123456789ABCDEF".indexOf(aDigit))
) m5 u2 i6 y# ]}7 B& w' p6 [, n, y6 z# x

& f) R( I- o+ o. f// Convert a 24bit number to hex
3 g* d0 [2 x) w+ ffunction toHex(n)2 b9 B0 z4 K: @- ?" K! p
{% _% F: G' I/ }0 h
    return (enHex((0xf00000 & n) >> 20) +
  c  w! b4 m# B            enHex((0x0f0000 & n) >> 16) +$ t0 X6 X: K& n
            enHex((0x00f000 & n) >> 12) +4 X6 H- `: Q4 E" e4 `. C
            enHex((0x000f00 & n) >>  8) ++ `9 y; S9 {: Q1 Y3 b
            enHex((0x0000f0 & n) >>  4) +
& j; Q" N. u0 y. m            enHex((0x00000f & n) >>  0))2 Z! I0 T$ u4 K; c" i+ j- a8 w
}9 ~% J$ u) @+ T0 `
// Convert a six character hex to decimal
$ r9 c; C. n4 y: ufunction toDecimal(hexNum)3 [6 t# M) s4 L1 K) h; M) @
{  O1 E" H) P; h' `/ Q; |
           var tmp = ""+hexNum.toUpperCase(), E; ^  Q1 d/ N( c- y3 ?. `
    while (tmp.length < 6) tmp = "0"+tmp
1 q" g( v* H4 E& H' m           return ((deHex(tmp.substring(0,1)) << 20) +
" U; R, a# ?! s                   (deHex(tmp.substring(1,2)) << 16) +
: E& V9 g% `$ ]; l* T3 R  c- D$ L- F            (deHex(tmp.substring(2,3)) << 12) +1 G/ y  G  }: d% T
            (deHex(tmp.substring(3,4)) << 8) +
1 V9 i6 X! F4 p! u# U            (deHex(tmp.substring(4,5)) << 4) +
8 k: D3 K# C  t                   (deHex(tmp.substring(5,6))))
% ]/ h6 \. z4 s+ L. K9 x}
% S0 N- S" e7 j" v# _///////////////////Shimmering Links/////////////////////
) _) v! l/ I" m+ u) ]% j3 ~9 M( z0 |//global variables, Y  g+ r9 x; s3 f. h
var hoverColour3 T. p; J" w& x; B+ f- `
var numLinks;) J. f9 ^& K: y3 \4 m1 O: u8 t4 ~9 t: r% {
var rate;/ z- r$ Z$ b  g4 o& L: R5 y
var numFadeLevels;
7 w! d7 p$ R7 ]" u5 q+ `; U, h. f: cvar bgR;  n4 Y4 h. u$ f- s; O
var bgG;7 t5 @6 i" D5 Y& I3 L6 ^$ W  [
var bgB;
* i5 d0 q3 z! hvar currR;
) K' v$ u6 O. wvar currG;: L& @0 f6 J& x# J# K, a1 v
var currB;( d# j# Y% Q8 W$ h* h# P
var count;2 I0 d9 w3 L' U0 [, ^
var fadeOut;
8 X2 z- z# @' N. n' k" qvar continuous;# c5 _- g/ w. i: f$ H
var newColour;
8 v! l9 [: m; o* W. Yvar tID;" g0 g9 U! U- R& z9 B8 x% a
var redInterval;  ~0 p2 B4 n# S! x
var greenInterval;# x2 F' e6 q: y+ X
var blueInterval;
' X$ V2 C7 ^, c% Ufunction initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
& o& h3 ]' w# L4 P, _0 j) ]{
) `- H1 D1 e: t) c# I! g9 D2 @! |        hoverColour = mouseOverColour;
- S1 L* D: W0 g        numLinks = numberOfLinks;
& @; t) w* k- w# v7 k, H# F/ l        rate = 1;* r5 R, q+ u# g- v1 ~
        numFadeLevels = 30;3 C. Z5 J7 B5 X6 Z
        function initArray(theArray, length, val)$ \6 {0 a( e" n$ U
        {
2 j! F0 z9 l) q8 j, P( Z                for(i=0;i<length;i++)
) h) i' j4 c. y/ E* N0 K; t                {" X) P/ d; J" R- W, Q
                        theArray = val;) q' S7 p& q8 L3 q; w
                }2 H5 L2 m% K+ r9 Y* ?9 k4 }- n
        }
3 }( z6 r- U: z        bgR = '0000' + fadeOutColour.substring(1,3)
7 Y8 [( e" u: u. Q& X) j" o        bgG = '0000' + fadeOutColour.substring(3,5)& }" Z& t! ^8 a3 o
        bgB = '0000' + fadeOutColour.substring(5,7)' A) t( M+ l) y/ X' R
        currR = new Array(numLinks);
1 Y) R4 S8 F+ Z  p( k1 }' z        currG = new Array(numLinks);) D8 r; O2 v3 }# K3 \
        currB = new Array(numLinks);
( ?. V. w" _& N; a9 `" }. M        count = new Array(numLinks);
: r: l' h1 j& v6 z9 G2 l1 H2 y        fadeOut = new Array(numLinks);
# {7 _; y; G/ v+ D        continuous = new Array(numLinks);# Q$ u! P! h9 T
        newColour = new Array(numLinks);7 k- o0 d% M: H1 G* s7 s
        tID = new Array(numLinks);6 }9 B6 H3 v& ^; W3 T7 D, K# `
        redInterval = toDecimal(bgR) / numFadeLevels;/ h: Q. q. N' c; k, U7 d
        greenInterval = toDecimal(bgG) / numFadeLevels;# Y) W  U5 s* Z( a% [$ O5 Y$ A
        blueInterval = toDecimal(bgB) / numFadeLevels;
  Y3 F" H1 p' w; j        initArray(currR,numLinks,0);
" i2 U  S( d7 [' ]5 \% _0 B+ ?        initArray(currG,numLinks,0);
' W1 [% ~# I: g4 ~8 U        initArray(currB,numLinks,0);
9 P" X$ a& {# D' R* q' j        initArray(count,numLinks,0);5 u5 H6 b9 z0 H/ F& B
        initArray(fadeOut,numLinks,true);
: M4 h0 }& ^$ f  I        initArray(continuous,numLinks,true);
$ _6 \2 q- {/ t}        + ~% w2 a: K0 a+ i
function startFade(id)! @+ U9 T: M9 w7 E( f1 W  q( I
{( I1 w) G! n- ~0 v. @
        if(fadeOut[id] == true)$ u3 W: p2 ^0 W" a) I6 Z
        { /*move colour towards background colour (increment)*/
1 ?/ t4 ]6 a. J* ]$ D+ B                currR[id] += redInterval;+ E) Z$ J  |5 ?* R
                currG[id] += greenInterval;6 i5 \$ P6 W1 L- t9 `
                currB[id] += blueInterval;  A  V  n- w' a  P# F- f5 M$ I
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
; d8 ]# q8 H0 J4 w                if(++count[id] == numFadeLevels)
( m5 r. i! ~1 e$ v                {' f5 j. z5 E! i
                        fadeOut[id] = false;( U9 h" r' s$ N$ |* j/ r
                }
# ~& a+ s0 Y1 Y: W3 `+ e        }* ~2 i+ W! |. E: ~+ T
        else
* D/ h* o- h6 a/ }) p5 p        {1 u  M$ @& |# r( \. n7 V
                currR[id] -= redInterval;3 D  M1 F- {5 C$ f- T4 U/ f

4 U7 V  I. f! }. c" X: P+ l                currG[id] -= greenInterval;4 ]6 Y; ?) B$ W- N' w, `8 I
3 D! h8 i/ `( b1 @% I1 k3 Y$ E4 J
                currB[id] -= blueInterval;
" b) \$ F1 Y  Q+ M  h  ^# b. t
, }! ^; |6 Y/ ]$ b! r: [' [5 ?+ b$ {                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);; X0 N7 A+ W; k
# m* ^% N4 q- Z7 r/ n
                if(--count[id] == 0)
0 E* J  z  V! X* z* G* {6 j9 |$ y; S4 X0 i
                {0 i* d( n; N7 P" i) A
  s. d2 h/ z3 ^3 S8 |  P8 E
                        fadeOut[id] = true;) ^2 q' ~2 L8 g3 ~; ^

5 \" c0 A1 X  J& v                }5 G; r: H# X- A: Q, v5 A- ?# t

: K2 t2 t  h8 K. A, I$ w        }# ~6 e% ~: g9 i
5 p  W+ m, ^; {& A  B- h( b
        if(continuous[id] == true)
8 t# t7 Q6 H5 |8 A. _+ P" g( @% B/ a3 c
        {
5 n! r5 D9 ]) P9 O* j
9 `0 e1 o1 c! ~7 U                document.getElementById(id).style.color = newColour[id];               
7 s+ l) X1 V2 h: J; p# e, ]/ N% r8 x2 a# x) r$ ?7 {$ G
        }
* |0 z! e2 a  Q0 ^. K
* M1 H3 N/ _. R7 D/ z2 q0 q  p. [        else: j1 i% ^3 |/ Q- z4 \

  {9 k+ L# ?! @, s        {
: U9 X0 p7 J. D, s% C; ^$ }5 g! ], z
                document.getElementById(id).style.color = hoverColour;
6 L1 \1 ~% c  o' ?7 @4 j' [3 m9 h- r, x/ U+ N8 I
        }& O# y: u: z' }: ]( C

1 ~7 h& B5 B; H6 \2 ^9 L; M/ L% a        clearTimeout(tID[id]);  g' m2 M- g' @" y* K. N

; Q  K. R# H3 R7 H2 o$ d' @        tID[id]=setTimeout('startFade(' + id + ')', rate);
" J" j+ `7 N1 }/ T' ^$ D( B# G; |; |$ ]% g( J0 m1 D6 F
}
5 h" \# e3 R& P9 e  o1 }) y! F" u: ]. @
function continueFade(id)' x8 R/ ]9 x; M% `5 Y0 }5 l% R

5 ^2 G; i' G7 @{
! j/ _+ V0 X/ F; H2 ?: G
  ?4 h' V) ?9 Q+ X( {        continuous[id] = true;
' `# \+ q4 @+ H# Z
4 P6 G+ X- C5 d% }9 \- C4 _}& z) p- O; g+ H: k

3 Y# Y- ~) z( {: N( E" p7 [3 X/ dfunction stopFade(id)
, V/ P/ r! h3 y$ l4 U) _7 O: Z% P2 h: |# T& @: G
{
' O! R) Y- g% Z. g* V+ A* a* m; _2 y! V! c0 `/ \4 A
        continuous[id] = false;: K: H7 m7 V$ R- e! M4 D( Q6 a

+ d* g7 E/ W; T, ^}
! h4 \2 Z) M7 s. @
& u/ P+ p# t  G% k# K8 ifunction StartTimers(). D4 B  C& b; \2 N

1 H$ X' e7 x3 z3 D# w/ m# f- C{        //set up an initial set of timers to start the shimmering effect/ i5 t( n% }. o; j6 U( H4 c
3 g0 E2 ]. \9 @1 C' X" o; z; v
        for(id=0; id<numLinks; id++)
( f9 I2 R1 x! B$ x% S0 K
8 j# T# _2 F2 U5 O; ]" U' x0 Z7 w        {
. x, o: d1 U( k  s7 @3 q# v
4 F' P' U! A, T  h5 X# J                t=setTimeout('startFade(' + id + ')', id*100);
1 O: n" K3 i) c9 a% j: p* d) A
" d! N+ |. ~  y) y4 j8 y( B        }# f6 G, f" \. i. o1 ?! s
6 K) O# V! @( N1 i: P
}
9 _' _# C' y/ \; n! B. w% j9 `3 d. t" e* f8 x! Y! w7 D
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
0 x0 U* X  w; m
# Z6 I: ^. i# n7 tinitLinks('#FF0000', 6, '#FFCC77');
. c2 w, f1 F5 m* v# W4 [
5 }& A0 A3 ^1 ^- o//-->
$ J$ O% d0 o) N1 q: i, g# e0 A9 w+ N  C4 {
</script>% C0 o- n# ]7 V& f+ u6 P
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名:58元# b+ y. B7 A7 G6 a- B9 g
</a>
  r% W! j9 L' _0 _<br>
8 ?0 W* \, v. u& L- i. c7 S# C<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名:110元</a>" i  ?% ]& V. m5 w' q; R- Z
<br>+ X. ~0 ~1 J, ?# A6 a
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
7 W, h0 @( U' X+ y<br>        & s+ I; y$ s- G* p) D. B# P
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
. V& h$ W. h4 c; I<br>' I+ E9 ^) A4 O4 }6 W5 g$ N+ U
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>2 @, |' N' ^9 `- ]# d0 t% [2 m; d
<br>
) G" ?! M. R0 I1 B; k<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>
1 D8 }9 i/ l. S; J1 E3 Z<script language="javascript" type="text/javascript">
4 @& |5 w7 }% @$ C- h( c, H; \' ~<!--# c$ o( f+ q# c5 D' o+ b/ `
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering4 R; J# ]1 Z+ n- v7 H( C8 z
//-->" {) a" P6 b, y5 Y1 v
</script>

返回列表
【捌玖网络】已经运行: