返回列表 发帖

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

<script language="javascript" type="text/javascript">
* X7 Z8 N, |) {* i: l<!--' m- J; t8 V7 c( H' F( {
// convert a single digit (0 - 16) into hex
4 Q/ U$ m% R! T4 a3 w2 Rfunction enHex(aDigit)
! ]) m+ n2 x/ B5 V7 `{
* {0 o( ?! ?! l7 o7 T) v4 \9 }    return("0123456789ABCDEF".substring(aDigit, aDigit+1))
2 z  E- H1 c* x5 V, ]}" b% `( ?  i- O0 w. p9 s9 k* j: ^3 B
// convert a hex digit into decimal
" W% p( g$ T1 Kfunction deHex(aDigit)3 \- I( |. \& b4 M
{; \+ M/ y" Q( H$ |! \: S
    return("0123456789ABCDEF".indexOf(aDigit))  F# E: z$ Y! R( y( m
}# m& ?: \4 E8 F: q
3 e( t6 J. E3 Q! x
// Convert a 24bit number to hex
6 q- L& u4 b" z7 X* W3 }; `4 Qfunction toHex(n)  X; @, ?8 ~/ g
{; ?% D; d7 D! @
    return (enHex((0xf00000 & n) >> 20) +) f* k5 Q: r# z5 `& @$ E& D
            enHex((0x0f0000 & n) >> 16) +* f& `, W6 P% |* j' \
            enHex((0x00f000 & n) >> 12) +% W- ]# {+ b) f$ {. D' c' W
            enHex((0x000f00 & n) >>  8) +2 [- X! n6 w5 y. L- s
            enHex((0x0000f0 & n) >>  4) +
0 B/ n6 f4 B2 M' h            enHex((0x00000f & n) >>  0))
+ [. ^7 B( m4 R3 z1 T}6 \+ s9 B( b6 ^) o, b! Q
// Convert a six character hex to decimal
1 m- E2 B4 t- p$ Z- gfunction toDecimal(hexNum)
+ e& g; e% D4 k5 Z( y{
: g' X" e  |" z: _, v2 J% a0 s           var tmp = ""+hexNum.toUpperCase()
: Z0 |4 ~* P/ {4 f- R& D/ c    while (tmp.length < 6) tmp = "0"+tmp" H7 L, o4 T2 q' |5 r6 _
           return ((deHex(tmp.substring(0,1)) << 20) +
7 L, v9 j8 l, ?; f                   (deHex(tmp.substring(1,2)) << 16) +
- c) L  ~4 M& H            (deHex(tmp.substring(2,3)) << 12) ++ k) }" z3 G/ J) _* G
            (deHex(tmp.substring(3,4)) << 8) +
" ?- E$ d+ V" v            (deHex(tmp.substring(4,5)) << 4) +/ X+ _4 r) @7 g) P7 l( G! W
                   (deHex(tmp.substring(5,6))))
* g# J( k+ R5 y6 U  i; N8 x5 ]0 S}! t1 N2 D+ J" e$ K
///////////////////Shimmering Links/////////////////////
: ?: z, A+ Z1 |+ P% D//global variables. G: A$ x0 m* D1 {. ^4 w3 X2 |0 k
var hoverColour
+ O2 O$ E3 T' |# H: V' Avar numLinks;
& j- X, U' _, fvar rate;
' z& Q& {) N& R3 X% j' h! ]0 S3 Vvar numFadeLevels;
$ q" m, d; {; y. R7 Yvar bgR;( n' j8 p2 J: y! j$ [; w2 A4 a  l; b% d
var bgG;' s" ?  w- Z: i! {) [: t+ C9 J* P
var bgB;
: k7 Y4 X" m- Z3 L7 ovar currR;
7 k  P0 h& m* ^! k7 j4 w+ qvar currG;
  T% ~: f9 z( J9 Zvar currB;* K! o% t( D5 f& \% |3 [  ?
var count;) w8 u4 u; S0 C! m$ h4 t
var fadeOut;5 y6 N8 ]$ x1 d& J
var continuous;5 b' @+ K( H# A; h
var newColour;7 B; }/ }/ v: Z* Y7 v0 x8 B/ @" i
var tID;) z8 v' F, e! @3 h+ o
var redInterval;
, G1 a$ u/ x9 U% f* P2 v& B8 avar greenInterval;
4 h4 |& K2 _+ u; m% ]& D" Ivar blueInterval;
' i! e9 G% z7 B4 Q3 ?- E/ jfunction initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
: y# P* _& s* S9 {2 n{
5 p; C! l1 Z' r0 H        hoverColour = mouseOverColour;. L; J2 o! S- T. M
        numLinks = numberOfLinks;
! [8 G5 S0 m* _        rate = 1;5 h/ S5 W' q/ U7 j3 h+ i
        numFadeLevels = 30;8 p; I, p' N! i
        function initArray(theArray, length, val)
5 r5 P/ \8 [9 O6 x  G        {
+ d2 T2 I7 _& g& D* b$ E8 u: G                for(i=0;i<length;i++)
, x$ L' t( ?3 n5 J& i' _                {
* h+ g8 q3 }0 t! H                        theArray = val;4 `4 z& q1 q9 b) i
                }
' A8 n0 ]0 U2 `+ A& ~9 r! o        }
- c9 s( K! z, c8 n1 {) Y        bgR = '0000' + fadeOutColour.substring(1,3)
6 n7 N$ H. ?# G3 W: i1 ^6 `( W+ ]+ i        bgG = '0000' + fadeOutColour.substring(3,5)
* r1 O+ h8 ?0 h& A( ~3 g        bgB = '0000' + fadeOutColour.substring(5,7)# D+ \0 U/ J. @5 w
        currR = new Array(numLinks);" W3 d  C3 ^% ^7 O
        currG = new Array(numLinks);
" j5 A  B6 l8 s( K8 [, X        currB = new Array(numLinks);( J- }: n+ A6 n/ o" }
        count = new Array(numLinks);1 [# `0 \0 W' W
        fadeOut = new Array(numLinks);
) y6 ~9 X' h  {: B3 y, ^; s        continuous = new Array(numLinks);
* O5 I; G$ y' a0 v6 u% K        newColour = new Array(numLinks);7 ~7 r0 J& O0 a: Z8 Q2 y( @: T
        tID = new Array(numLinks);4 L- O1 x: t- M  {
        redInterval = toDecimal(bgR) / numFadeLevels;
9 D( K/ h+ X( |" I: ^        greenInterval = toDecimal(bgG) / numFadeLevels;
2 q# S6 I6 ?* a) {. _        blueInterval = toDecimal(bgB) / numFadeLevels;# s* B0 E0 \& ?8 V" w3 L
        initArray(currR,numLinks,0);. H/ |# O# [  x/ H* E
        initArray(currG,numLinks,0);
. B  K' K" t/ y        initArray(currB,numLinks,0);% y+ }3 y, ?( c
        initArray(count,numLinks,0);( b, s- O3 R0 K/ I9 Y" [: \" W
        initArray(fadeOut,numLinks,true);! q; _( Z( E5 h: o& O, g8 l( S
        initArray(continuous,numLinks,true);/ F- H8 L  _: |. q7 A' A
}          o/ x+ V: V; G% W0 a) O; @% }
function startFade(id)) A/ h3 D5 e; ~0 ?( c3 X
{
% c* I7 T6 D% R; c9 A, @* Z        if(fadeOut[id] == true)- `' i% Z, V' t8 U4 U; |5 C- m
        { /*move colour towards background colour (increment)*/" ?& H% e" n: D$ l: ^/ \
                currR[id] += redInterval;, A$ K  q: Z3 y8 E! R2 ^' X6 s
                currG[id] += greenInterval;
; L8 V, l$ [7 M; I  k                currB[id] += blueInterval;
* P; D4 N$ B$ Z7 q) S  W7 t                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
' _1 E7 z0 B8 B7 |6 H3 M+ ^' I                if(++count[id] == numFadeLevels)
0 W( R% L& C2 A$ I1 h5 @& f  r                {
! j/ ~9 l1 j/ o0 |7 O  Y                        fadeOut[id] = false;
1 e! r; ~7 k2 C5 R7 e- e4 Y. ~                }
' Q, H* j2 ]$ P& \4 Y& y        }( j- A$ I) j9 [1 h! C+ S. r
        else+ s* z+ T! ~* v5 h( Z
        {7 u% A$ f$ U/ f5 a6 G( f
                currR[id] -= redInterval;
5 B/ R2 [9 [$ K) S: t9 h- `7 w/ b$ t; v
                currG[id] -= greenInterval;
" p/ h1 Z& c; M! L: Z4 Y( U5 s& g; P1 R, S# t# v
                currB[id] -= blueInterval;( H% Q6 h" X8 `" N, A  G
: R# c* E, A* |2 v
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);: O. K. w9 Y+ ~  |8 B& k
$ u$ f0 h4 z1 j
                if(--count[id] == 0). f+ q9 h! `) Z+ Y9 o9 b: j
; g8 w" y- B' {2 Y7 A* _5 r
                {
) Y2 c8 a5 u$ U, T- L- j
1 t3 L! V7 _' k6 o                        fadeOut[id] = true;
* ^3 E" d8 B4 ~# H# ~! c0 i9 B  @9 ?9 C! T: p% G9 o) O) t8 o. F, c/ B/ _
                }
- l. n: a" b* C' U+ P9 U. G& }, ?
) h5 X5 w, L1 a" z) J1 P. K        }$ f+ P+ s6 H5 Z6 F

! F% U- {, @# P) h        if(continuous[id] == true)5 b$ h( l5 H! M: [& a+ a. i! D5 n

* X, w, Y9 J: }/ R4 D        {
5 J% V, n, e: @* w: ~! R8 B2 y5 c& }; _' q! k  d
                document.getElementById(id).style.color = newColour[id];               
7 T% C8 K$ A; W- P6 T# t* i( y' X+ m- t6 k( i3 o, S5 c% l
        }2 z9 J  C1 f0 I8 Y+ C( y; {

& l) ]. z3 t6 Y: F7 n        else' f8 J6 }. ~/ g5 ]6 D& x/ E
7 d" A" v- N6 ~4 U4 J) I& x- b
        {
& b/ [8 I' \0 Q3 c5 E; A; t) L1 o* g6 o& V% O
                document.getElementById(id).style.color = hoverColour;
( J4 J5 u2 j4 g) p: a" d8 ?# @- X9 B) w% Y$ T" e
        }
! F# Z4 N5 }9 v" ^% P9 M- B  O6 G9 ]0 L
        clearTimeout(tID[id]);; D& {! B1 p  {0 o% p& H1 v+ B

& V& _7 N* ~( v" D& }9 y& X% m0 D        tID[id]=setTimeout('startFade(' + id + ')', rate);/ `; w/ ~1 u# |0 ]
2 Y' |' P( _9 H9 U
}
" W! Q5 k. [  f
8 Z/ Y8 x7 }$ `9 h0 dfunction continueFade(id)
/ [2 Z, t; z7 V0 \3 s2 `  Z5 V) o2 W4 j# w* Y
{
! \) }5 c7 [2 h5 i& n! }+ R) r8 T
# t# ?+ ?( S' Z1 L- H. J6 |) _        continuous[id] = true;
. s! q( \0 _  N8 r4 S  d+ u  M6 M0 Y! A
}2 k& p1 V# [* V( o9 V
/ v6 i0 L0 Q( @3 E7 m
function stopFade(id)
. V) p, X" w+ v' J5 x+ E: Q4 l0 @' u
{+ ~( s2 }) E( ]% f
1 x, j# x, b: K& e
        continuous[id] = false;
2 N! }; O* G! z. t3 I
& \9 E% Y% M# }, X8 D; F}
7 n$ Z$ J7 L' [9 C+ M: C7 K$ ^) l( I0 \/ Y% F$ i9 N, D9 Q8 Z
function StartTimers()6 |1 @! P2 A" H2 f3 G' j

4 D5 h; B. {- E2 h* z4 y7 H" j{        //set up an initial set of timers to start the shimmering effect' O1 P6 G; |9 [; m) |

! D( t& |# z' \        for(id=0; id<numLinks; id++)3 G6 h# p6 R; m
6 ?0 c- a# b5 a+ n3 W
        {5 q. ~: B& }+ i7 {/ ]" L

+ P' f7 q/ i( E# H                t=setTimeout('startFade(' + id + ')', id*100);
3 l, T+ j% w1 t, y  h, b( a3 S7 D( N
        }
% o, R" g2 W; r* C/ ~: ^3 U
' w2 I" V/ F9 t% z7 Z1 x; ^}: y6 T" o8 j" Y4 g: k1 E
8 U+ I0 i% ~- j2 D! E" u
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')9 K; l" u2 O6 Z
  C. P5 A4 w" l& Q
initLinks('#FF0000', 6, '#FFCC77');
, ?# s& c  Q  G/ \& E9 B$ ?+ Z5 c! {( ]" Y5 ~7 y8 u: G) h2 J  h5 T* D
//-->
7 t3 T1 i* x  y1 m2 t9 q
. m9 A. {+ I" Z2 m$ M</script>3 F. Q, l- M9 O3 w% e
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名:58元
$ g0 Z9 x2 ?  Q3 O1 Y</a>
9 x4 q7 ^8 b: Y% G! a7 R2 M<br>
4 ^1 A5 A1 \1 s6 l8 a* a<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名:110元</a>
* D8 _' C* E0 m* }, |% E<br>4 l: h" F0 X' d# a' U. X4 x  V
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
$ w  f: W* o& V- i: K9 `7 t/ k4 a<br>       
" T6 T6 f, @" Q3 a, W! M4 p<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
% I  `! j! i0 h  ~. B, R<br>
3 P3 b" X9 a# P6 O- I) ]<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>% |; n0 f( p: b7 h* R( B
<br>
1 M- i; q& Z2 `6 C& k9 p1 I. e7 s<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>
% }( |1 U, h3 x- q<script language="javascript" type="text/javascript">
7 v2 R' K* I7 g0 I1 w  ]<!--
; `+ x2 A' g% ]setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering) h8 R/ L6 J  B, f! p1 \
//-->5 U! @& r/ p- ~0 _$ c+ q9 s( @
</script>

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