获得本站免费赞助空间请点这里
返回列表 发帖

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

<script language="javascript" type="text/javascript">
1 w4 D* I. q. Q8 g+ g<!--) Q, K. Y3 E2 j* G2 w2 M
// convert a single digit (0 - 16) into hex
9 V7 L( T2 K; n/ o0 g! n5 s; Y1 U" Tfunction enHex(aDigit)
' `7 C# F; y1 `! ?6 L2 C: k* u. I5 p{' B) B7 p( n3 J% o/ g3 w
    return("0123456789ABCDEF".substring(aDigit, aDigit+1))
# N! S% H6 u3 o3 e" d}
) k4 t- W; K& s. w% @% Q0 J// convert a hex digit into decimal* D# J) X9 I+ B$ c
function deHex(aDigit)
5 M. p4 g( U$ D( O4 y{
1 S6 O' x- @, ]    return("0123456789ABCDEF".indexOf(aDigit))
, @4 a) g: l% |. P* m}7 ^, i; H' b7 S, r2 t
- j3 ~. Y4 ]5 W/ ~
// Convert a 24bit number to hex
% j  s8 D4 T* P6 \  N0 s) I& Jfunction toHex(n)
6 y, r8 d1 ^2 l! X{
. H5 u7 P( v1 b8 N4 X5 A* B' n    return (enHex((0xf00000 & n) >> 20) +
  J2 _, w1 i) S; Z. Q+ h& \4 f            enHex((0x0f0000 & n) >> 16) +
. A9 D" I$ c" f! m+ ]0 \& Q            enHex((0x00f000 & n) >> 12) +
: O. S: }+ \+ l9 r            enHex((0x000f00 & n) >>  8) +
/ \" z% M' `, D8 R6 H            enHex((0x0000f0 & n) >>  4) +) B5 R4 t4 `; k& ~3 z+ b
            enHex((0x00000f & n) >>  0))
, A/ i2 F3 `* R/ l}
, X# q4 T7 `; ^// Convert a six character hex to decimal/ f* w* A3 g% r  g: k9 c
function toDecimal(hexNum)
& O2 P" l2 y5 B" Y. V0 S- v{# L* e! E% u0 h  m! M. t
           var tmp = ""+hexNum.toUpperCase()
2 f* l* F7 Q+ b; n9 i    while (tmp.length < 6) tmp = "0"+tmp
2 x+ n  r; V3 ?: j           return ((deHex(tmp.substring(0,1)) << 20) +
$ {! s, d& z" d5 I. L                   (deHex(tmp.substring(1,2)) << 16) + 0 e6 C: f. K( C+ x+ n* I
            (deHex(tmp.substring(2,3)) << 12) +
4 V5 x6 h6 U, N9 V            (deHex(tmp.substring(3,4)) << 8) ++ g* ~- c4 _& l3 E" z( H/ R9 {
            (deHex(tmp.substring(4,5)) << 4) +
% P! v, K6 {5 X                   (deHex(tmp.substring(5,6))))
, s; d8 q: p+ m" u2 ~4 O}
- r1 [# q0 Q& X" O///////////////////Shimmering Links/////////////////////. q! f4 W+ J. \
//global variables
8 f5 V, u7 {/ [  b& Mvar hoverColour) l% W& h, t. H. K0 S1 `
var numLinks;  u# s5 e, l+ h( U1 J
var rate;- N/ d& H! ?6 z) \( Z, o  @5 I
var numFadeLevels;
$ y, d1 q6 B' @) Q+ Ovar bgR;) W9 E. G! X! J4 J9 G
var bgG;2 i6 J- Z2 D. l# v) S
var bgB;7 O- K1 \6 i5 J
var currR;
4 n9 \7 @/ C# E9 k& ~+ E! S0 A  Bvar currG;
& {+ N: B; W: I/ X2 l. L) R5 rvar currB;: S- ]8 h& ^+ E6 ]4 T5 z# q( G
var count;5 c! d9 d+ D1 S( n
var fadeOut;
& T) j  H6 I! lvar continuous;& b1 C3 o& r2 R0 e6 I
var newColour;- [2 }9 f( {# W' w% A! ^- Q
var tID;+ O  P5 }! Y- M' j# W4 [
var redInterval;
6 P$ Y  Q4 v/ \, t5 ^  ?$ `var greenInterval;* j! _( T* z' @" G4 o
var blueInterval;
% @' D, G) T6 V4 `, Zfunction initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
, y0 K+ \" a' u5 _{7 \$ A, ~9 Z2 \
        hoverColour = mouseOverColour;
4 V9 v5 ^) ]/ {4 N) `        numLinks = numberOfLinks;( O- S: J  M) F* u, r* c. i
        rate = 1;7 v* u7 c5 K; I: r
        numFadeLevels = 30;* l2 C) j" O+ x
        function initArray(theArray, length, val)( A' ?& L  ]9 k  X* Q
        {9 W& c4 X; x+ [) ]
                for(i=0;i<length;i++)
+ ?/ g0 m" m& N' S2 {) L' i                {
& o3 J! S, u5 Z  s                        theArray = val;# W% A8 ]0 S2 I% I
                }1 d+ _2 l" |8 T
        }* _* t7 ~0 E, N2 q( x4 B
        bgR = '0000' + fadeOutColour.substring(1,3)
% y, Q8 \8 g* |6 J/ m8 B1 Q6 e3 K        bgG = '0000' + fadeOutColour.substring(3,5)
- D' t& D; x. K: q! q        bgB = '0000' + fadeOutColour.substring(5,7)" `7 a$ w7 W7 `' R1 e4 q2 v* P
        currR = new Array(numLinks);
6 c& O0 B9 ^2 i8 m, r' }5 B/ A        currG = new Array(numLinks);
5 ^- Y$ F2 G% D6 o' d& ^1 x% \6 }        currB = new Array(numLinks);
( C7 d# P$ t6 d/ K. t8 E" W, q        count = new Array(numLinks);. S3 I, l1 L* ^& K7 g3 C/ n: Z8 d
        fadeOut = new Array(numLinks);8 m$ x7 |7 V# V2 [& H# H8 y/ s+ ]
        continuous = new Array(numLinks);+ y2 u1 |* G) e" h! ^
        newColour = new Array(numLinks);0 N& Y; n, f0 Q9 V8 u
        tID = new Array(numLinks);
) L. [; k% }( f) z' D        redInterval = toDecimal(bgR) / numFadeLevels;
3 [  N) O# h6 @0 r$ d  ^        greenInterval = toDecimal(bgG) / numFadeLevels;; b# }! U3 k8 j# T# a
        blueInterval = toDecimal(bgB) / numFadeLevels;
; L+ U8 d5 [- V! |; Q% J/ f9 Z8 S        initArray(currR,numLinks,0);
6 |8 m9 _) U# L2 ?# [$ ^        initArray(currG,numLinks,0);* {/ r& X/ a; P4 o# {: b; @
        initArray(currB,numLinks,0);5 a; q7 g! J7 _  E! X$ u  l. D7 M
        initArray(count,numLinks,0);
* j5 v6 ^& Y9 k# _4 H8 P        initArray(fadeOut,numLinks,true);
  E4 x  {8 v& Y5 b# l; Z        initArray(continuous,numLinks,true);8 C' e. _/ g" a7 _+ S/ D9 q8 v
}       
4 }2 @8 a8 `% `" q& Cfunction startFade(id); W# M' \+ G0 c7 r3 K
{, g, V8 z2 _* r* l2 X9 P3 M- _3 O
        if(fadeOut[id] == true)# f, f9 p7 y% f7 R+ I7 E/ ]
        { /*move colour towards background colour (increment)*/
; \9 l9 B9 Y; B& _7 m! T, _& b7 [) s" j. b                currR[id] += redInterval;8 E6 q. V; M: h! s! Y5 ^6 Q3 U* ~
                currG[id] += greenInterval;$ |4 J4 b) G% I; D, m
                currB[id] += blueInterval;' w9 N* ~2 o0 Q+ V8 k& I' b! b! A4 Q
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
" _3 |2 e4 Y! L. ]4 |1 o! B                if(++count[id] == numFadeLevels)& j; ]/ a& D* }" o
                {
4 {9 ], V% m& t2 X                        fadeOut[id] = false;3 V: w! x% H, ?4 U& I
                }
- I4 `2 U2 W& Q7 A        }: ?5 R: _5 y, V5 L2 t/ x
        else
, @0 v/ W( a. N5 M- A: o        {
/ d- T1 B% @, J                currR[id] -= redInterval;
" v3 V* {. f0 n5 U  K. E7 v; o. u- l
                currG[id] -= greenInterval;
% y. l+ p/ J- l! v8 I, F3 C: s- L' J0 ~# f: }" z( @+ T
                currB[id] -= blueInterval;& p& L- _1 Y7 V$ _6 U
" v- u1 P4 L  ?: ]
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
0 \, X' }. _$ K2 W- ?1 d; _. a: |# J
                if(--count[id] == 0): c) P7 G! K+ \" p4 k8 C( ^

! R' b9 H$ F; w) q( i% @                {% ^+ h2 u; p1 Y, d; i: z' x

1 p: B' P7 @& O' {                        fadeOut[id] = true;
5 l/ }. |, l7 c, D: n8 L, M! s6 L7 I) F% k/ w# ?
                }# [2 Q. k# e" e) W
& g3 V: L1 s# |" O/ _/ ^, t: _  b$ s
        }
) e, i1 ~( S) q1 G6 k" }1 l9 Y
8 b+ k& W- t! A/ M' W3 z, |7 C        if(continuous[id] == true)
& J9 {( I# z  n# H$ w, N- W9 h; T
$ N% T( u" V$ @: z# l        {' [  u. I3 _. T* m/ O/ S8 U
; i) f( X3 B- P
                document.getElementById(id).style.color = newColour[id];               
( p9 s, c7 K+ G
& M6 E) m1 l5 I% T6 R- I1 I! W        }
2 a% Z, R" J. I) x
7 ~# g$ o4 h4 ?5 i        else
3 o& V( P( N9 X' ?( k  B3 U! P( G5 v' i, `" n/ A& ?
        {6 _; Y! @$ W% f8 t0 G

7 Y+ K! b  a5 A3 m1 n                document.getElementById(id).style.color = hoverColour;
; x0 H0 b: Q' h
2 R0 P0 `7 b3 f2 l1 A  N+ l        }" w6 `  O+ n2 J9 L3 X/ X
8 f) `# I# a7 F0 F" v
        clearTimeout(tID[id]);
9 ~* M9 v( f* i8 q8 |+ o$ |. f4 H9 N" _: r2 A: r/ o, R
        tID[id]=setTimeout('startFade(' + id + ')', rate);3 z& ?& m# d$ B& B
6 p* m% _9 o% k
}
' P, x9 Z' W' b, U% D; F- n9 O  x& v1 a* D" d
function continueFade(id)
( Y9 n8 }  p8 s; P6 U6 T/ n0 Q* H, E  z( F9 y! y
{9 P7 p- H8 `4 G) \

5 R& e1 P. ]3 l; D; `4 I$ j; w        continuous[id] = true;
+ O$ |' {! w1 M' x6 B  X! M- I) o" J3 G
}. Q4 o6 t' H  `; n

( h6 o$ k: _- ?* n- A4 ~4 ~, xfunction stopFade(id)  N" n1 a% M) j4 L. B2 W; T) a
' s0 l3 B5 J% R: j3 \
{+ Y0 ?5 p( `0 W* }+ ?4 K. O
0 J" `( \, Y8 V3 W# [. p
        continuous[id] = false;' F% S1 P5 g% ~5 u# i  n9 V- E

8 `& L  s. r' e+ D5 q) L}& n, N" \6 i* s7 l) G+ ?4 f: {
' q/ ~" f/ X& D0 q; v
function StartTimers()( _. C, J8 ~1 L) @5 ?8 T
7 e4 e7 y. d' ~' H# z  V( o( r
{        //set up an initial set of timers to start the shimmering effect0 W3 }$ u; s4 v# s5 a7 B
; O$ }9 u9 I, d5 R* w
        for(id=0; id<numLinks; id++)
! z2 P& x# q, y- ^. [+ l' Q/ |9 O
$ G. y9 x. w9 r/ U4 `8 D        {
+ i3 T# C; X: I9 `6 E- G
5 b: k: @, {' h$ S4 [" W1 {$ m                t=setTimeout('startFade(' + id + ')', id*100);% r( \: ~( a9 O7 G- c

. o4 e# ~) l# _: x1 d7 \# W        }
. R# y2 f: r6 Q' ]% ?- F2 i
" O$ \; W6 g# J; i' z$ d: x}
, x7 r, q" n4 b, B9 O7 Q) u9 k, L4 W$ I# g# S/ b' I, `
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')3 z* ~; n; \* w% t

& x( [2 B1 W) G* @5 S0 OinitLinks('#FF0000', 6, '#FFCC77');
! m2 {, i0 I! ~
7 [3 k+ p( f: p2 N! O//-->
* a% l1 h. ?# F- Q0 I+ S' u/ F
! \" L; ]1 X: Y: O7 e* G</script>
+ r% a8 l+ p6 v4 d/ F7 D6 {$ g3 e<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名:58元
% o6 d2 L" b! Y3 l/ Q% Y3 a- P! k</a>
8 K* h  _3 i- J4 e/ S* p: R: j<br>
, M8 z' ~: ~5 v7 H<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名:110元</a>7 Y& N: T0 ]" Z% z, b
<br>2 m0 m- S& t+ B' N" s
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>9 E( g: o! T& ^: G) X
<br>       
; N: A; s; V1 t8 w# U3 p<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
& N! P. J! B/ y1 U0 x0 a6 d<br>
0 J0 e7 ^/ O, j) s) R<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a># G* G9 [; |! B( C  }* e" ]; x2 l8 G
<br>  e/ _' _; |( z- S8 Y
<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>
" c! r2 r2 y) M# r6 ^/ v<script language="javascript" type="text/javascript">1 O7 P% e3 u+ D  j7 d1 T! ]0 K  ~
<!--9 q5 ^5 M  P, u. J6 V/ ~3 Z7 ~* y
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
/ a6 t3 ^% l' d  s0 S//-->
, W. @0 q' [6 f5 u# j4 i</script>

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