返回列表 发帖

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

<script language="javascript" type="text/javascript">) V( G( I3 C8 f: e3 v1 S8 O
<!--/ Z5 e& i' v# j- L% I  p' }' h* t
// convert a single digit (0 - 16) into hex
8 I2 Q# S. [. Ifunction enHex(aDigit)' _; p1 j7 [- B5 E+ E0 x
{/ W9 I  |* R/ v8 o* T( _
    return("0123456789ABCDEF".substring(aDigit, aDigit+1))/ X& o' o9 {2 l( u( M9 R/ n8 r4 \
}9 \* z- D. d" V0 c
// convert a hex digit into decimal" h8 i: p5 X2 _
function deHex(aDigit)
! H* W- d, @$ C0 U1 T  C{
3 ~. o  R$ h2 z3 Z+ h* }0 d    return("0123456789ABCDEF".indexOf(aDigit))
' L8 b: `& S, j8 A}/ e* p, s* }% S8 J$ L+ Q
. b  a: Y$ a7 E
// Convert a 24bit number to hex1 o. ?9 p6 O- O  ^- d. y
function toHex(n)
; S  a, Y% c! R6 ^" B# |& }9 T{0 j; W# k1 G, d0 N7 z5 T* ?
    return (enHex((0xf00000 & n) >> 20) +" o% a% Z" E$ W2 i. b; f+ y3 Z
            enHex((0x0f0000 & n) >> 16) +' w, \: @8 e0 @9 S" y/ e
            enHex((0x00f000 & n) >> 12) +
7 \) O% f3 U9 H8 Y9 X3 S, `            enHex((0x000f00 & n) >>  8) +7 M- J& L6 V4 N% I7 @8 Y' ^
            enHex((0x0000f0 & n) >>  4) +6 `3 i- K7 T0 J; ~2 Q" r
            enHex((0x00000f & n) >>  0))" ^4 A  ]" N- t
}6 T& v' A4 `' m: C* Q
// Convert a six character hex to decimal9 b0 T3 k" [! y! O2 c- R
function toDecimal(hexNum)
6 k6 ]6 ~9 @& [( H7 D% u{
3 I# s( N/ ?; C3 [; ]           var tmp = ""+hexNum.toUpperCase()
- H5 W# s% b5 Y- V! A' y* ~    while (tmp.length < 6) tmp = "0"+tmp
  F, P3 u, T7 o* ~: {# r0 r           return ((deHex(tmp.substring(0,1)) << 20) +
! M1 G6 N( }6 \  t! R4 [3 e: h7 V+ y; B                   (deHex(tmp.substring(1,2)) << 16) +
0 Z4 N" O( N! |1 B$ l- h+ d            (deHex(tmp.substring(2,3)) << 12) +8 E4 y* C- |2 o* v
            (deHex(tmp.substring(3,4)) << 8) +
3 l: \5 i* l, W8 W6 U* H9 ?4 O0 F            (deHex(tmp.substring(4,5)) << 4) +) [) k& x9 J3 Z& g
                   (deHex(tmp.substring(5,6))))4 ^! t2 O) P6 a2 _2 T
}
7 b4 O5 i0 H% r+ W1 M! Z///////////////////Shimmering Links/////////////////////8 S, d* |! z9 S, ?: B6 @# A2 u
//global variables* E! ~# O4 J. l3 T0 S
var hoverColour& W, S8 Z7 k: ?* C4 p- [
var numLinks;: T6 D7 D2 C; R7 U* R+ m' K; C
var rate;
# a  h' C5 G% Tvar numFadeLevels;% v3 Y, S# K) h& D9 T7 d
var bgR;5 {% E8 I& v# m# e
var bgG;8 _1 R; l2 t# E8 O: P/ `1 D
var bgB;
) j' Y6 g- Q9 m3 k# Q2 {" @" Y6 [var currR;
, d5 \. j+ |# ?  w; S% xvar currG;
; D4 i  M  x- W& o. f3 [" Uvar currB;
) v* D; k5 f1 Fvar count;0 g! [9 I6 C% g
var fadeOut;
+ M0 f7 {8 P9 l2 {1 Rvar continuous;: i6 \0 D$ y( N8 m4 N
var newColour;
! s* f. e, t+ N$ K, wvar tID;
( X% q3 y, Y" ~9 F& k, Zvar redInterval;
: @/ L* F) V$ H9 n' Zvar greenInterval;
* q. f  j3 x" o, E4 bvar blueInterval;( b# Z% y2 d. G9 K% e( o
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)  k  A& }4 a, n* B" x
{
' X) b# i8 O2 {        hoverColour = mouseOverColour;5 `1 T9 ~! c8 G0 i- d9 k
        numLinks = numberOfLinks;
! C! y. s! Q3 t9 m4 W8 `) w9 w6 l        rate = 1;3 L+ v6 H0 t1 r# c- k+ ?( X7 ^5 A6 f
        numFadeLevels = 30;
. E, k1 w7 c' y: p; Z        function initArray(theArray, length, val)( I* O' o% O6 y8 s, O
        {/ K; D. e9 u% v
                for(i=0;i<length;i++)
) @% F, F+ u5 d0 o4 V& R5 @4 a1 }                {: Q- ^6 R5 k" E% |: t
                        theArray = val;
* t" @* b( J7 u, F                }/ s5 }/ S6 B# P
        }
. J4 Z6 q8 @8 V# ?1 A2 h        bgR = '0000' + fadeOutColour.substring(1,3)$ y9 ^) ^& {: m
        bgG = '0000' + fadeOutColour.substring(3,5)
' w' E1 t$ P+ U7 ?# @0 O        bgB = '0000' + fadeOutColour.substring(5,7)1 r# {) T- l+ p/ z& [  w: p
        currR = new Array(numLinks);: J7 t; j% m$ V8 x  Z7 j
        currG = new Array(numLinks);
! v' P4 O( E( }' C2 u        currB = new Array(numLinks);7 q  H" U" D, {  Y6 o
        count = new Array(numLinks);2 J: x6 c/ E" t) Y  K+ D
        fadeOut = new Array(numLinks);
' E. o  m/ o* }/ L8 Q7 s: e! X        continuous = new Array(numLinks);
; e3 H+ \+ D2 Z2 g        newColour = new Array(numLinks);
. X: G) H2 G3 P: u: o, |6 h        tID = new Array(numLinks);
) e! z7 X, Z) Z% T        redInterval = toDecimal(bgR) / numFadeLevels;5 w/ O) k- y% V' G  H3 }
        greenInterval = toDecimal(bgG) / numFadeLevels;# n( B2 M$ \+ b2 t
        blueInterval = toDecimal(bgB) / numFadeLevels;
  D% v7 I( T! X* z, L) k- D1 c        initArray(currR,numLinks,0);
3 D% A+ X6 j; \7 m( k- N4 F' w        initArray(currG,numLinks,0);; E% j  }% k" z9 m' v' n
        initArray(currB,numLinks,0);
* Z2 g* u: }& Q6 G- L- n7 w, u        initArray(count,numLinks,0);9 ^* H! q. X3 B: ?- b3 X- o- L  C
        initArray(fadeOut,numLinks,true);3 w+ N: `4 ^8 K3 h9 A
        initArray(continuous,numLinks,true);: ^; T2 Z! _0 n; x- z. |
}        9 A: V- a) \' M6 Y# |
function startFade(id)
: N  j7 G' W) J6 t{
( A' Z7 {) j+ Y( E* e& k6 K        if(fadeOut[id] == true)9 G4 K3 @5 _, L6 y, S- ~  @" @# e
        { /*move colour towards background colour (increment)*/
, a* z& C% Q# l* b" ?                currR[id] += redInterval;+ Q: N" R  ?- k; q4 w6 f8 ~* c
                currG[id] += greenInterval;0 O, @& N3 [( ^* Q: }- x
                currB[id] += blueInterval;
; x1 W5 D" F+ o0 J                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);7 [# h$ H6 O" t9 s) f! E
                if(++count[id] == numFadeLevels)6 V5 C+ m/ e8 ~$ x( `* ]0 [, o! e
                {
; s4 B1 h+ b+ r/ g8 M! K                        fadeOut[id] = false;/ e# x/ H2 B# n( y% J
                }
/ t) p3 J2 w5 X        }
+ X: n7 b9 d) X        else
1 b8 K! e6 m1 Z8 h        {% ?6 f1 v% u8 m9 n; f
                currR[id] -= redInterval;. z  ^6 D' q; m2 f) w9 V# j0 T  u0 I
% e% g* O" g  o. K# Y4 ?
                currG[id] -= greenInterval;
5 i  u) M) [, c0 d3 ]8 f! U+ g% e2 _! S6 b2 u; [
                currB[id] -= blueInterval;
( r! @6 Z- v+ [) ~" p0 G6 ]- H- F
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
- @! _& T6 u( @7 _$ b9 H! O
$ `3 I& D3 T3 G6 D/ d+ u, n/ S/ u! S9 v                if(--count[id] == 0)
6 Q7 C0 m* n1 U: S! Y) l! h% Z5 m* l8 p" K" G, N% ^: n
                {! d& S$ B9 E) I$ Y

/ _- _) p3 q- T                        fadeOut[id] = true;) R8 O* _9 @0 h- t

+ A" G" x% v3 f* k* r                }% F' S) i& ]; \* ~* B

) Q' c' G- L; K# L+ S- }4 g7 N        }
& j/ W2 P# M& {7 L2 p
* [. j2 `# k5 ?6 j& g$ k( I3 @. D% M1 c        if(continuous[id] == true)' Z: P  }! L) C. N% j/ M

( c5 X5 p9 P9 L/ z$ U, D4 X        {. e8 w! p# E5 W$ W) J

! Y! e  ^% F) E8 |. e9 a* t                document.getElementById(id).style.color = newColour[id];               
% @. D3 w! K9 Y% C8 w! j
% C0 q% q/ e0 X) ~* t4 y        }
+ O7 F: x# t- ?3 D( ]- H( W: N( C2 \# Y: ?: q4 b
        else+ g* `, \3 o% L: Y5 U0 W! _
7 }2 S! t0 V8 {+ H3 W1 h/ t5 ~
        {
  A2 {% n7 o% l$ @" d* K. l  |3 Z$ d* m. N  K
                document.getElementById(id).style.color = hoverColour;
6 e8 |3 A4 N) q: d: Z0 j  h
4 s. N) r9 Y) T5 O: R        }
. Y5 D0 t: r* ^7 |" V  `
9 U4 H$ \8 W! X7 Z5 ?# S        clearTimeout(tID[id]);; G: @6 ~0 K5 }: K* ]
  Z' F8 Y: k( c5 a, ?0 h  G
        tID[id]=setTimeout('startFade(' + id + ')', rate);' D5 J+ d0 i. }2 b# b# [
7 U' y$ R: O7 Q, h8 c5 w4 ]
}4 b5 L9 ~; Y5 [" E+ A# S
, @2 s; Y- C6 U$ }
function continueFade(id)
( D+ J9 r$ ?$ d) N
) x# w( m8 L" t% C- M) V{) I7 a! U/ I' \; }& `

6 t- H- ~6 Y! @% P. b        continuous[id] = true;
, L/ {8 K1 {& J% x9 {# S0 [
" S6 ?; f) q5 w8 @}
; {6 M. y3 G6 X9 S/ O4 J4 N& f
) M" U2 [2 q2 \2 o+ Z, gfunction stopFade(id)
: G( l, h3 z; _3 z1 j7 q% a* h7 A! A0 B9 W% x7 X) B
{- k# x$ a4 A6 W# y+ [9 W
6 C6 t2 k3 |0 }, X) l
        continuous[id] = false;' @. n* z$ \1 N& w

4 _, z+ A& J, Q2 |0 S2 Y9 x}* Z# {6 p6 x# f# r4 v; b2 q

) s; K$ X, y! xfunction StartTimers()
; k, w  k# n, O
8 [9 U8 S4 }6 w5 ?{        //set up an initial set of timers to start the shimmering effect
/ a$ z. |; e" X
' Q! e8 [3 @. M1 h, S) d) x        for(id=0; id<numLinks; id++)
2 m0 D  ~$ h! d9 w8 i8 @4 a1 ^- E, P' T* k! X; i5 B/ Z: S$ b& v
        {( S) s& N/ B- h: B0 Y6 L2 B* Z$ c

; G$ J9 P  O0 z$ G4 N! h                t=setTimeout('startFade(' + id + ')', id*100);
( ]9 C7 y6 M3 O$ N$ S/ F2 m, k, B8 \5 c, o$ X
        }
- ~* o" n( U# |% o3 t8 n8 }0 O- s% @1 ^5 J8 |6 x4 g8 F5 w) |
}0 {3 [; h* y! F/ {, F5 C4 M8 D
5 g6 _+ `. Y6 H% f( m
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
7 _: u; Q& s8 M2 u  S' g% z$ ?6 Y4 [  `  Y- e
initLinks('#FF0000', 6, '#FFCC77');. \( Q, j9 C8 @& U
" t- S: O$ Y7 v$ I6 e. h( h
//-->+ F% N1 Q0 B5 @: v
& Q8 `) v# Y% j( `
</script>
4 r. d' Y& @  S<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名:58元! }1 p6 ^! L7 \8 f
</a>
+ j4 A! t5 Y) X# M6 q$ r1 s# g) n<br>9 [; s: o% u1 e3 {: j7 C2 O5 W
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名:110元</a>
6 Y" K: A1 S1 L; [<br>
7 d5 A* z# f. ^# E<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>$ E3 k' B) T; \# g* F' D% z
<br>       
# K6 `# {/ R3 D6 ]4 C<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
9 |4 e( d7 q4 I( I: {7 a0 {<br>
9 @# m1 O5 y7 P' P7 c<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
6 Z6 q$ T4 v' F  R: Z# X# c<br>
; J, v' }0 Q6 w1 I' ~1 E7 |<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>9 E; e  o) d: o6 I/ U
<script language="javascript" type="text/javascript">
8 ~5 _+ I" }+ h  Z<!--5 m  Q/ j  W% g6 ^
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
* Y$ J+ `& E& R+ `' |2 d//-->4 h6 D! ^- W6 s" P
</script>

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