返回列表 发帖

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

<script language="javascript" type="text/javascript">6 \9 p6 O* K1 z$ E5 Q
<!--! m- Q' x% F3 `0 H5 D; N$ [
// convert a single digit (0 - 16) into hex
* I4 W/ e' @  Z/ ?# ]function enHex(aDigit)9 T( C" G: w+ ]$ }! x
{
+ u( h; E# d: e8 K) `; L    return("0123456789ABCDEF".substring(aDigit, aDigit+1))
: F/ Q/ C$ [" V6 P}
0 ~6 Y# d' o+ C5 O2 a+ [// convert a hex digit into decimal7 ]8 U, [* ^( ~' h
function deHex(aDigit)
! h" n6 H+ q5 J  q; R7 }{
' ]- q0 C* q. V9 `" M% m    return("0123456789ABCDEF".indexOf(aDigit))5 F' L( q' Z  N% P3 S. e
}
+ s" z, g/ z  o( N# e7 u! ], v3 k6 }
// Convert a 24bit number to hex
: L2 ?1 W3 Y. s# Y& t+ d3 @5 Sfunction toHex(n)
) o0 b7 o1 L3 K* G; s{. r/ r2 [! i  H0 B0 K  d) w7 ~
    return (enHex((0xf00000 & n) >> 20) +
& n& t! u- M# v. r            enHex((0x0f0000 & n) >> 16) +
8 j8 I/ ]7 Q5 e# t6 x" }            enHex((0x00f000 & n) >> 12) +2 D( T! o. X% m; X0 j8 H
            enHex((0x000f00 & n) >>  8) +8 H) M% X# w) U9 L( @/ c
            enHex((0x0000f0 & n) >>  4) +
5 t3 ~1 H( \& N            enHex((0x00000f & n) >>  0))
5 I! L! p! z! Q* s( C! X) @% G}4 N( k8 t; G/ u7 ]2 o
// Convert a six character hex to decimal; `0 v& |* u, u1 g
function toDecimal(hexNum)! l3 @8 R3 Q0 v! x
{
( e: w5 F* b- t) |2 b4 ]* O           var tmp = ""+hexNum.toUpperCase()
+ {2 W' g  ]4 N1 {' G8 C4 q    while (tmp.length < 6) tmp = "0"+tmp
& U+ n9 G3 u" t% C4 @! R/ r9 o8 ^           return ((deHex(tmp.substring(0,1)) << 20) +9 G7 F- @! n% O" z8 t! ?- C9 U' Z* S
                   (deHex(tmp.substring(1,2)) << 16) +
9 F4 P6 w4 E5 [# M! }" K" m            (deHex(tmp.substring(2,3)) << 12) +
) G8 y+ K+ i4 c; G+ g$ O            (deHex(tmp.substring(3,4)) << 8) +3 C5 r8 G+ I) r% B0 O
            (deHex(tmp.substring(4,5)) << 4) +
/ X+ R3 a& R1 R' V                   (deHex(tmp.substring(5,6))))
: l* F/ A& K# G}
+ N5 Y5 O5 D6 E  s# t  K# y///////////////////Shimmering Links/////////////////////
: D" P1 W( C8 `* {//global variables
( G7 F7 n: \) X, i4 ~' r% ~var hoverColour
+ Y7 y; W+ R  b: y, u, Dvar numLinks;% V8 _% }& }/ g% ^7 _
var rate;
) u$ J# s! y0 \. T; @+ \. C+ J6 l. F0 Qvar numFadeLevels;
. r: h- c, L" V+ r+ Ovar bgR;* E" X; D8 W) T/ w' }# e9 I
var bgG;
+ c  w% t! s' r5 \% u# \$ H0 ~var bgB;
0 a0 v0 T9 q& ]8 T; pvar currR;7 ~! j  e  @, l6 W6 M5 W  U1 ^
var currG;1 R3 A3 u" y7 Z; B
var currB;
9 Q- V9 |) o3 M3 q1 M* H0 @var count;
3 @3 A6 S. j  v' h' V# v5 Q  Lvar fadeOut;
  Q# r* O& a9 h5 j4 d6 l; dvar continuous;
- t; U9 ]/ e5 x" Y( Gvar newColour;
, e' y0 f6 J$ L/ }' dvar tID;7 i0 n+ T9 X5 h& S2 s
var redInterval;
9 C1 S7 I4 V7 f! @var greenInterval;
" T4 O/ \( C* B7 Z" w; ^$ r  Zvar blueInterval;8 L8 [2 H  ]; n4 f
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
# w, y0 w9 W' \% L1 n0 |{
0 D  A4 j+ f3 W! \% G        hoverColour = mouseOverColour;2 A2 X/ b9 j/ Z: i4 ~
        numLinks = numberOfLinks;
2 C- t- M$ d2 Q# e* t% x        rate = 1;( Y# a9 y, c# v
        numFadeLevels = 30;2 X$ B  K$ n1 O1 k6 W
        function initArray(theArray, length, val)
; p# r7 x4 R) P* {        {
# R2 X6 r# K3 A+ i  W1 v' z* r                for(i=0;i<length;i++)
3 t1 P9 Q2 S- B  w                {! \; K# D5 l" ?0 s
                        theArray = val;
1 z( \2 q1 C  m. q                }
5 E% ~7 Y, }  o3 R& u7 D        }5 ^( B9 j7 f2 j7 ?$ Z3 F
        bgR = '0000' + fadeOutColour.substring(1,3)6 k5 g6 ^" H2 q" V6 J4 G7 T& ~
        bgG = '0000' + fadeOutColour.substring(3,5)
4 [; K  _8 V4 `; ^; p% F        bgB = '0000' + fadeOutColour.substring(5,7)
& L; C5 R: V* v* ?        currR = new Array(numLinks);
5 }6 G6 r. J( N, x1 v  F/ F( I  e        currG = new Array(numLinks);
( X/ O0 p2 u  \6 p. [7 t6 d        currB = new Array(numLinks);7 x' S5 H3 S  [8 h3 {. }
        count = new Array(numLinks);
4 N- g5 y# I- a  M8 D        fadeOut = new Array(numLinks);2 s- r9 q5 @0 r9 F6 `
        continuous = new Array(numLinks);4 _; O8 A+ x( N7 R
        newColour = new Array(numLinks);
9 J: P3 A* N/ T1 ]        tID = new Array(numLinks);2 e( @9 u) [7 K0 }; A1 s
        redInterval = toDecimal(bgR) / numFadeLevels;
$ O* \: V1 P) D6 v        greenInterval = toDecimal(bgG) / numFadeLevels;/ i# J6 X$ w/ r3 \7 k
        blueInterval = toDecimal(bgB) / numFadeLevels;. y- T' Y. p! L& ~
        initArray(currR,numLinks,0);
4 p2 e# _: k7 s# w; h3 v2 L        initArray(currG,numLinks,0);
) y, u$ g, `5 T* t5 Z: C) g        initArray(currB,numLinks,0);
$ A9 z$ z- |6 L! J: X4 ?' n$ f; E        initArray(count,numLinks,0);* Z9 E; L  p. p. R
        initArray(fadeOut,numLinks,true);6 C" ^3 A( M/ i- B
        initArray(continuous,numLinks,true);$ j2 g( l) J2 s" W, g! |: X
}        # a/ M; P* ~, @- y( N5 Z3 |* n% j
function startFade(id)
! B! n/ u, H+ R" ?2 P1 x( A; X{
  q; F1 i* h. O+ m        if(fadeOut[id] == true); Z9 U7 x6 q* G
        { /*move colour towards background colour (increment)*/
. S# a7 \; E- ~. D$ H6 J5 r                currR[id] += redInterval;; q. Z: n0 C* K
                currG[id] += greenInterval;
7 b1 s+ b; X% {# h) r: p* D                currB[id] += blueInterval;: Z7 z1 Z( L6 {1 @% n
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
6 ~$ |, K! k6 u) ]' ?" `: I4 ~2 m                if(++count[id] == numFadeLevels)
+ r& r: l* k, ?; d/ M                {! A, q9 s$ Q9 l5 s; [9 {2 ?4 z
                        fadeOut[id] = false;
/ \6 D; s& Q7 Q6 ?- a0 P                }
7 [5 f" i) H& b2 w2 _9 r/ t) r        }
2 x, l( S3 H7 _' ^" c        else
1 c! H  ^; p+ v. x& X, V2 d) `        {; Z9 K1 n9 C1 x; u2 d) r. U7 A
                currR[id] -= redInterval;
' m: ]8 `- `) t* W, G
" c, r+ g( y1 l                currG[id] -= greenInterval;8 ], u! t+ Z' n) J
* n% S- T+ S: C5 e. c. b1 Z, ]
                currB[id] -= blueInterval;
1 ]8 z( U! c3 n4 R5 V& w- s0 a, e, u; v# c" Y' _; b& q/ y$ z
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);+ v* J- ?2 G" l2 F8 D

3 v- ?4 ?( h1 K& K                if(--count[id] == 0)7 l% ?$ F& d9 i! V0 }! }: D0 ?
& Q8 w( V9 k" o- ^
                {- g4 B9 E3 d, ?" ^# j1 @7 Y

) Q9 w% J, R+ L% P% H) e5 a' V0 F                        fadeOut[id] = true;
1 Q) J; o* a/ M: f% }4 a+ M" B- {- e4 @- C9 @# m6 ]
                }: i/ J% p( N3 M; O: ~' U  n9 ^+ \
# J/ P& m5 C" n5 n  k
        }
8 M; Y2 q3 W; @* ]8 Q; Q0 A. u* g- L5 m
        if(continuous[id] == true)% }5 G4 P# j( m1 a
3 z4 m+ r9 G6 ?, l) Z5 u
        {
1 t, m* k9 n4 A+ ~" T) U& U+ B5 l  _0 Q1 s
* X. u3 q$ Q, \4 F                document.getElementById(id).style.color = newColour[id];               
8 r1 {* z3 H. R5 F( _) b- V2 X2 W3 `+ M9 {2 W
        }8 Z% B8 L& R" `0 {: ~$ \0 P4 Z) O
: H$ N. E0 G! r9 x7 _
        else# l( a, Q' x/ s  d1 g# m

- n$ G. c# U! y* ^* G+ y0 b        {
' l+ i$ m" d. b- x' A- Z
6 T: j* n7 b2 {" ~                document.getElementById(id).style.color = hoverColour;
8 f" f1 y5 K6 D! z# q& g+ L. _5 n& k: D0 w
        }
% {) H0 z! `* ]. D' c
5 N. ^8 n$ C% U+ |6 W        clearTimeout(tID[id]);
2 v$ e  ~/ E: k  n7 {, P- P' N
6 @: J/ I% [& s) {2 N7 J        tID[id]=setTimeout('startFade(' + id + ')', rate);; g5 L6 O. w- R& R. {; g- S( ^

& d4 D$ M, o5 [}$ D1 B( u2 W4 K. e/ _7 A
% }( y  T3 U( e
function continueFade(id)
4 o6 s. u. S) Y# J
& M* @3 t' B) i{+ f3 L2 G# }& B5 b

& k4 [5 S! ^2 A& H6 y, t3 X. v        continuous[id] = true;
# r$ M* ?# g, h: X! \, {7 v) C1 n$ b  j4 o0 F
}- t8 v. Z0 f0 N* U+ c. J
3 U0 C% ]; O$ V( G7 b( ]
function stopFade(id)
- ~' z5 B/ b, P( g: s' V( r" x7 R) I+ g
{. Q- E5 S. x' G9 }. X  Z

  t3 {; y. v! G        continuous[id] = false;
/ P  i- Y4 i2 x2 f1 X: \
3 z$ s( T* I5 k3 V8 b}! N, {+ `0 o" q4 w& p+ e, m
  o/ X0 m7 o0 k: \1 D6 ?  y
function StartTimers()
  V$ x/ B- b' k+ Y$ R0 @" y, B( [
  @: t5 K5 O6 e{        //set up an initial set of timers to start the shimmering effect1 x# f1 J2 G9 c. p4 _, y

% E  U9 E6 [3 q/ m$ [4 l! t: }        for(id=0; id<numLinks; id++)
1 m9 s/ ~# [( ^4 i3 c& q8 \! s( W5 v6 D5 g
        {# k2 B  h  S- E2 l, S9 x# k: ?

6 u/ P# B  Y3 J" {  ]2 x. N                t=setTimeout('startFade(' + id + ')', id*100);
! Q$ h% b4 ~  i1 `( K- Q
! E2 N1 O: W( R0 W. H9 X* D        }
: V7 j. L/ Z, C" q0 {
. M0 i3 J* E, q5 w}
$ r) Y3 H+ e2 O& m* J
) u1 i( M7 l1 `4 A5 n& Z2 }//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')- q% \8 U- S& R2 x; q* q
4 _! e9 ]4 ^. O2 f: t3 V' T
initLinks('#FF0000', 6, '#FFCC77');
0 l' _! y3 S  B
5 G7 r1 e9 n, X2 W# U//-->
0 J4 h# E+ @, {" J7 c; j9 Z, ~2 D# s8 a2 |
</script>0 U2 z' q) Z- ?. l" ~  z3 v- y
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名:58元
: a! Z# ?$ V8 {' v  V6 x: {* _$ H</a>' i4 B* {1 @. y  s) v( e* u
<br>) B- B* D" N3 p% e
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名:110元</a>3 t4 O% `! U) ]& {  [* g( d! g9 B7 \
<br>  [9 ~, t, F2 t& z
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
1 O' r0 g9 z. ?, {' x2 x3 k<br>       
; ^! F8 J. r( n<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>8 c2 y0 k$ w7 B
<br>; Y* ~6 J5 r7 u8 ~" e
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
* }# K  T& ]' k<br>
# B8 y0 m, F4 D* o) `4 y# |<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>
6 I: M+ G" ~6 p8 n- C<script language="javascript" type="text/javascript">
0 j+ Z  Y2 E" S  x' M  ^: `+ }* ]<!--( ?5 _% c- o, M4 Y
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering8 l. c: ]& {& c; ]0 L) W+ X5 ]% L
//-->( w" \+ }+ `- T' V$ o( X
</script>

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