返回列表 发帖

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

<script language="javascript" type="text/javascript">( ?+ }4 V/ }- z
<!--8 P* ]4 ?5 J, c6 i% p8 h: j
// convert a single digit (0 - 16) into hex
3 |+ `4 s8 n' U+ P+ q' }function enHex(aDigit)
/ {5 O" @" O7 X; u4 I( G0 @9 t{- ~( P  R; y# h5 j3 y- E
    return("0123456789ABCDEF".substring(aDigit, aDigit+1))
1 T4 Y  n- `8 A) W9 y6 Z- r}
" t' D6 \& o0 f4 B' h6 P: Q1 c6 s// convert a hex digit into decimal
' Y3 {9 A& Z5 s, mfunction deHex(aDigit)
7 C* F* G+ w; D7 T{5 g7 m+ ?$ T6 l8 N; N
    return("0123456789ABCDEF".indexOf(aDigit))- p; d+ l* Z1 W0 a) G
}
4 w4 O: }# M7 z3 s
' J2 Q9 C" F. P! [3 N% m  s$ i// Convert a 24bit number to hex, |' X2 L% E; \; r, r0 u5 O
function toHex(n)
+ @9 i- V/ J/ E. [$ J$ ^% B7 |$ |* P' \{
9 V" Q% b- O8 y5 D, o    return (enHex((0xf00000 & n) >> 20) +
. v5 V1 C) `# Z' q* G            enHex((0x0f0000 & n) >> 16) +
6 T; X; M2 X* t4 u5 d& r$ p6 m1 T) i1 ?3 u            enHex((0x00f000 & n) >> 12) +
0 d5 H- E  w7 q$ n            enHex((0x000f00 & n) >>  8) +
/ T9 M& G  a. J$ M  w/ h4 X1 Z! B            enHex((0x0000f0 & n) >>  4) +# R8 ^7 h7 H& \' W+ O1 L
            enHex((0x00000f & n) >>  0))
5 _9 s$ p, |- @# V8 ^; C}
$ k+ \2 P0 W  ^4 E1 V, \// Convert a six character hex to decimal
1 x2 U, z4 A+ m+ }  nfunction toDecimal(hexNum)
; {3 G( ?8 p/ H4 G8 c! l{
, o$ \) {& Z7 ~6 A7 k           var tmp = ""+hexNum.toUpperCase()
3 p$ }/ h6 E$ v( b, ?3 e9 y    while (tmp.length < 6) tmp = "0"+tmp
0 |+ H  t0 ?9 b& V           return ((deHex(tmp.substring(0,1)) << 20) +
9 ]  a* E0 e+ Q+ |                   (deHex(tmp.substring(1,2)) << 16) +
) O' G2 e) w7 [7 A            (deHex(tmp.substring(2,3)) << 12) +
$ ^, f( _% }$ t1 @, |            (deHex(tmp.substring(3,4)) << 8) +
  f* Y4 D2 r# C- P  q- ~            (deHex(tmp.substring(4,5)) << 4) +- p$ v% v9 ]6 \' n- p# b& `
                   (deHex(tmp.substring(5,6))))
% C5 p) J6 Y; l, c. g}
  _& b, x! o/ g! j///////////////////Shimmering Links/////////////////////
- n- S) h8 ]; `+ `4 K. G  {. M5 z% y9 a//global variables
) [- \+ e7 r- w1 uvar hoverColour
* |) N: I& t( V2 J6 m) pvar numLinks;
  v, o0 X# }$ U" K! Dvar rate;
: R8 h5 v6 t0 k- \4 f7 [1 B1 @var numFadeLevels;
0 E1 e* R* \! j, J9 B; Qvar bgR;) Y; c; ^: B6 g9 e1 i# R% x
var bgG;
0 ]: s0 e1 Z% h; j$ e2 y6 @" dvar bgB;" A, h, o2 s$ ]  ^9 `/ F. K
var currR;3 ]  t) z5 g" ^: r6 J5 F3 ^
var currG;
$ N; s3 |( x& ^# _0 f, N! bvar currB;" n% }* I+ `. y/ S0 s% H
var count;
8 Q( ^+ I; Z' [' X3 v" F5 Kvar fadeOut;
7 s) l3 }9 r6 d1 f9 ~var continuous;+ I9 q% z2 o# b2 G, k" J. r
var newColour;
$ f1 w! l0 p7 a$ a- ~9 Q' s7 F1 B6 yvar tID;
8 t3 a$ g0 X8 H: K- P1 Tvar redInterval;
& M# r& F5 l( k. v2 s8 a4 ^! B4 ^var greenInterval;
* l: c) s: S2 m% b9 d) V# Bvar blueInterval;
% C- h/ r! i$ p* sfunction initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
; x! s4 W3 v1 s9 X; `7 h  g{- @! q) p) o0 T0 g, z: U& R
        hoverColour = mouseOverColour;1 Q% R) H1 ~+ B! Y% b0 p. Y3 S! U' j
        numLinks = numberOfLinks;: j' N. w6 o8 g9 k; t
        rate = 1;
3 u6 j, G) K& y* ]+ I        numFadeLevels = 30;
8 b% U, U4 M, ]/ M. i" P* R        function initArray(theArray, length, val)' ~2 I; O$ ]4 ?3 {" y$ k9 t
        {. ?4 b8 W1 K( j, \+ z  s
                for(i=0;i<length;i++)6 I; ]; w' A7 R: ]3 G
                {
$ {) \& S% S6 J% d                        theArray = val;. {+ ^6 i: s' @6 W+ j
                }
  U1 }$ O8 y; @$ |. D        }
& ^4 q9 ^, M# J        bgR = '0000' + fadeOutColour.substring(1,3)( \5 r* h% n; X7 y( }& x/ I1 E
        bgG = '0000' + fadeOutColour.substring(3,5): G) h1 I- m! ]( K/ j3 ?
        bgB = '0000' + fadeOutColour.substring(5,7)9 @; _* G1 p) U) \  v( x+ U
        currR = new Array(numLinks);, U. \5 V( t2 Y+ X+ z3 I" V
        currG = new Array(numLinks);
( _, i1 V! H, k' X        currB = new Array(numLinks);0 y) k  i$ P* |1 H5 [3 A; Q# W
        count = new Array(numLinks);
+ U# O5 F$ i, e4 g; q        fadeOut = new Array(numLinks);( x/ U7 f: E* X* n9 v2 l
        continuous = new Array(numLinks);
+ x+ H  O) C$ z- Z        newColour = new Array(numLinks);* R" d5 S8 W% E$ ]
        tID = new Array(numLinks);, M3 t4 D. h) C% d; D. J
        redInterval = toDecimal(bgR) / numFadeLevels;- i( m$ t- m' d9 L+ P, n/ Y
        greenInterval = toDecimal(bgG) / numFadeLevels;7 R/ t8 e/ U6 ]3 ?& i7 l
        blueInterval = toDecimal(bgB) / numFadeLevels;7 c& C2 m) R  n9 F) q6 I0 y
        initArray(currR,numLinks,0);& G1 ?7 X3 l1 I! p* t# l
        initArray(currG,numLinks,0);+ H* X* o' c& b" U2 Y: S- ~
        initArray(currB,numLinks,0);! Q  T' h# D( V1 w- C- _* O$ L
        initArray(count,numLinks,0);0 m: Z0 d" c+ l$ a
        initArray(fadeOut,numLinks,true);4 n/ U- i: y4 J" M8 J1 n9 l  K
        initArray(continuous,numLinks,true);
3 _( \4 S  ^* |$ g4 j/ d9 [}       
# X2 X2 X% M+ Y7 a! p# Z- [function startFade(id)
7 ^# \  u) m7 ^/ _3 `, x{
! A# W+ a1 N9 [" C        if(fadeOut[id] == true)
8 {+ y5 N  H1 z# [3 y. u        { /*move colour towards background colour (increment)*/
: z2 v5 F) W. e% v9 ^' e* s                currR[id] += redInterval;
- L  i5 ?' B; c" O                currG[id] += greenInterval;6 R# F6 \- P3 [  }$ @5 ^
                currB[id] += blueInterval;) ^  q# ^  R* r+ Q/ c
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);! X- g2 M9 p7 Q7 ?! w
                if(++count[id] == numFadeLevels)
& D# j# o! J& ~6 f6 C: W                {3 O9 Q) Z' n& V& ^6 h4 `, `
                        fadeOut[id] = false;+ p' w+ y3 P" `. n" b% N) I5 E
                }
. E1 c4 E8 P# n: E! J        }5 m# p9 m8 o. Q# e) u3 h
        else3 P+ g, ?8 |; x/ L1 r: i
        {" B+ m# o- c$ j6 n# L5 Z' C2 B
                currR[id] -= redInterval;
, W1 j& y3 I3 M" j7 y1 I
' k* p7 N+ G$ h: w! K. a' x                currG[id] -= greenInterval;
, j+ c# h. r9 f; n
$ n' o9 p; X- x% U                currB[id] -= blueInterval;
, q& H5 O" {# I9 U$ q0 H4 A& j6 Z' e: V
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
3 s8 t( W9 |0 M1 M1 }; C0 p8 u5 \+ z: U3 l+ T0 B* l' c4 \
                if(--count[id] == 0)6 E, v* \4 v$ T2 N; k  R

' Q: S  ?4 h0 a, k3 g+ V  l                {
/ A8 @2 j# N$ B5 ^5 C! e5 [1 o6 Z, `5 T! K; [9 p
                        fadeOut[id] = true;
, A+ J6 n- G0 \) \6 c1 P5 K$ n; _
: A7 Q5 |1 j. v4 H9 Y# w                }( n8 S( E2 T1 U8 s# `% x$ D1 v
, Y6 h' k. x3 x2 y% f9 {
        }3 a/ R$ N! Y8 X( x& Y4 G1 i( x* b5 G
4 @# s; i% r7 y7 o& Q( _
        if(continuous[id] == true)
: D4 w. R0 g; T% o( [% D: e6 N) j# I. x4 K) c! `3 T& r/ F; f
        {
. [- ]6 [# A, Q7 P" I5 d
; j  ?  x/ D7 ]                document.getElementById(id).style.color = newColour[id];               
1 |! w. l( J* B5 o5 P4 e$ \& ?- `7 @. @+ @9 ?" r/ r9 I
        }
8 ]& h1 s' d1 Z' x
8 ?7 @5 k# H7 l1 ~; l        else
3 m- L8 h/ S" e
( m( M. p4 b# a2 M5 h        {# B$ ]9 e( e. h+ P" ]) d1 R9 X) U
4 z/ v  H& |: ~# |# f. q
                document.getElementById(id).style.color = hoverColour;/ H+ d+ I9 ?3 N% a. I; q( n$ ]) z' j

) t( n8 `8 [% M: }        }4 u' a0 N" a; c  ?" [  @

* f4 Y3 i6 f, h4 u: t% r; e        clearTimeout(tID[id]);4 ~5 l8 a1 J% h: {+ L
& ~9 d  U1 ~. o6 T* n
        tID[id]=setTimeout('startFade(' + id + ')', rate);! r, l; ^# n9 o

/ Y, k) g- w) f/ m}1 l8 Z) O9 Z+ r/ e
' q: `2 \* M. Z- u" T5 o- Q% |; G% v
function continueFade(id)
) V' _/ U, Q4 D  n8 a' s! q6 r' h$ E" P0 |( {
{. t$ V. o& _# \( u0 j- r
! T7 m1 u( |& i/ G* L
        continuous[id] = true;& ~/ h" e! @5 i5 `) X+ P6 E

8 x/ w, a8 t9 K& J( S' B}4 |! f, y- J: a8 ^% g$ x% O9 p

, v) v6 g9 l* ~0 p, M- B$ G2 W  F) Qfunction stopFade(id). A& ^: H' l. V+ u) k6 \7 f# b0 f

6 Y) T' ~' l3 D6 F. F/ E4 T% O, W{" x- |; J' t' [& s  Q" S
/ w% j/ W* {* q7 w) l( J" s: {
        continuous[id] = false;
* x9 N+ P1 M- C
* K: ^- Q2 `# `' V4 Y}/ V& H$ {3 n, C- Z! n8 |# V$ @: u2 ^
# j( h. t( q; m$ z+ a: i$ ]
function StartTimers()  q8 D0 {& s7 ?. T& o
. O2 _; g. s' v9 {: I& k) a
{        //set up an initial set of timers to start the shimmering effect1 @- e; D: u" y7 v, w
. H9 }6 Z" e" O! U/ {% ~
        for(id=0; id<numLinks; id++)8 A: r( w- g, c% ~

# A# A, y) a/ s- V$ \        {# Q' T8 }# W! s( h/ j# N

3 X9 H  L* Y+ c6 E) @, y  e' f                t=setTimeout('startFade(' + id + ')', id*100);
# f; `+ P, o9 i8 M9 B* [: M# T
0 e3 @1 m( ]9 i# ~, D& s, ]        }. U$ a- p. p- k7 |- z8 L% Q; s- h
2 @! ~& c! r8 L, M
}
" }1 o. J) U$ r0 q0 a
" U$ `9 O2 \/ J$ T//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
5 D; r* p& l; ?2 G1 W3 q' `5 u& r8 R" ^* y
initLinks('#FF0000', 6, '#FFCC77');
- `' Y4 _7 S) j0 q
% n! r6 g; r% f//-->
; Q" O) X' L! @' k+ ]& B; C9 w" B; y8 H1 J  }1 J  v& u% u
</script>2 Y/ }6 C" U2 m5 ^- |
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名:58元% H. g! l- l1 a: ^4 e9 D5 G
</a>! o" |  c3 z8 Y* Z
<br>7 F# C1 C: U" L. g+ ]
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名:110元</a>
& G2 g& ~' M" L8 E3 E5 M<br>3 l6 _7 i2 E& q! }6 H8 t' F" Q
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
5 m8 b: \9 M) K1 v, @0 k<br>       
2 @% }& T2 M1 B# ?5 g9 X0 B<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
& {0 l6 X) Z' x, ~  Q0 Y% j<br>
6 Y+ V  L" l: h. z0 V% s<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>1 g0 p; {6 b% t9 F1 D
<br>0 N( z2 y: M2 k8 I$ N+ M
<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>. J( q% B0 y! ]( z9 w
<script language="javascript" type="text/javascript">
2 v( x4 R/ r2 R2 I* ?<!--
8 L1 S3 \) p- zsetTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering8 M* z* M& N8 f. B6 F0 s) T
//-->! i, E" \  d8 R, d6 D
</script>

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