返回列表 发帖

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

<script language="javascript" type="text/javascript">
# A5 \, o# X4 f6 p/ C<!--
4 n% C4 O2 Q/ I- L. g// convert a single digit (0 - 16) into hex
% `9 q* \5 C3 A+ H; J+ s" l5 `function enHex(aDigit)- E. U+ U( p; s: J4 o: W
{
3 C* x7 m( M- N! @, y6 d6 H. C4 G3 h    return("0123456789ABCDEF".substring(aDigit, aDigit+1))
$ L2 [: s& i* w8 E! T}; v" e! u, b( d% N5 Q9 D
// convert a hex digit into decimal
$ S7 k) D7 A8 Z% pfunction deHex(aDigit)
0 v" L, P, Z1 S, ^{
9 C0 |% U" B8 ]* y    return("0123456789ABCDEF".indexOf(aDigit))
  H8 E( C) d% |) J% e, p}
. h% k6 ~8 N" s0 h- ^
4 X; i; |0 B( f: W2 |) Q3 ^1 n% R// Convert a 24bit number to hex2 ?' c0 m! e, c  u
function toHex(n)
( k- |4 C; c1 H6 t{$ _: {* I9 \. j* |  D! a* t
    return (enHex((0xf00000 & n) >> 20) +
0 Z$ R, m) _' ~            enHex((0x0f0000 & n) >> 16) +& c: }% c7 e3 t) G: e( V9 {% h
            enHex((0x00f000 & n) >> 12) ++ I! h( ]0 d( _  B+ a5 E
            enHex((0x000f00 & n) >>  8) +( ?: a- Y* k! d$ g: C% H  t0 o4 a
            enHex((0x0000f0 & n) >>  4) +
  [# G6 F8 I- y: Q5 [4 X            enHex((0x00000f & n) >>  0))
, U1 x; R* G. w" b0 h5 Q, T2 k}
, F; g: b" G2 |3 {. R. P+ `// Convert a six character hex to decimal" ?- }3 j# s6 O5 x+ @' N1 n: @
function toDecimal(hexNum)
. G) z  Q/ V1 y; R/ [6 F7 A$ [( _{' I3 d7 p# F- I* Y
           var tmp = ""+hexNum.toUpperCase()
1 Y2 a9 I: }& C0 a" H# ~/ t    while (tmp.length < 6) tmp = "0"+tmp: t& q# k% [! P7 o" D- B2 r
           return ((deHex(tmp.substring(0,1)) << 20) +/ g* D3 e" r$ }
                   (deHex(tmp.substring(1,2)) << 16) + 2 E+ ~5 g! `+ t/ L& l) m
            (deHex(tmp.substring(2,3)) << 12) +
% r2 |( G* s8 r* X- K% ]; }            (deHex(tmp.substring(3,4)) << 8) +
! W# K- A/ K; t            (deHex(tmp.substring(4,5)) << 4) ++ U) ^. k* t) U8 x
                   (deHex(tmp.substring(5,6))))$ m4 A0 B4 b7 E" U2 l. ]
}6 x8 V$ T' a& i; u% K; G
///////////////////Shimmering Links/////////////////////
2 N( }+ `4 E# h* A//global variables
5 j/ E( R3 b3 yvar hoverColour+ y: ^( n. U9 J) v9 _$ q" x( r
var numLinks;
' p' }. p  W& G8 z2 Tvar rate;. D4 {  x6 g9 b8 n/ P
var numFadeLevels;$ `8 g3 T/ P+ z0 J+ u
var bgR;
$ u. S! p+ E  I) Q6 U7 Zvar bgG;$ a. o; }. v" [: i1 a/ s
var bgB;
8 p7 q* }: w) M7 c2 q- ]var currR;
3 o6 J( C5 a( |5 `* B' Avar currG;
2 a' c1 b1 s0 T6 yvar currB;
; F% X! a0 S( q7 }) Bvar count;2 p: m1 l! c+ W5 Q3 X
var fadeOut;- ~  U% [2 i1 u& N
var continuous;
% [; }; K' |" O3 g, Yvar newColour;. C/ C8 s2 E) C
var tID;9 i5 [. K9 g! C1 c9 n* {3 f& r3 S9 p
var redInterval;
6 a' P! T/ _4 X2 r: Y% q! h+ G; Jvar greenInterval;
3 u( m9 d$ V6 B6 p5 Ivar blueInterval;/ V# ?" o8 ]6 s. i
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)! o% I; i' i7 Y7 C8 y! V
{( f) z( O/ H3 z4 i
        hoverColour = mouseOverColour;
7 j8 a+ Q. Q" _; j' A        numLinks = numberOfLinks;' v* o, ]- [) ?( B" {$ C
        rate = 1;: z  q( d$ I7 U4 [$ S* s) `, G' }
        numFadeLevels = 30;
7 K2 G! J* I% _$ m1 {8 U' N        function initArray(theArray, length, val)
' h; t2 z- R) h- [& H7 [        {! ^' w' h! }" V4 [8 C0 y) h
                for(i=0;i<length;i++)
- [8 b3 p% E; s# C6 M                {+ V( M1 X$ `; N8 [" A) z& ]
                        theArray = val;
; d* X# ^4 {" t                }
  X% ^# ]2 {* F* O' o        }9 o- H1 X1 p0 r5 ^4 c7 p
        bgR = '0000' + fadeOutColour.substring(1,3), B) F& Y/ f8 |- v% ]4 \
        bgG = '0000' + fadeOutColour.substring(3,5)
4 [* i- c( b- x        bgB = '0000' + fadeOutColour.substring(5,7): q  {8 F' @- R  u& k; j5 O- P
        currR = new Array(numLinks);
4 o; }6 W2 [) j! P        currG = new Array(numLinks);0 c! B* e9 Y9 R" M. r4 {% r( b% e
        currB = new Array(numLinks);
, O3 Z' r; j8 g7 w        count = new Array(numLinks);
  \4 ~2 m/ X8 K; _        fadeOut = new Array(numLinks);
* u. E) a" }& t+ g2 e+ k) a9 ^% a7 c        continuous = new Array(numLinks);
# }0 [( i" V+ h7 ^2 u1 ^* i. |: K        newColour = new Array(numLinks);
( M& X5 q5 P4 g9 I. N% _        tID = new Array(numLinks);
2 v, n+ b% Y! B7 n' j        redInterval = toDecimal(bgR) / numFadeLevels;
" F1 ^) R" m1 D2 {        greenInterval = toDecimal(bgG) / numFadeLevels;* B" b- H, {" F
        blueInterval = toDecimal(bgB) / numFadeLevels;( C; G1 l/ V) H2 Q% h
        initArray(currR,numLinks,0);5 G0 l' x5 ?9 L' _) `+ N, s
        initArray(currG,numLinks,0);4 ~! i, E2 N6 O9 W4 s2 |; j: l
        initArray(currB,numLinks,0);
+ `+ {8 @% \5 Z6 v! c        initArray(count,numLinks,0);( T, O  |8 l) a: Z4 ?  R
        initArray(fadeOut,numLinks,true);
' g1 S/ p0 h( \5 {. Z        initArray(continuous,numLinks,true);8 q2 ]: n) Y8 @' g6 L
}       
" ]: |- ~& G" E( M* }$ N- j: Ofunction startFade(id)- M% o, D, S7 t
{
2 I4 k( G- @; q/ ~3 D        if(fadeOut[id] == true)
# t$ i0 q& z& N) }6 D        { /*move colour towards background colour (increment)*/# r& _$ v; n" ^+ X2 X, d3 u, n
                currR[id] += redInterval;
) e2 q, ~" l8 F. W8 w7 v3 f; y- ]                currG[id] += greenInterval;
: W$ B$ O' T0 [: U5 S2 O                currB[id] += blueInterval;1 g) M! W! ^  \$ C* @: c
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
5 Y5 R& @7 q+ w7 O- O. p% t4 U                if(++count[id] == numFadeLevels)
8 w2 t  D/ _7 y7 a; O+ X% F                {
/ [2 r, _) b. f                        fadeOut[id] = false;
/ ~: c& s# G6 A/ `- x0 S- w1 z                }# m. n0 Q- ]+ z9 o, a7 E. S( H) x
        }+ k# l1 @- a/ Z
        else
8 w- L/ Q  K& z; V% e  n4 K        {( e+ u# J6 E+ b" ^2 x- C6 O) w
                currR[id] -= redInterval;$ `; V& Y. g. B; _+ K

! p) q; h% h' n7 d8 G/ r4 ?0 M                currG[id] -= greenInterval;
9 Y+ |7 R/ n7 x' d: `+ D% y( x' B2 n
+ s$ }/ K2 B% W1 g' c* b. a                currB[id] -= blueInterval;
  W- N, W2 R, P* L" J. d3 _9 [, ^3 @8 {* ]
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);( u! \+ ?+ o! i+ F% N- z& C
, I: Z& A1 A+ a5 p' O( p8 ^# n2 `
                if(--count[id] == 0)
8 }1 P4 |0 ]2 U
* x/ t8 [" g5 K$ W                {
: s4 s" [7 ]5 H7 J2 B& |) u/ a# W0 {( J# H$ s/ C4 G
                        fadeOut[id] = true;& A8 J, P% @* D! m5 y8 J0 _

; k+ k- C3 s1 L1 [6 q' P! ^                }) l6 h! O! E' L9 m% G8 X

' W' D" v* g  j1 O7 J        }9 W8 G' e  j2 J' a+ r: |) }
& q$ u% w$ Z4 w) C- a5 l* `1 H
        if(continuous[id] == true): P& Z. J5 v9 a

; B, x# f$ e6 k  O% F        {
1 ^. P( l. j+ ?: E# e; t, a8 A. C- P5 c& W
                document.getElementById(id).style.color = newColour[id];                % M/ d+ ^4 Y9 E
% b8 [# L& H! k1 O* t
        }$ z# a$ _3 S5 ]$ M: Y7 G

- Q, A- L0 K- Q! z7 @        else
) Z% R2 }6 ?/ {- y7 u
& X8 `6 E2 z7 w        {2 e5 v7 ^* W  j' M

+ ~9 ^& W. x, N3 k% V, F                document.getElementById(id).style.color = hoverColour;4 x  m) [0 W* A, {5 ?. z
9 N. ]6 E' m3 C7 q6 V8 v# B. o& `0 C
        }
' b% p7 _8 x6 \% \! I  C9 z
. b, e! v1 _& i2 p$ y        clearTimeout(tID[id]);
& {- A* _0 L* ~# A# `7 u! H: D/ S2 N2 q
        tID[id]=setTimeout('startFade(' + id + ')', rate);
) M4 H0 D  Z  B+ Y9 d( W7 L! \9 Z% w
}7 m1 j/ v& i" K# k7 ?4 ~& t

8 _* K+ z- i& _( Jfunction continueFade(id)
- ?9 \+ y' J- s0 e( {, x# |: G
# X& _2 U& r* W" n{/ w- P' ]: o1 X0 R
% C4 s- |# V, [% l$ ]" J
        continuous[id] = true;! y& F+ M5 _0 _

6 ^7 I- d; F3 o) q. F& y# f5 [) N! F}2 v: d0 e; l. k' Y! q! S4 X' p: L

& C2 K4 o) ^( n2 C: g1 {function stopFade(id)
+ `8 R3 t  L# O# o. U1 C$ ]& V$ R3 U1 \9 r  Y* E/ E& @& k
{: [4 o) i  _. a) w6 B3 t7 D

3 y* t5 f  S$ v" Q( Z) J        continuous[id] = false;
+ k, ?* Q; c: ~' e
+ {) V& C* H  M$ I+ t$ l# s}. r/ ]9 E$ a! a6 z

! T3 d3 g: \( e* V. O  Gfunction StartTimers()/ _1 E$ N4 Z+ _6 @1 _5 _
: V- t, |& t* h0 b7 j8 ?
{        //set up an initial set of timers to start the shimmering effect( g! r4 O0 ?* y
8 c% ]8 O8 d4 G& E- S* g, ?( g% n; t
        for(id=0; id<numLinks; id++)
( g7 N6 ]% d" t9 n( I& o, [3 y, b
  L5 |% K8 E; F, p# e, P        {% Z  \0 B, s* v

% l, p1 M2 x$ t, k; H                t=setTimeout('startFade(' + id + ')', id*100);
2 X5 _" s& ]( M3 B
7 Y- j) d6 k$ E/ ^8 }" K. c& |        }
; V' G8 e  A5 w5 v
& ~7 B1 I: W: B9 J" @7 T$ S}
+ o3 h* ~# S$ n' M/ C
1 S2 ]% r) r; C8 Q: M0 ^: N//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
2 _' F4 X9 w" T: l" l9 D, w5 f* v$ b! P/ C, N$ ^
initLinks('#FF0000', 6, '#FFCC77');  s3 i7 T- O9 v  [$ Y9 k

1 [; D- o; _( ?//-->3 g( l* J9 J2 m, \# k
+ J9 I1 C3 {( e8 [" w1 J
</script>
+ g6 `. C& _/ X) ]4 M<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名:58元
4 @. J8 |4 w# v  }$ h</a>' m, e0 I$ k1 B7 {. q
<br>: C1 f& Q+ z! i) o! ~& G2 v$ a
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名:110元</a>
% ]* F" w8 t4 S2 N7 t& Q1 C<br>  Y. D1 U$ d! v
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>8 _: B  B& y4 S7 l, L) E
<br>       
7 A! w2 \0 n' ?/ F. L<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>% ^& Z& p: X* K' d: W; U! p
<br>
8 K# S7 Z: I; s: ~6 A! A<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>5 b% u# x: N& _2 f) _- t* J
<br>2 Z; }5 ~1 N  L8 k/ Z, x0 D
<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>! o% p, }" |' ~) z$ j/ u" k
<script language="javascript" type="text/javascript">+ o/ O# ?/ @" [, f$ D
<!--
7 p, t. i- d" ?( s4 esetTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
* Z& P% F) ^2 w8 h& J7 e//-->2 A0 I. _, ?. U5 l( |. x4 \$ d
</script>

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