返回列表 发帖

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

<script language="javascript" type="text/javascript">
8 n+ U+ d8 \4 \& B/ B- T0 b+ _<!--2 \6 ~9 Z; Z8 A% Y8 `
// convert a single digit (0 - 16) into hex
9 t3 b/ N  v" D  k; \3 w' C/ O3 Dfunction enHex(aDigit)% `" B, @4 p. U: q6 W9 d- u
{
0 n3 S. ~/ f3 P! J    return("0123456789ABCDEF".substring(aDigit, aDigit+1))
' g3 w6 B; S: V; q  a}" }' J& Q% W8 v8 t* F
// convert a hex digit into decimal
% r( l9 [( p. b4 I4 U; sfunction deHex(aDigit). p; f5 W% E9 f
{& u0 b3 q# u! y: ^6 [
    return("0123456789ABCDEF".indexOf(aDigit))
& I  P  i9 o% D- ^6 X, C, S}  v& B, a6 H9 P7 W0 c# L

" f% B/ Z' _9 k& x// Convert a 24bit number to hex- U" R( }9 _1 D' U
function toHex(n)* h+ `  F. `" Z5 t6 Z' l/ }
{' I" M; i2 t9 ?9 Y
    return (enHex((0xf00000 & n) >> 20) +' G, D0 I5 J& p/ o
            enHex((0x0f0000 & n) >> 16) +
, @! ]3 ?+ D& S1 Y2 }. X8 U            enHex((0x00f000 & n) >> 12) +
8 T9 m# D  |0 S            enHex((0x000f00 & n) >>  8) +
; \/ J4 y) }3 N5 m) K; ~            enHex((0x0000f0 & n) >>  4) +
6 u9 J. b- y- j7 a            enHex((0x00000f & n) >>  0))
) Q0 ~' ?* X7 Q9 B( c}1 Q* q& C" q( a3 ^2 V( [, l. \( n% l
// Convert a six character hex to decimal" B1 M2 `0 b4 Q* |  [& E! H
function toDecimal(hexNum)9 m1 l3 F6 E0 Q4 P0 a& u
{' V" M7 I8 d* P/ M4 ^. }
           var tmp = ""+hexNum.toUpperCase()
4 `" P1 i! u; U$ i    while (tmp.length < 6) tmp = "0"+tmp
+ Q; n+ z( K  @$ t. B* \' p1 u! O           return ((deHex(tmp.substring(0,1)) << 20) +
9 Q& `  Z) h! d4 |& p, p                   (deHex(tmp.substring(1,2)) << 16) +
, C3 ]7 e2 L( y' x/ {/ H            (deHex(tmp.substring(2,3)) << 12) +
5 T* A, C) ^0 D7 h1 A4 N2 O- ?            (deHex(tmp.substring(3,4)) << 8) +9 ~( n( C! `! Z* l0 F& S4 m
            (deHex(tmp.substring(4,5)) << 4) ++ N8 v4 w# T- N, A, E
                   (deHex(tmp.substring(5,6)))); v; ?4 O( A2 ?6 z& b" U. G
}0 y2 M% |; M0 C7 z& v. Q5 @
///////////////////Shimmering Links/////////////////////1 R2 H# M+ C$ j8 {' V- K
//global variables
7 ~( O2 T! `: T0 V/ Svar hoverColour
& v' L' {# h( }. _7 I4 O6 fvar numLinks;. ?) g6 G# c$ S4 u# j
var rate;
0 y% {$ y" Y% N5 o# v; yvar numFadeLevels;
0 t9 O5 f" _2 x5 c- @var bgR;
6 w/ R% Y% }, U$ C) [$ Xvar bgG;
4 A2 N1 y5 b! c4 K6 ]. j. zvar bgB;
1 ~! G: F4 ]4 G; svar currR;" b8 u* g% d& q  `; a  w% J
var currG;
! C7 m9 A: a1 @/ f! Cvar currB;( z: c: Q# w  o" D
var count;. _& G; h: u9 ^
var fadeOut;' E, r' f; }& g& v
var continuous;
# ^* ^, i* w4 E$ xvar newColour;
3 E5 J6 Y) V" {, D: g" ^var tID;3 S3 {" b% \' h# V
var redInterval;+ b- M8 U; C" L# W1 O
var greenInterval;& c' h& h& c; \( ?; Q* B
var blueInterval;1 H1 B( h7 f8 u1 D$ Y
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
1 p" ~5 P  t! N6 F  u{6 O9 N" h5 t) @# _. l5 E5 X
        hoverColour = mouseOverColour;
9 @/ h- G) F& D9 n        numLinks = numberOfLinks;
7 ~. h) b- R- T        rate = 1;2 ]7 d4 j$ X5 g& o) a
        numFadeLevels = 30;$ K' E; ]" ?8 {' c/ v- S
        function initArray(theArray, length, val)7 i2 f6 B3 M5 J1 U1 [# v/ o
        {
  j" Z! D! E* i5 f# d3 g) J1 L                for(i=0;i<length;i++)
/ i# n3 j8 b0 |+ g) @0 j                {! B# d0 C  i7 x/ E8 m
                        theArray = val;
8 l, }2 U1 l  Z9 U                }
# |4 }% z4 W, [  N" v: H        }# a1 r# j0 i9 }9 t
        bgR = '0000' + fadeOutColour.substring(1,3)2 Y3 A3 m, P$ L( P4 T2 Q9 H
        bgG = '0000' + fadeOutColour.substring(3,5)+ f. I# o" E& }8 ?6 d0 U, ^+ t" U
        bgB = '0000' + fadeOutColour.substring(5,7): U- z; f8 v0 y* x
        currR = new Array(numLinks);
, ~2 J: C7 i- O1 [4 ]0 d        currG = new Array(numLinks);. l6 e9 w/ J& \: W2 C
        currB = new Array(numLinks);
9 b; k  s% G4 o" X        count = new Array(numLinks);
1 x  r- g* M2 ?9 r        fadeOut = new Array(numLinks);
& R0 W# H/ z* h9 v  B        continuous = new Array(numLinks);
9 W0 u! G  Q. x( ?        newColour = new Array(numLinks);
* T  \( c# R+ p6 a+ k        tID = new Array(numLinks);- [8 \3 d8 a4 A7 N
        redInterval = toDecimal(bgR) / numFadeLevels;
% _+ u  D! I4 g, k  @0 K3 \" M        greenInterval = toDecimal(bgG) / numFadeLevels;
- P5 v9 @& t. N3 S        blueInterval = toDecimal(bgB) / numFadeLevels;( C& }; n$ q  d* z, n
        initArray(currR,numLinks,0);
- J4 K" V$ Y: I- Y9 F: n        initArray(currG,numLinks,0);' @& z! k6 g3 p8 }7 t5 {
        initArray(currB,numLinks,0);( d1 X/ c4 ^% J& p0 I
        initArray(count,numLinks,0);
2 f7 a: n  n+ ~0 x        initArray(fadeOut,numLinks,true);1 |% W4 y# D! Z9 A& v
        initArray(continuous,numLinks,true);
+ X+ e( M* s$ {& S, X4 V, _1 H}       
( l* S8 c7 {' y" S- i) m% Qfunction startFade(id)
: c& O% ^1 O3 T' c; F{
0 w9 _. q1 S. P: }. P7 {        if(fadeOut[id] == true)& U: g& Y/ k5 E$ ~* |/ ~( j+ J9 M3 T
        { /*move colour towards background colour (increment)*/1 ~5 g2 t; x. O) _3 R) u8 X/ n
                currR[id] += redInterval;7 V: R& Q* i) N6 b& Q- Z
                currG[id] += greenInterval;
6 b( M& o) J3 _+ x                currB[id] += blueInterval;2 S; A+ x1 h+ M3 P. I5 f
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);1 V. g5 I% Q4 Q8 y. F9 v
                if(++count[id] == numFadeLevels)
% x+ \6 O' v7 e# ?/ F0 B# x8 N                {, L4 F8 n$ G) V" a4 G6 W5 v" v
                        fadeOut[id] = false;
1 d2 Y8 v  I7 L+ j                }) m  p1 ]3 ^8 @. N/ e6 k) z6 J
        }$ l( n) N- W, B, w5 ]  v( ~8 u( X" \7 E
        else
8 X7 e* A; o7 T4 D. G        {
0 [2 H8 Y+ F" v) q9 \$ ~                currR[id] -= redInterval;
- Q* v$ J. a+ q, o4 `1 |/ M, k
9 U* W' E/ E" |! M" M% W                currG[id] -= greenInterval;" j; n& ]: g2 @! f# _
1 |; r4 R6 X) }# k* `$ T- P
                currB[id] -= blueInterval;
+ i; C0 }1 ?9 \" Q0 x  }" F
( f( P, Z1 o# k) M8 e                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);- x- e+ M  o* m! K" ^
# U+ |# b9 y  ?# K( v" C
                if(--count[id] == 0)
( }3 O: ^' {/ k* {1 j/ i: T: Z9 x/ t* L+ \! I0 r% g
                {
7 Y5 q( P; x# N6 D
! h6 V; [3 |# _+ f5 h: y                        fadeOut[id] = true;
( d( H. w8 K- e, w* Q6 T* q3 C  {" ^" S
                }8 Q4 e3 i9 T6 v+ q, D3 K' _  }
* u5 U$ Q& r, t. t' N9 v
        }
2 K! H7 p2 s6 n5 E# e. F: O4 o+ w, @$ y% z7 ~  K2 Z1 v
        if(continuous[id] == true)
3 v' e$ g2 s5 Z: c" ^+ [6 S! k% r/ l3 b  m. f# E# F
        {
" u: w- n' o' a2 x( h2 d+ D2 k# J# _2 N
                document.getElementById(id).style.color = newColour[id];               
7 T2 _  g; ^/ M) Z) o  G
- m( J% ^% W* g' n) X  k        }
! L& }+ g( W; h, X
* J- s+ w/ O1 l* F; V- s# |' M& t        else
2 T" O3 W2 T- |; ]1 O: H7 _
$ `1 @# Z" Y. b% r        {
! [% q+ X+ y" d. I9 N/ G, k
5 Q, b  L" Q8 V8 e& o3 v                document.getElementById(id).style.color = hoverColour;
4 G3 c; Y  ]3 Y  G& {2 `" X8 M& |8 |& C
        }
9 c4 J: {& Q  O# G5 k! C
; {' G, k8 H* ~3 Y) a        clearTimeout(tID[id]);  ~; G( V2 H7 N" Z" @# z
4 Z- S. m% O: A) n6 `& `" K- B! i: z
        tID[id]=setTimeout('startFade(' + id + ')', rate);
# t) G" o' c# b5 Z
9 [4 b5 g8 K2 g9 [}
' e" F/ b* X: [  y; b) ]* p. B# u* b
function continueFade(id)3 K* ]  q! y9 j, Z& |% G
6 z5 x  L0 `! _2 D6 R
{! q5 k1 U$ F( q1 _6 I

0 S3 b; `3 P# Z' A& l& {; O        continuous[id] = true;0 h4 i, t9 N. U  `: @- x
# s8 u6 |# d; A" b; c$ J
}4 h4 o2 j. |% Y
% k0 t  M( p. J& ?/ X. M1 m1 k( x
function stopFade(id)# B- x2 Y* ~# v# t+ E4 S3 J
  s8 |7 Y: a  D' f0 ]. u
{
( \. ?( K' k; e4 ?/ ?) y, j( Z7 @) b# D. h; c+ M$ @  K2 H
        continuous[id] = false;6 {) N" s5 m0 _$ y& j

7 ^# w8 e; J2 [! X8 F' {}$ Y7 i! r; W8 ?7 L" X' F

) b# i0 i% y3 L+ wfunction StartTimers()- |: Q/ x" Y- B2 n; T. N6 T7 I! i

8 B6 f8 I& u7 a) J- ?{        //set up an initial set of timers to start the shimmering effect3 c, l) t' Q+ y& R2 w% E

/ f1 N3 L0 a6 Y7 `4 d! j' `- I        for(id=0; id<numLinks; id++)& N& T7 b4 S4 g: l0 ^0 ]
, y3 k! ]) g# M% E7 M. @
        {
& _( I7 z6 v1 M; P, t( y0 e1 L! `7 b' P! x$ }
                t=setTimeout('startFade(' + id + ')', id*100);
  _0 ~1 E  [+ Z2 P+ o$ W+ L7 T1 }7 j: b9 J; g  S
        }/ O5 l: m- t; M
% b$ O0 i" ^$ B; @+ \2 q" a) o) F
}
) L: I( u' [0 `* {. ^( y" ?  _5 [8 F) D7 R! i
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')- P9 Y# J1 I7 @" N4 O
, \. S1 P- j8 u" Y3 N1 h
initLinks('#FF0000', 6, '#FFCC77');* h# J4 o7 b4 i) h' T: p2 s3 w

: ^. [! }# z, r+ B# g& y//-->: T6 |. q% w3 G, O

- v; H  I1 g: B0 e1 e2 J</script>
$ I' r, c1 B) a<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名:58元! Z% Y' ~' N/ Z
</a>
0 \. E+ d; }' G' e2 |5 [<br>1 r3 K- |5 ~7 g
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名:110元</a>
7 x8 h4 c& A% c# P<br>
# A2 P- e+ `' B<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>1 _. B0 M" F! Y& ~0 X! {6 g
<br>       
) q4 k- \+ a- N, v  L<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
  A9 b4 @* t+ K3 \( R9 @3 W<br>
/ ^6 Q% d8 N9 Z5 V<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>  ~( o1 }0 m7 t4 V/ \  L
<br>
9 f; R3 C  b+ G<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>
2 z4 l8 Y/ ]0 i9 c3 f<script language="javascript" type="text/javascript">$ A; e: j- A  Z5 N) ]. Z
<!--
+ P2 {. s) ^% x& W$ l7 HsetTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
  X$ V& q+ h" ?* u$ B//-->
* c" J8 j- R4 y$ R! r</script>

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