返回列表 发帖

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

<script language="javascript" type="text/javascript">
/ h, x7 V  ^0 Y# T<!--
, k' j1 J9 |: u. i5 z// convert a single digit (0 - 16) into hex* k# |: H- ~$ T- Z8 b
function enHex(aDigit). _  y, ], n+ i% \* ?# D+ f4 W
{, E4 u, g# s, s3 `2 Z
    return("0123456789ABCDEF".substring(aDigit, aDigit+1))
1 F( H$ U' v' h! v  l. C}
) R% u# [; c& `1 ?" Y0 @- s2 `// convert a hex digit into decimal
$ A) ^" N1 ^6 B' ~function deHex(aDigit)
% t/ A' i) J# I{
" r* O+ r5 L  b1 a; `    return("0123456789ABCDEF".indexOf(aDigit))5 q8 h8 A) |% B4 w
}
1 |: `! W# R- z  @7 B7 ^9 F- e9 e) G* B6 z( J3 `# v; ?0 `7 u
// Convert a 24bit number to hex; t' g/ o. F, t& j' }% @7 ]% C
function toHex(n)
+ E- H3 {6 Q4 j7 N{
* W! t# B. g1 }. p, R    return (enHex((0xf00000 & n) >> 20) +8 z& f, N! J$ h# g& }8 J  F4 o
            enHex((0x0f0000 & n) >> 16) +
' d# K# {% V- A( Y            enHex((0x00f000 & n) >> 12) +3 A4 C% f: V; A, m4 z/ ?8 f
            enHex((0x000f00 & n) >>  8) +$ D4 a( U4 q, F2 \+ i( T4 W
            enHex((0x0000f0 & n) >>  4) +. }7 a; l' v8 B* I* h
            enHex((0x00000f & n) >>  0))
# g! v( w7 e0 R1 O4 ?7 r# ]1 ]}
3 v' ^: K% o. `6 I) k// Convert a six character hex to decimal% f. W8 M# C/ a
function toDecimal(hexNum)5 z' R( h. e% C  q/ A$ {7 Y. _
{0 g2 @. O) o" u- l0 |/ B1 N  h
           var tmp = ""+hexNum.toUpperCase()/ H0 @6 s6 M( I( W# m
    while (tmp.length < 6) tmp = "0"+tmp
4 g: i# X8 P( m) J6 h           return ((deHex(tmp.substring(0,1)) << 20) +
/ j. L4 f; ?8 c7 D& c2 ?! q+ T# s                   (deHex(tmp.substring(1,2)) << 16) + 6 b- m& s4 i9 N. Y
            (deHex(tmp.substring(2,3)) << 12) +
- i( G* j+ k% r  w. @1 t2 A            (deHex(tmp.substring(3,4)) << 8) +3 ?( g; H9 |3 t% c, D  k1 y! H
            (deHex(tmp.substring(4,5)) << 4) +2 G; |. F; ?8 r
                   (deHex(tmp.substring(5,6))))* ^0 r& b  s- ]9 D0 h1 S3 F4 H. d
}
1 Y3 _& G* X9 [4 E///////////////////Shimmering Links/////////////////////' s( i7 V5 z: S+ g8 J( `  Z. ^
//global variables
- L  m# Y+ T4 R# y: nvar hoverColour) V2 f5 v* i+ j5 b5 W: o
var numLinks;
% q1 a8 s) L0 p1 Bvar rate;: R% e, t- p9 O1 g
var numFadeLevels;
. [6 z9 E. @3 I2 x4 Lvar bgR;0 o/ P8 f: r  k+ s- P$ m
var bgG;  s; x7 J0 L: a2 E6 f, O) s, W& k- p
var bgB;: T0 Q& q; D5 p; b/ N5 X
var currR;6 a; y- ?! X  \# p4 X1 `
var currG;9 h2 H9 E5 C! k* _) a2 D1 Q7 }
var currB;
6 U2 `" ]  v5 ]6 J* wvar count;
% S3 E6 t. D2 t5 N# Y- Z! qvar fadeOut;/ K' K8 Q( h. m& b" v4 B8 k
var continuous;
+ G- P5 ]; |+ \& e; I" @var newColour;7 o6 J' D, i* f! @1 F! l
var tID;
! W9 G: g5 d  A5 d. M# F* g, G: r7 ovar redInterval;, a2 {- Q9 i4 P4 l, x( N2 ?
var greenInterval;
; |6 Q1 {' d; W3 h- F/ e  Fvar blueInterval;
: m2 ^3 m3 M+ z0 {$ n% N6 gfunction initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
' C$ p3 R3 s2 t! w& }" z{
/ |* Q! E9 u( y        hoverColour = mouseOverColour;
1 J8 D9 @# o' B) C1 \: q        numLinks = numberOfLinks;
2 B8 H2 D4 x, N* G# ^        rate = 1;
' s; M; F# u9 s! @0 k, r# K  y        numFadeLevels = 30;
  T8 h+ ?( Q- [. o        function initArray(theArray, length, val)
* Z3 @  I2 ^  j7 L# U8 Q        {* ^1 T& X1 V9 i8 \, k$ m6 C
                for(i=0;i<length;i++)
, i' z: [6 [8 [# A                {, a+ N& N. C+ |9 T- N1 T( N$ Z
                        theArray = val;
& e' t4 [3 g( u0 y                }
& R7 L. e8 n3 ~+ {1 w        }
; [3 L, Y1 H' F" B) c& h        bgR = '0000' + fadeOutColour.substring(1,3), ~& b# T! x# j
        bgG = '0000' + fadeOutColour.substring(3,5)! r$ v6 U& _# D7 W$ v, t
        bgB = '0000' + fadeOutColour.substring(5,7)
3 t& ~2 _1 A* }" W        currR = new Array(numLinks);1 l8 `2 I7 j4 Y
        currG = new Array(numLinks);
6 k. Z: D# [0 G        currB = new Array(numLinks);& t! ~6 [& a) t1 p. k+ L
        count = new Array(numLinks);8 j; S6 Z9 S: F* g3 ?! ^5 b
        fadeOut = new Array(numLinks);
. I: O- f9 {% J9 r( C( \        continuous = new Array(numLinks);# A  v. K% M9 C
        newColour = new Array(numLinks);
/ W2 E, {# P- |/ q! p+ }. ?: O        tID = new Array(numLinks);
. c9 |# l. M$ V        redInterval = toDecimal(bgR) / numFadeLevels;! D0 T; z0 w9 k7 m1 ]
        greenInterval = toDecimal(bgG) / numFadeLevels;
" f3 Z. ?' u0 B        blueInterval = toDecimal(bgB) / numFadeLevels;
/ N/ r5 T, d1 T2 `+ r0 v# b        initArray(currR,numLinks,0);, h) {) E! U0 b# C2 J
        initArray(currG,numLinks,0);
7 X& b; U' g+ [! _- Y        initArray(currB,numLinks,0);# S# T9 y8 {) Q, r. O2 \" ?4 g
        initArray(count,numLinks,0);3 x( x; r  p( i1 K/ P
        initArray(fadeOut,numLinks,true);) M# a8 G6 w! c. d7 }( F
        initArray(continuous,numLinks,true);
' z; H* F4 q7 A- F* F# d}       
' i/ ?  }& }3 ~8 I) }; Z2 u, ^/ \function startFade(id)
4 ~3 k8 v9 X4 |& @% s6 Q4 t$ s0 x. A8 z{
& @8 `! B- w: @$ L        if(fadeOut[id] == true)1 u- X$ |4 T% B3 o
        { /*move colour towards background colour (increment)*/
, V0 k2 R' [1 f) \                currR[id] += redInterval;
( f% v. n& l4 @# ~) C                currG[id] += greenInterval;9 M9 V5 q8 O: ^
                currB[id] += blueInterval;
% L& ~3 ^* \- `. R" c" i. ^% P/ Z                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);" Z: I9 b$ w6 S2 ]: B( j
                if(++count[id] == numFadeLevels)
* y; r0 a8 a* Y                {2 R+ x9 y* Y) I4 f
                        fadeOut[id] = false;8 V3 r0 n( L  q8 q4 E! }# g
                }1 Q. b+ I% i8 U; x: q6 t: U. W( W
        }8 N3 G; k  {+ O" }
        else
  c, D/ q0 ~. ^6 u3 v5 U        {
/ i2 }4 I- m9 P4 h                currR[id] -= redInterval;
+ ?' o' G1 {  A+ V5 [6 j. p. G3 r! A
                currG[id] -= greenInterval;
- U. q% L. o) L- I! Q9 b+ F1 B" _$ i5 u6 `4 c/ R" y" P& p
                currB[id] -= blueInterval;6 x: F3 B: [0 O4 n+ a7 T% t( W% T. L
) o7 ^" B8 S4 f% d
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);1 [' L/ Q' \! j4 F

  |( v% p0 N1 P. h! F                if(--count[id] == 0)
0 y( G+ q2 A- F7 O7 t! Q  g* _& T' X- G
                {& \% b7 R, b9 ?" E5 Y
9 J5 b1 E7 |* k% @, q' R
                        fadeOut[id] = true;; I4 R8 [0 s+ G9 R/ A
- Y: J4 e; @5 P- z( D$ z" U6 L- M" D: }$ i, R
                }
. K( K) }* d+ X/ n$ Z) n2 \8 s, c8 j; q- P: x$ q# v
        }
0 ]8 t4 G& M6 r
( s( N. l8 `; F; S) q        if(continuous[id] == true)0 M( P8 }# _4 K

- |- ]6 ]3 Z, X- k2 r/ W        {
" t5 h: _1 o9 y
3 H+ Y$ r) e6 {: _2 ~                document.getElementById(id).style.color = newColour[id];                - ~' j" c0 Q9 T8 j" d7 I  l) l& G

* v+ ^1 Z8 @+ N  p- o6 r        }9 A$ V* U! J& T- F! B

5 W4 C/ L, o- k% G  u. T        else. h  b1 \2 K' Q! E( `* Z, U1 L

1 D" j. h4 X1 t3 @        {" @1 g$ b7 m. b, S
* m( T: p9 F. X  I
                document.getElementById(id).style.color = hoverColour;/ `7 `+ U/ V, x# `$ k. u/ W( B

4 i% |2 o% ^: U9 i9 g3 V        }
( ?4 L$ ~8 a8 ^  m4 ~3 l5 V/ V! n% R
        clearTimeout(tID[id]);
; E6 Q' @0 @5 \0 m8 `2 ^) {4 `+ k! J* y" ^" D
        tID[id]=setTimeout('startFade(' + id + ')', rate);
- x8 l$ {9 _: z: o7 u5 s6 f6 r/ J2 f
}
. J1 g2 }$ h: E4 U# W
  Y6 |5 V1 O( S( R( ~8 V# Zfunction continueFade(id)
* I6 ~" O. p1 W$ Z  [  I) J' i8 h( r4 m% L  g/ N
{
+ U; ?5 s1 ^; W5 h: A7 L
' v- a8 H7 A8 X0 {, @/ S3 A        continuous[id] = true;
0 e4 j; ~: M, C- W/ H7 ~' M" D0 s: [+ B0 l
}6 a2 h" e  G# A8 V! A  `3 F
( R8 W! z) G( K0 z
function stopFade(id)) _: y) X3 b2 q; ^+ x/ a6 v7 C9 [
) e- ^3 Y6 s$ v# i$ P0 N
{
& C- n8 l7 S. t+ S
+ M: y' g3 ~* N+ B* x        continuous[id] = false;8 H9 M- F# q2 a0 o) U# }5 ^
, n. K) Z: ?& W. W* d2 v& i8 z
}
6 Z3 P% V( g5 y5 B+ t* E' a* f% p$ ]& x0 I* j
function StartTimers()
' O8 {$ j8 N  p5 q) ]9 m7 ~! Z/ t# \
3 s( a; `: r: P- w" I  B/ U. M{        //set up an initial set of timers to start the shimmering effect
9 P1 `5 I2 M6 N  ^2 w  @( p; ^8 _" L/ [
        for(id=0; id<numLinks; id++)' _7 _" H9 q# B4 U
" T5 A7 c: w! K$ ]
        {$ f" n9 j% m7 d! j9 A
1 N9 K( x% B0 v+ ?) n* q8 B; z7 w
                t=setTimeout('startFade(' + id + ')', id*100);: d5 r+ \( `7 D7 A) H8 T

. i$ J' c! Q* ?  T        }
4 S+ b- M) F' V- ~& g" Z4 q- F3 d
, E( |! r6 a' p4 x}
2 w, w( G/ a8 z/ a8 r, s
# G7 A" t7 d7 E: W6 p//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
5 W% m, o) ?' O) y
! }& F- q: N( n$ W3 ~: CinitLinks('#FF0000', 6, '#FFCC77');
7 B& `; S9 a/ j  k9 [- p- E) q( Y) y2 Q2 f
//-->
" n/ @% P" g$ n6 h1 N6 t( d0 t( t) _$ P$ _7 V* D8 _$ H  E# t' r
</script>
$ \  H. _) t' h8 c6 L<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名:58元& {( z7 j- D6 E# Z2 m
</a>
( p" \( \' a9 J7 r" T1 z<br>
( c9 G( W* w- o2 u, d0 j6 R% x<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名:110元</a>
7 ^) D/ n5 H3 ?1 s; c5 s. _<br>$ W/ @% p5 F6 ^1 c) B0 G2 z
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
3 s* h' u. {' g<br>       
4 X6 D6 n: b) i  x/ m! j<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>5 F, T8 P1 J' ~+ `* C
<br>
. e2 @  M2 b' v<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>5 h/ {' \; {7 _: q9 k  r. c
<br>
* h! Q7 Q7 W4 u# h* f<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>
" w6 e7 h9 }/ y  J$ e7 }<script language="javascript" type="text/javascript">
) b7 u. H! S/ F4 {3 ~  v<!--
* U( o! S: g, i1 hsetTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
4 V' {7 E* m5 @3 h//-->! u& C/ g: \! j& @
</script>

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