返回列表 发帖

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

<script language="javascript" type="text/javascript">% H1 {" a- o. S' W5 Y
<!--
  a: `3 y6 \! a7 K2 L+ w// convert a single digit (0 - 16) into hex
  ~( Q9 U2 g4 _$ |; }% R0 Nfunction enHex(aDigit)9 ]1 y" Z8 n9 T4 {0 c, d
{
+ ^% S0 H' C  P3 X    return("0123456789ABCDEF".substring(aDigit, aDigit+1))
' r: U- c$ q, o% _- V}6 x$ b  _' I- t, c0 t
// convert a hex digit into decimal) }5 Q0 x& b8 n; l
function deHex(aDigit)
  k& s- x% t& j5 h! X3 R! j! C% u; [{! j/ P1 m, u0 r% u
    return("0123456789ABCDEF".indexOf(aDigit))
# n* v6 o* K6 n$ \0 h}
, z; g# C; Y$ W' |1 N, j5 h; u- {
, @- S; W! Z5 N, Z// Convert a 24bit number to hex
, i. a% B* R1 x  V3 H: |$ k' o# ufunction toHex(n)
1 K' w' E" n8 w{1 I5 x( m5 `& r& D8 f9 i
    return (enHex((0xf00000 & n) >> 20) +
! M4 O  ?( E2 Z9 u            enHex((0x0f0000 & n) >> 16) +
7 Z( {3 J& @" s/ W2 p: F            enHex((0x00f000 & n) >> 12) +
+ S2 G9 G; ^. Z9 T3 M1 O            enHex((0x000f00 & n) >>  8) +
( a9 n2 G! U2 o0 f            enHex((0x0000f0 & n) >>  4) +
" w; s( C& i' {. V: U- t8 Q3 d            enHex((0x00000f & n) >>  0))
* s* |" k) N3 [- V6 n0 A}
  T- D. u' c9 \7 ]- H// Convert a six character hex to decimal+ B% ^2 j+ P7 m5 `0 `
function toDecimal(hexNum)$ N4 W' x6 ^% R6 t
{
4 {, T: k8 J# B9 |5 M           var tmp = ""+hexNum.toUpperCase(), q& K1 H0 ^  U/ B0 s* Q) h" v2 X
    while (tmp.length < 6) tmp = "0"+tmp
& n$ u1 r$ [. a; B7 S8 h           return ((deHex(tmp.substring(0,1)) << 20) +' s# U7 T* ^5 o  _$ r% L
                   (deHex(tmp.substring(1,2)) << 16) + : p/ @! Z6 o! U7 {# m
            (deHex(tmp.substring(2,3)) << 12) +
3 m; J9 q+ X* m. ^$ U2 K1 o            (deHex(tmp.substring(3,4)) << 8) +# o. s9 i: O/ k& i! |  y' I
            (deHex(tmp.substring(4,5)) << 4) +2 D8 }" m3 r7 y% @! H) A
                   (deHex(tmp.substring(5,6))))$ o9 Q: k+ \- {% S
}
- k% m$ i! X8 e4 K5 ]) V5 |  v8 Q///////////////////Shimmering Links/////////////////////
6 m* Q+ D* r8 U% h) U. j0 m4 u//global variables  v/ D( G9 w6 k+ ^4 _7 a1 g
var hoverColour( b2 e! a+ l$ V8 r* E* k& \6 w
var numLinks;
( p) Q* j* U6 B+ w% [- G! [var rate;
3 f& Y/ T5 c" X7 E; E! x! R" \var numFadeLevels;
9 G- n, B& @( u6 ?4 p3 gvar bgR;
% h* c0 M) _, ?( F6 u0 @var bgG;- Y  e7 G( z. h: j" P
var bgB;
/ [1 I# D0 G2 E' @. j; j: Q" O/ D" Nvar currR;
# n) e; T* W4 `1 ]* ?; e( Jvar currG;5 f* c$ m, M/ f' N  Z
var currB;* e. O# [. o, f+ v; x; k0 v& _' T
var count;2 E  e! Z7 u3 W, R. ?
var fadeOut;
8 @) n, a9 M7 ]- o: p) ?var continuous;- |7 r. N1 n8 ?$ j
var newColour;
7 V1 @" y& Y, \7 C3 m1 z: G0 uvar tID;
# `2 ]% P  W* W! m9 M4 mvar redInterval;
# ?; C- q9 N) o3 ~2 Xvar greenInterval;$ w/ M# S3 z+ d  f% t9 Y' ~/ O$ b2 g
var blueInterval;
& V& X' K* {% M+ [function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)5 I4 i8 C9 b, c0 y
{6 ?: O' z8 s" W1 o/ N
        hoverColour = mouseOverColour;% Y$ ~4 k( K. A/ \$ y% K* n4 j. ]
        numLinks = numberOfLinks;7 ^8 i, b7 P, ]% A6 X
        rate = 1;
2 P1 k# W: [7 D& V3 ~6 W        numFadeLevels = 30;
: k# ?; h! J- G8 k0 t: x        function initArray(theArray, length, val)8 v% g$ L  h. F! ?1 S
        {8 J! w  w- I; w
                for(i=0;i<length;i++)6 y5 m: |# R( W$ q" [+ ?% k* y: T
                {
" k1 w  w. ^' n- T* E3 Y( f- z                        theArray = val;% r- y6 D( R+ S
                }
* z: R# p1 y! z# s        }
1 m% o. J/ F: `1 k" f        bgR = '0000' + fadeOutColour.substring(1,3)
+ U/ ^) w" t* @' N+ M        bgG = '0000' + fadeOutColour.substring(3,5)
0 J% M3 J3 G0 [$ y+ g' v" {        bgB = '0000' + fadeOutColour.substring(5,7)* Y. \7 Y' i4 u+ T
        currR = new Array(numLinks);, N( a6 x% X$ `2 P" W* G+ q
        currG = new Array(numLinks);' j4 d% Z0 {6 \! d5 H9 M% T
        currB = new Array(numLinks);" d. T! a- @4 y* U8 C. V+ t
        count = new Array(numLinks);
& q8 V/ e. w, a7 n0 f3 S# `        fadeOut = new Array(numLinks);
  K" O7 _/ Z$ f" l9 K1 V, N        continuous = new Array(numLinks);: _5 q6 O( D. U. Q- ^' t. B9 Y
        newColour = new Array(numLinks);" X  M8 J( o9 W# J2 c
        tID = new Array(numLinks);
0 i  t- e3 M8 V8 X( u9 n  f        redInterval = toDecimal(bgR) / numFadeLevels;2 s& {+ p4 {& ~/ U, t* l
        greenInterval = toDecimal(bgG) / numFadeLevels;; X1 q& P) B/ f* H& i/ w3 S3 S+ T
        blueInterval = toDecimal(bgB) / numFadeLevels;8 M& X( ~1 {7 F! z+ U! k# }* J
        initArray(currR,numLinks,0);$ w2 |. T  _9 E# |! B
        initArray(currG,numLinks,0);
; e7 [1 W8 t& G7 d1 [        initArray(currB,numLinks,0);
0 o! g! Q# K. A1 w" h2 a        initArray(count,numLinks,0);3 h, G% W! M1 h8 [
        initArray(fadeOut,numLinks,true);: ?# s. p: ?1 G* K
        initArray(continuous,numLinks,true);
- p4 l6 ^; ~/ k; I& |8 q5 {9 l$ |" D: P}       
9 n  q+ e$ ~! k- f' ]) ?6 ffunction startFade(id)
5 @+ Z# p; }  `; U{0 R0 j7 ?: q8 @$ l! Z5 \
        if(fadeOut[id] == true)
- E- j+ r% ?; t: q; ^$ `6 l        { /*move colour towards background colour (increment)*/
3 f' Q# c% K2 C. e9 W  t                currR[id] += redInterval;! p  M" p+ Y' v+ ?+ g
                currG[id] += greenInterval;" i, V6 j3 Q. G3 |% H- o" \
                currB[id] += blueInterval;
; s- y+ W; Y5 H/ a  u                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
5 g9 C+ J% d7 F3 I( K5 K                if(++count[id] == numFadeLevels)5 ^7 k1 L) ~* ?; J( w0 `
                {% c8 q0 ~, Q( B  H; ~
                        fadeOut[id] = false;
5 @" @; U- Z8 k3 p6 o                }
* n% s9 R6 _( l+ |& `        }
, N# d( ]( d8 t# z  c        else
2 N1 ^" T' X6 T        {  @6 `7 I* Z/ K
                currR[id] -= redInterval;& o  N* ]# ?9 C
; z9 |" T4 K: I( J2 V8 \
                currG[id] -= greenInterval;
% w$ X9 @: j' q
1 K$ p: `$ r+ A4 j                currB[id] -= blueInterval;
4 G2 X' ^- Z$ R' a% n' ?
5 g# `3 g- c) F                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);4 C+ g0 I1 X2 c$ Q  I
$ z) r5 G& J) i) J, S
                if(--count[id] == 0)
$ P; J+ z. g- D1 \- J9 j* Q# _
  H; g* v$ V0 i( g0 H# g$ W- C: k                {
# R$ y, _- z! S' s& D4 i5 W4 m
  H, q9 P+ M) V: d& k                        fadeOut[id] = true;7 g* C5 w! Q& u5 [

/ u1 ]$ f8 E/ H; t7 m: s; K6 w                }# Y$ Y; N8 P1 X# G

& o6 k, [, q1 x9 Y( j8 z        }' `. n9 R2 _+ n5 l

* q+ {" g! t* n( H$ u& G        if(continuous[id] == true)
' Y9 Z0 P9 `2 I8 G
' @/ t0 B5 w7 M( j$ P* F  V) `        {6 f1 Z1 _8 N) S% @

) D9 y1 n/ [8 M* A& d9 B; M' y                document.getElementById(id).style.color = newColour[id];                . W  |: N; A* Q: ?  }- J- h0 f
- }9 }, f6 N/ M/ x5 d
        }# O* [+ `. O" n3 l7 o2 y
4 e1 M3 d4 b* s9 A
        else  ]: V0 [4 Q/ j( E& @% C

8 N( _: N% j. Y& T5 |4 n, F5 s+ \        {9 N5 h# a6 p9 U" h/ }  A  H8 w

0 K: r3 x; {" I  b8 A+ h4 W                document.getElementById(id).style.color = hoverColour;
4 H" ]5 Z( Y! G& {+ y
6 e  r) ~* ]; }        }
0 t( R: b* s" b3 g+ F  c% ^# M+ `
4 T8 f& \4 r! f! {1 ^% G        clearTimeout(tID[id]);% }8 q0 {& }+ w) S
3 D" ^  E) c" V" A& T
        tID[id]=setTimeout('startFade(' + id + ')', rate);
6 j) G$ Z5 a! }; w; l1 y& d3 v% V7 S4 z7 j* Q" F) C, ~  J. e( [% X
}$ d8 c/ |* K+ [, A, _6 n: f
* D7 d1 n: v, G" Q4 R1 B3 W
function continueFade(id)
  D! T3 \& z* p9 w1 o, I( z
+ Q6 i+ [; u. a4 H{* i. Y+ B" g4 m' ^/ b7 S

$ P' G+ J1 F7 V: ^' O! @+ V4 ?0 [# V6 d        continuous[id] = true;8 B: V# j9 `. E
+ [8 c; m  ~, G
}3 \& n9 _5 _0 i; x

6 U. l: N; A4 B5 i2 u0 {! G- Pfunction stopFade(id)& ~8 w5 N- p3 o. M. Z

2 R' D* w) {3 h' @/ _2 N{' R  C) l2 C% [+ ~

1 O- c( h7 y' k7 A1 h+ z% }+ \& S% m        continuous[id] = false;
: j( o* B* @/ F& x: C! i3 p
+ G) ]1 Q5 c# |: ^}
4 g/ r! @) D. b9 L0 c& w7 v# T0 c+ a  L* B
function StartTimers()# y0 T! C& H  l( |2 e0 G: O! f; Q

! a& N& I& ]! |{        //set up an initial set of timers to start the shimmering effect; W% G5 z6 s$ o0 }
: s6 A0 X* U$ ?6 j: c3 K4 O7 k/ C. g
        for(id=0; id<numLinks; id++). q, M5 b+ _) }$ w5 o8 F
1 i5 Z; ?) a5 O. W% E
        {
4 _3 k% h8 Y8 Y1 o2 L% n+ g0 v0 I3 |1 V$ T% n
                t=setTimeout('startFade(' + id + ')', id*100);
9 N  _- {% J1 a+ p5 \  g9 v+ h/ n2 j, i, q0 ^
        }7 m# [+ d6 J- f4 E- n2 r2 L/ I
  d$ P+ K$ S, q$ }7 f. W
}
: U. i( O  ]6 E3 _$ e9 Q7 W
# Z/ Y! N+ p9 b//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
5 X+ r; p2 m9 \, Q9 _! y! [8 e8 B& }# W
initLinks('#FF0000', 6, '#FFCC77');
5 p4 G; n( Y+ \; q; `- l; i# w1 D7 f- i' c) C
//-->
3 f7 D9 ~3 |+ b. F
; Y+ J- m8 ^& a! }4 j) \8 i% G</script>! [/ k: e2 m" B3 h
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名:58元
& M% V. a- h3 o( H; W" O</a>( _; \3 ~, Y! L3 q7 V0 V. g# {7 B7 o
<br>; M, r  f$ L: Q; y) i
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名:110元</a>
- f3 d; c7 d8 k  ~" W<br>5 K$ \) w0 i$ f; i, b& G- o8 ]$ `
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
9 G+ T8 j- M: x% ^<br>        $ k  [  c, `% N
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a># ^* C- e8 r7 X, J0 [: n/ X
<br>7 m/ [& E7 n! c+ n" m9 {
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>7 t  t: b( Y# c3 }! Q0 G$ D
<br>' ?& y: l, A! |3 G4 A+ u$ [
<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>
0 @% s& `# q8 N9 X' Z: l6 b$ s<script language="javascript" type="text/javascript">. f; ^8 c0 s& m( x1 \; t
<!--
  a- n# t, B# E/ J: lsetTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering/ Q5 E4 ]$ u0 a0 x. [5 [8 x; r
//-->
3 j+ x$ a! Z! g1 I' W</script>

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