返回列表 发帖

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

<script language="javascript" type="text/javascript">0 @1 e# Y& J) Q+ i6 i0 H/ C
<!--
/ W8 R& `0 M& g* H5 A& g& b* D) X// convert a single digit (0 - 16) into hex$ j6 e, T1 x( N8 [, x
function enHex(aDigit)
9 {" n9 L' ]& d" \# ~{
  q: q$ f8 h4 i7 P/ A6 H2 }  W# c    return("0123456789ABCDEF".substring(aDigit, aDigit+1)); E( b0 M5 K  {! U! z0 D
}
5 `; h  w* o& ~9 S& T// convert a hex digit into decimal
; z+ ?  D, |1 M5 _function deHex(aDigit)( h3 `/ U: `# n2 q9 n+ s2 b
{
5 f, A: ^# A; {! c    return("0123456789ABCDEF".indexOf(aDigit))
4 b: s. |. |: k+ R' l0 E0 k}
# N% N) O: s/ T. ^3 T
- \" O, J3 R0 T8 D// Convert a 24bit number to hex2 n7 q, I. [( o* a6 |
function toHex(n)
$ p4 \3 t4 _3 L, P! P{4 j( c" h9 O7 Y
    return (enHex((0xf00000 & n) >> 20) +, p" E+ U, S# y1 }4 [% ^5 k6 R6 |
            enHex((0x0f0000 & n) >> 16) +: P$ Q- [( g% ]& d, A
            enHex((0x00f000 & n) >> 12) +4 k  O& C& S( ~: B
            enHex((0x000f00 & n) >>  8) +
- E0 {3 b, v9 H5 `! x1 G            enHex((0x0000f0 & n) >>  4) +
; [- D+ a  X' C- b: m! I# T8 S- F            enHex((0x00000f & n) >>  0))
% C! U) W) G( d3 o' y9 W! }}
& A2 e8 j9 {6 Z6 X: z" n// Convert a six character hex to decimal
" b5 b0 P* s% N: L- rfunction toDecimal(hexNum)+ b0 w/ P! Z- V
{
7 H# ~' `9 y* D  U+ x2 b( `           var tmp = ""+hexNum.toUpperCase()
. g& O4 M+ C* I    while (tmp.length < 6) tmp = "0"+tmp: w* N6 o% l; H% r* J
           return ((deHex(tmp.substring(0,1)) << 20) +
9 S* L% B( z* k. ~4 n- Q                   (deHex(tmp.substring(1,2)) << 16) +
$ T+ v8 _& @$ s. X; A5 U4 G  f3 `            (deHex(tmp.substring(2,3)) << 12) +5 u8 n- h' P% u
            (deHex(tmp.substring(3,4)) << 8) +% s4 D3 {$ U$ `% B2 b
            (deHex(tmp.substring(4,5)) << 4) +
0 Z/ Q% N5 B; }4 J                   (deHex(tmp.substring(5,6))))
, I2 w" w$ ~' u# b1 m0 E) p}
% D& n& W6 M& n9 G; v/ U6 u* k3 q///////////////////Shimmering Links/////////////////////& {# E' l- n' |- `+ M* \; ^& J
//global variables
% o& ]3 E% Z1 m/ K0 i; a# zvar hoverColour6 C- Q* l5 h+ j5 J. |
var numLinks;
) V/ I% u* W( E% h% J. `var rate;7 n4 t. U1 l- H, k( A0 n+ H; L
var numFadeLevels;2 q6 T# \% }/ R3 u& ~$ g
var bgR;
. X* G# R9 a5 {; F/ _9 svar bgG;+ M  I4 \5 V& {' C# g* `4 L9 R
var bgB;  T0 Y7 |9 I+ G
var currR;' [* }) |) W8 m9 m
var currG;2 q4 B! m$ {. c/ f* B8 v
var currB;" A% R: F9 }1 z' q5 {! i+ C+ X2 D
var count;8 ~$ G  R* B5 l% a8 E2 C
var fadeOut;
' }. C4 S7 e7 C# x5 Svar continuous;, T- k% Y" x" u# d
var newColour;
* P% y: L) p0 e# {8 c1 y6 jvar tID;. C: _5 I' ?% h$ M% ~
var redInterval;
' b3 W5 ^, E( {; z/ S* Cvar greenInterval;
* m' b2 c" r6 evar blueInterval;
; t( f7 o  f( N. T& A4 N9 \function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
7 p3 G" ^; E) K{
2 x8 \2 e2 v8 b9 C% t# U        hoverColour = mouseOverColour;
  g3 x1 x3 t, h8 ?3 U        numLinks = numberOfLinks;* [. J2 h6 F: O) j4 b- S# E
        rate = 1;
3 o9 _2 F" m/ T: D        numFadeLevels = 30;  I  _) D3 c2 d( o; \
        function initArray(theArray, length, val)& m( \6 z$ F) S" ], G
        {: g4 ^" ^& I# g' j8 p6 m
                for(i=0;i<length;i++)" B/ X- m8 Q# M8 g+ N) ~
                {
- e/ G7 g- v! Y" L, I! E1 v$ Y0 M                        theArray = val;
6 `4 G3 m( N' F/ z! F- J                }
( l# r4 x& V" Q1 X# t( o3 h9 U; g        }( g( I0 i& [+ B: }" \% ]! ]. g
        bgR = '0000' + fadeOutColour.substring(1,3), f* o. d) G9 A+ n/ h
        bgG = '0000' + fadeOutColour.substring(3,5)5 m9 U8 b% U$ k" d/ |) ~" [: D; O
        bgB = '0000' + fadeOutColour.substring(5,7)
7 v0 W2 `3 a3 w& [& {        currR = new Array(numLinks);
$ H$ s1 }* q* j# [% {7 L  T) j        currG = new Array(numLinks);: F3 L' b, j1 V6 W: M  x
        currB = new Array(numLinks);1 ^9 T# B9 l( [* A: l1 P6 r
        count = new Array(numLinks);
6 z$ o# R. m* n( g8 A        fadeOut = new Array(numLinks);
0 e- I. _% S& t- _, y        continuous = new Array(numLinks);% M# [( {$ Q( I8 ?2 m
        newColour = new Array(numLinks);: O, S" r+ }1 t2 b5 w% v" S
        tID = new Array(numLinks);, q0 r3 |/ d3 e/ d1 R3 t' m& X1 `
        redInterval = toDecimal(bgR) / numFadeLevels;, ^" K  P0 ?3 H: m  G: I$ p& p
        greenInterval = toDecimal(bgG) / numFadeLevels;
  E: `. i& y8 _8 a# z; z        blueInterval = toDecimal(bgB) / numFadeLevels;
# a; \5 h4 v, p$ n  s7 ~; o8 J& f        initArray(currR,numLinks,0);
( b4 ^; }: v$ J: A3 E, I7 I: [* G        initArray(currG,numLinks,0);; X7 c6 `: H) Z! }9 |2 l
        initArray(currB,numLinks,0);
* I) U$ |. K+ {9 x        initArray(count,numLinks,0);& G( O1 Q2 B8 Y) `
        initArray(fadeOut,numLinks,true);
1 s+ Z( M, H  G; ?1 x, V        initArray(continuous,numLinks,true);5 k! T) g  j- J
}       
. e( k( y; W: N7 Sfunction startFade(id)
$ w/ T, @  }$ M5 r2 l6 i{4 M5 G5 M. D; \! M% O
        if(fadeOut[id] == true)
7 `: q6 E1 M4 ~  P% ^$ b* g        { /*move colour towards background colour (increment)*/
! G$ V: L; L- O9 @                currR[id] += redInterval;
5 e/ e% _# ^/ h" _% x% D3 r                currG[id] += greenInterval;! l8 y' A5 N/ m
                currB[id] += blueInterval;
& w8 s4 D  ?- k                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
6 L8 m8 \" X( }, H, h  o; v                if(++count[id] == numFadeLevels)7 h' L. K, b6 J4 \
                {
8 i. w8 g7 c  H, k+ \. A                        fadeOut[id] = false;
" J& }7 u4 ]: d6 z4 h; j, V3 q- f                }
' j6 y9 ]. r; r4 H4 p        }* @  ?3 A0 i' J7 u0 A
        else) a' w; ]5 W+ t+ p
        {
3 U+ |% u7 `# D0 q( ?2 u                currR[id] -= redInterval;
1 M! F7 V) L" `. A
+ M$ @. F1 m2 Y- L% Y9 D4 `                currG[id] -= greenInterval;
. c; \* ~- R% b2 A/ \: Y
7 `( O2 U+ W( @( o& O; M                currB[id] -= blueInterval;
; \  `. G4 |' o0 W
2 [& T/ {" h4 i4 O' l                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);: U2 m7 H; L6 {6 G9 L3 J
/ F( H) P- w/ z
                if(--count[id] == 0)9 H. g5 A" s; k

9 O& Y4 r6 g: @2 T. J                {
; }1 ]+ A- C% r# I' u$ u+ k
; q% f1 M# C6 n% ?. Q4 S( J                        fadeOut[id] = true;
) h( g1 R6 f3 E  N) d8 f
3 W6 I# @+ ?2 @/ {. |. M2 K$ z( Q                }
: b$ o& s- b" X: w8 s6 [1 K
6 z$ V0 Q" D$ |0 H; ]) [        }. @  Q! n( _% x& `

$ m+ {+ b& S3 f        if(continuous[id] == true)
% n) A4 {4 m+ j& I% B/ u- m) W
% Q% Y5 P- p; n6 e# \        {8 q8 x) S: m# M# w

) E" Q% H/ K# g, b- J+ H' s# w; r1 _                document.getElementById(id).style.color = newColour[id];                , s; {8 E# W0 M# L# U! {; H
; j6 a$ G! O% h1 S+ R
        }2 x% A' x0 S$ w  ?! R; y
6 p2 J5 M* Z( N1 [1 j3 o
        else
5 r7 Y( \; X* \! N9 H, ]: E4 _' d, x1 `$ _! H1 Y, Q
        {, p$ q2 Z# A! T: d3 P* |
1 q% q5 p' s" m! F, [
                document.getElementById(id).style.color = hoverColour;
3 `1 f0 F6 G+ M7 R, G- P. H) q1 S; w, G) K5 A+ O
        }
4 b6 ^7 z, u: ]: s/ f$ r9 w2 F6 |
        clearTimeout(tID[id]);8 x5 o2 h/ A7 |: S+ p1 V. ^* D

; S" V' a8 x( D# x% A7 G; d$ ?8 U        tID[id]=setTimeout('startFade(' + id + ')', rate);& D) Y# N4 d: O8 j
. s% Q% ]0 }  T3 \
}0 M$ _( C5 l% Z
8 n4 I1 x. o) `$ U+ }$ y
function continueFade(id)
+ s! B' }+ I% z* n9 v7 l- A3 ^, E
* \+ e9 G" L7 Z& e+ }3 }{  k- S  u! ]: u! w0 s; v* b5 i3 `

0 }3 F$ O: \! M6 |2 c        continuous[id] = true;
0 X  W- l- o6 }1 ^6 v0 r0 A4 G, G: n6 v& V0 b  C
}0 K8 V9 f$ T; C2 _8 h; R

, M) _; g4 l2 B) k! e# ]' }+ K0 O4 Q7 @$ B: Dfunction stopFade(id)
  V* N/ ~" Q& Q. f. X2 e% O# h6 P+ \% b5 ^
{
% M; _+ m2 l$ R' @6 \1 V; O% \& g! O2 M3 z
        continuous[id] = false;
6 I, }9 p* `! [' x' T& `
$ G5 T. Z9 e& w2 I  E0 J* [}/ V9 l) J5 @: q1 T; ^/ q

3 e; {; Y( g; T; l( `7 rfunction StartTimers()
* \3 t  N+ _$ n
8 k8 U2 a* k1 F9 m{        //set up an initial set of timers to start the shimmering effect
: n8 G( U3 T$ F) [+ A, r1 R9 o7 @: a; ~" o2 t4 M
        for(id=0; id<numLinks; id++). U: d) i7 P7 n

" m' [) \. u. e        {, X2 r  }3 ~' L' u
5 }6 }7 t0 r9 H. _$ ~1 k' O1 ^$ ]
                t=setTimeout('startFade(' + id + ')', id*100);
9 O. s1 G9 @* y' ?
" p1 I$ l( k+ l5 i- z        }$ M' l; R6 ]& H$ B) c. \: W

& ?+ d# b0 Z8 N}
' w, X) L1 X- Z8 J$ B: K4 ^7 R/ [* M
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')6 F! e" }3 W: J1 w. @% z4 t
8 {0 j" R2 o) x# a$ S" i1 Y
initLinks('#FF0000', 6, '#FFCC77');& W  _% o7 M) T7 g

* ]! K% c  k( r+ x//-->/ J& T$ a" h) q9 Y5 t1 X
6 Q% z( P! u7 O7 c- R
</script>
4 U1 _7 U, {3 f4 h/ M<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名:58元" W1 K6 e( e4 {: M: C
</a>4 b* c/ D: l+ P# B0 C
<br>
+ r; M& F( u/ \! x( h  A<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名:110元</a>
* F& p  I( i8 q  q. W1 v<br>, e/ \$ Y5 L. }9 X$ l
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>2 z  b2 f7 {9 j
<br>        * t1 U4 y2 v# v  R; h! v7 l# @/ P9 N
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>& ~2 L" \% u, n9 }1 b) s
<br>
) z* p' l; [$ }' p<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
  x9 s3 W3 Y/ B5 h7 B<br>* V& ~+ \& q! x9 m# E4 ?
<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>& @4 k9 M7 l2 J- @1 l7 j6 h* ~
<script language="javascript" type="text/javascript">8 c) l& _& U$ Z' k; {/ u' z+ z: \
<!--
7 @7 ~4 a3 ~  K# DsetTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
8 @% k$ j! r: L" |: N: ?0 Y3 Q//-->
: R- `1 ~  K8 F( T</script>

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