返回列表 发帖

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

<script language="javascript" type="text/javascript">
5 t9 Q3 r' r2 x+ k9 u; ]0 s4 v! o<!--; d( d0 r# k' ?' ^: J0 J$ k
// convert a single digit (0 - 16) into hex# H2 U3 r: M6 v5 R6 m$ [) d0 p
function enHex(aDigit)
9 O3 H9 D) o. p$ g{
8 {. y/ M+ H1 E0 e' e0 i6 ^    return("0123456789ABCDEF".substring(aDigit, aDigit+1))9 ^2 [+ y! ~. S/ \
}- c3 H* }: s( d) ^, s) K
// convert a hex digit into decimal
" J- O7 c7 k6 P/ k/ k! Y% Dfunction deHex(aDigit), s% \: W1 U+ k9 O
{
7 M/ p" y2 n% T: t' u2 A    return("0123456789ABCDEF".indexOf(aDigit))
4 Q7 ?$ l" m# v6 U; x) X% |}% w  ^/ S3 F9 T4 K7 p( O

6 O/ M$ O7 ~! q- o/ }// Convert a 24bit number to hex! m; d/ P3 B8 ?$ _& x5 }
function toHex(n)
' ]" W( A' L" @{* [  N" P  \! f! y
    return (enHex((0xf00000 & n) >> 20) +
8 b5 D: ?( S5 W& s. w5 L2 E% C! o            enHex((0x0f0000 & n) >> 16) +
4 k. E/ A0 x7 b) F0 T8 Z! l* [            enHex((0x00f000 & n) >> 12) +
4 p* K( u: ~* T3 a* e" L            enHex((0x000f00 & n) >>  8) +
% Q$ e6 D* ]) V, x3 I' }& \6 i            enHex((0x0000f0 & n) >>  4) +; Y7 V: [; L5 u1 G
            enHex((0x00000f & n) >>  0))
5 r* p7 X5 j3 r2 \! v}6 C* Y& b1 K$ w( m( ?) G
// Convert a six character hex to decimal
3 d/ v2 }3 U4 a4 n' t% d: cfunction toDecimal(hexNum): H4 m5 K( X5 R
{
. m! I5 \; c' Y! t           var tmp = ""+hexNum.toUpperCase()* ?. o/ A/ N* D/ i$ L2 q# x
    while (tmp.length < 6) tmp = "0"+tmp6 _) \9 H3 u0 R8 q/ ~" t  }
           return ((deHex(tmp.substring(0,1)) << 20) ++ ~1 R2 a/ b: |2 E- G/ F
                   (deHex(tmp.substring(1,2)) << 16) +
0 o0 Q! v2 {! P0 R) p8 K            (deHex(tmp.substring(2,3)) << 12) +
8 \0 j( ]) {2 K, P! w1 ]4 q# F; b4 l            (deHex(tmp.substring(3,4)) << 8) +* I& H; |& F- m- ]2 u" ?
            (deHex(tmp.substring(4,5)) << 4) +2 b, R# u, ^! |* g) j
                   (deHex(tmp.substring(5,6))))6 u3 r2 W$ l* p9 u8 B" n
}
7 {1 I6 {$ S, u5 T///////////////////Shimmering Links/////////////////////
( I2 C2 g, C1 C. c7 }- p//global variables
! x+ D, p/ N* L* k1 l9 t6 {$ s9 l/ evar hoverColour
, E. z2 j9 A4 u0 V6 Zvar numLinks;7 Q) m$ I+ G% ?3 M
var rate;5 q+ k- ~' z; [1 b( _
var numFadeLevels;
4 o) ~' ~, o0 L! @0 Xvar bgR;
" G7 n. f2 M' M7 K: c3 x5 ]var bgG;& i& M4 k- _3 Y9 L
var bgB;& S2 ?7 N% c6 p$ }
var currR;
+ X& C! Y9 }/ x% e: _4 g' Zvar currG;
. ~2 K) t1 H: d- v, x: H+ H2 ^6 Dvar currB;: N  j5 G+ n. `( ^/ Z& O
var count;
: ~) C! }$ T( _5 u# Rvar fadeOut;
/ i8 S( ], x. c. R, \var continuous;
/ ~- ]6 T- ?2 I9 h" s/ j2 Xvar newColour;
$ w2 ~. `5 U) {$ hvar tID;3 E+ |! M; I2 E7 b( R
var redInterval;
* y  @5 ?) I- v: r* }: ~7 bvar greenInterval;/ @$ e7 N2 }8 W. [
var blueInterval;! y8 ^# v# U+ _
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
- Q0 d( i9 ^  V% u7 X{
  q: {9 ?" q* h0 a0 a        hoverColour = mouseOverColour;
6 V# A% x# w& |% q. V. W! g        numLinks = numberOfLinks;
9 a  U+ L- e3 C: d8 t        rate = 1;2 F( l7 f7 S# Q' C5 O* q) g
        numFadeLevels = 30;6 K6 J+ o( }" i1 O, }
        function initArray(theArray, length, val)
# _9 M8 g/ s8 S! E& n6 C1 C, W. ?        {& f/ Z6 _1 ~+ G2 L; N; Q4 j
                for(i=0;i<length;i++)
, h3 \$ ]4 A2 A/ T                {) H& O& S& {5 T! H; m: f
                        theArray = val;9 x  d% V/ O9 J, e
                }
/ s% I. _# b" A" M        }' n. k, D# F; [$ Q* {3 M
        bgR = '0000' + fadeOutColour.substring(1,3)
; u% M" e4 q1 [+ |% b+ ^% J        bgG = '0000' + fadeOutColour.substring(3,5)
6 I9 B/ u9 }/ B+ a# q        bgB = '0000' + fadeOutColour.substring(5,7)
1 U- W7 k/ @- d4 f% Z        currR = new Array(numLinks);
* \6 N- y/ W; }6 F" n5 p9 Z        currG = new Array(numLinks);
$ |( ]9 _9 T; }2 G8 v/ _) ~) u0 L        currB = new Array(numLinks);9 n0 ?. ^+ V6 b( d6 o3 z$ f
        count = new Array(numLinks);
5 g: N, m. Y# J9 j        fadeOut = new Array(numLinks);3 N! C6 i3 E7 a* `+ z6 y! S& T9 j: Q
        continuous = new Array(numLinks);/ {0 u! ?8 \: X0 |- @/ M0 @
        newColour = new Array(numLinks);8 V# _" R' k' j7 F+ }. Y
        tID = new Array(numLinks);  O7 _9 m) X% W) E. v4 H# K
        redInterval = toDecimal(bgR) / numFadeLevels;
$ h; s5 n" o; L2 k2 n        greenInterval = toDecimal(bgG) / numFadeLevels;* l1 Y4 }! A" _3 F
        blueInterval = toDecimal(bgB) / numFadeLevels;  G& U0 ]6 U% O$ S3 j1 S! \  j) g& ?, \
        initArray(currR,numLinks,0);9 o6 ^3 H% y+ d7 ^% S: e$ |
        initArray(currG,numLinks,0);* ]& `+ O; Y9 S  g
        initArray(currB,numLinks,0);
# v4 l  o7 O, {0 {+ ?        initArray(count,numLinks,0);
4 g4 w7 s9 e0 P  e* {) V; o        initArray(fadeOut,numLinks,true);
3 V3 E" A( q( ~/ C4 @        initArray(continuous,numLinks,true);6 `6 [7 f$ z. A/ Q4 ]* ]! ]7 p! v' X
}       
' a" x- g* o! Y2 P4 E' c; Sfunction startFade(id)
9 ?# L: k: K; x7 S/ }{
  o1 e0 z, q( Y4 f; O: ?5 Y; [  n        if(fadeOut[id] == true)  O- F) u* Z- K- x& A: \' I. ]6 `
        { /*move colour towards background colour (increment)*/
$ w: ]& e, t/ p4 a  h. E                currR[id] += redInterval;' t% ]& \' F0 V9 E
                currG[id] += greenInterval;# l  |. X3 |" w; Q6 I$ b, ]  z6 t
                currB[id] += blueInterval;1 d' v8 E7 S7 t. @* S
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
- m% x! D* a& Z                if(++count[id] == numFadeLevels)' b; Q! {/ A+ e$ c$ f. \- ~1 ~
                {
# X% o7 k7 i( t; n$ P3 h                        fadeOut[id] = false;3 E1 n& Z) ?- o/ ]8 b
                }
+ g4 X& `1 y8 T0 k- N( m$ h        }
# S1 n. L, P& w+ U2 O4 d        else( B6 ?1 n  G/ L, \$ h4 a
        {
3 x' U/ j$ z3 m6 E1 l# y                currR[id] -= redInterval;
8 ~( _3 D2 ~. |3 |* k+ }2 \% Y8 i$ ^
                currG[id] -= greenInterval;/ L8 R, |! U2 W  [' Q5 \& Q
! a+ }; _2 V1 F! _
                currB[id] -= blueInterval;
. g$ Z3 `( ?+ ^3 R/ ]2 H* l- m7 Y$ N) d1 |8 ~% d8 I
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
# c7 X8 E+ ?" ]" v$ r; z1 W" l7 I/ L" E' k. O  z3 \
                if(--count[id] == 0)
% s! ~7 N* ~) p& U; N* Y" v! i4 c$ w3 i7 I3 K; @$ C8 _+ l. U
                {- }, n  R5 M+ R% a9 r
+ A! D$ V5 L& ]* f; K
                        fadeOut[id] = true;. Q1 W7 W! i$ }" ~
; u2 T1 d! b) H2 Z. g1 S  m  X7 @
                }" o* I2 E3 ?$ `2 I, W
$ c* w0 U0 }2 Q7 @  C) M  ]2 V' z" B
        }
8 c7 r& F+ H2 ~: z5 D% s+ J6 X/ @' [% n) r4 U+ R% v2 o/ c( c
        if(continuous[id] == true)
* Y1 }) w" S; ^* B
5 F9 _% V* R8 n% {* F$ C: h        {3 l# `5 \  T' E6 i* n& b
- |* n( ?& A( X% J  \) [
                document.getElementById(id).style.color = newColour[id];               
! \  ?/ W" O1 O! h1 r$ ]# k) X' W) b& J, t9 g6 U9 [
        }
2 Q2 f+ M/ W! m: K6 D
2 p6 j$ Q9 x$ N9 V        else
+ f$ H, X, ^) p2 k3 ~
5 J& C1 \3 G- {: p0 c* U% M1 Y        {
& W: g& n6 X3 G( n" R$ h; f" R7 z8 h3 _6 H5 ]5 m0 _
                document.getElementById(id).style.color = hoverColour;
: S" o" D: p' _+ @4 k. z
3 c+ f3 i; I4 _  i. q        }  E5 i9 w+ g% m2 e6 N, t4 |4 S' }5 X
1 {* v% v: d' h; R$ @
        clearTimeout(tID[id]);
( w) G( o. b6 f; B0 {( z3 s' [4 V( K# G; P6 m
        tID[id]=setTimeout('startFade(' + id + ')', rate);3 [# }  w6 U4 f  \
: b3 v( K( ^3 u& v
}% q/ x+ L% [  n" s& V1 Y

* o, |8 E- p9 n$ [* E7 y2 Ffunction continueFade(id)
) B' q) ]) V9 W: d3 ^4 |
5 s5 ^% ]; l9 x. P3 E{
* p6 k8 c6 D6 h# o; F( `) |( G+ y# V. [9 V
        continuous[id] = true;5 J/ Z1 _, N- H" |) L

1 J, c* u* x8 Q}- V, N( ]" ~7 t5 W) P

+ [- O" Y- O' W; Y# x' z- F  B( E6 ifunction stopFade(id)/ ^$ \8 n* G! \9 i: K4 s' E

$ v8 o' S( a. O% k{+ }8 Y, W0 U( a% N0 O# {- C' _
; a- Z6 e* Q& {5 }$ {. q3 X! H. i
        continuous[id] = false;/ ~4 Y, K% P- L+ Q! A
! K/ |6 X" S, E0 Y
}" r$ l; t; [6 e( S. ]- \
9 S% A" _& B9 d; x+ @) [+ @8 D7 _
function StartTimers()0 j% u0 Q/ h, E5 y, T- v7 Y/ R$ t

# x" D& M; r. X( b! L9 {{        //set up an initial set of timers to start the shimmering effect' j7 L, n; k1 v" W+ ~7 D
$ Y% j; X. v. P' @$ _; H3 P& d3 C
        for(id=0; id<numLinks; id++)
6 f7 D! E9 d; d7 s% G  Q! `: c7 w$ m3 X0 S: z3 ^) `
        {
8 G. V( t; U% M0 Z/ ~5 [/ p7 S
8 z6 ^% o: B/ r; a                t=setTimeout('startFade(' + id + ')', id*100);+ |$ w; A4 ]* d1 s
* v0 G7 R2 h, o3 R( ^( y
        }
  _1 @4 E% ]' P1 s9 J6 R5 p# K$ e
' d  y# i" A, N# q}
5 }" ~: }' W$ |
/ ]' D3 d3 y6 m- p* \! O! e, u/ L7 _+ ~//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
! f8 l9 ?* W9 @6 h4 h, q6 @
" r( g. ^/ Z/ v" M) W' pinitLinks('#FF0000', 6, '#FFCC77');
, m8 [) r3 J( B2 Q3 y1 g2 `/ ^. o4 [' T' S9 ~4 ~  |
//-->
( X& c- ]2 k& Z8 C9 h4 c4 Z3 O- ^' R. N% L3 e. n
</script>6 r& s$ _7 Y1 w
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名:58元
" r' r9 Y% A6 o2 b</a>" `& W1 K; r" C5 Y2 q
<br>
0 {7 P. B$ @( g6 A& b: D" u<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名:110元</a>
1 t% t; j" o: }% [  f0 F/ [+ W<br>8 C! F) x! x( E* W
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
, ^% D9 E7 b* }7 a% e8 N1 H) L<br>        + Q% p& x3 u3 @1 J' b0 }4 K
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
8 W; N+ c0 S' \  l4 x<br>- W8 Q3 s5 j/ y6 D5 c) @
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>$ k. h! i! m: r2 p6 [
<br>8 g* r+ O- y! T: O# P( \7 s
<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>' q9 k( l* C" M) P, x- \
<script language="javascript" type="text/javascript">$ g- Q2 A' I+ L! E7 c. x
<!--
1 i4 U) {/ P6 W" M$ J/ l; jsetTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
" J9 Y" a% j( m. v' Q6 c//-->& Z% w7 ^( c; {: d& u8 S
</script>

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