返回列表 发帖

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

<script language="javascript" type="text/javascript">
  y/ o4 R7 _- B" I2 i<!--
. |( U" u' G" H2 S$ t8 W// convert a single digit (0 - 16) into hex0 L6 M: n4 [; U/ O7 e
function enHex(aDigit)( R  \1 p5 w2 M7 I+ ^
{
6 U: f! a/ c4 I$ G/ U    return("0123456789ABCDEF".substring(aDigit, aDigit+1))8 S  P" j) e" Z2 [2 `# g* w2 |9 ~
}& |5 q( x" F( A; {4 ]% q& G- e4 ?
// convert a hex digit into decimal0 Z6 l: G( `; c3 k3 E
function deHex(aDigit)
+ l4 J" L" k; y1 ]0 U7 u8 X{6 i! P- Q& a* h6 ^( ^1 Q
    return("0123456789ABCDEF".indexOf(aDigit))
) w* I. u1 ?2 p# j8 \}
. A( D. X( r' T7 r/ G9 n  u# u3 |( |8 q! M) i
// Convert a 24bit number to hex
4 t  w* X4 }1 d4 r0 Cfunction toHex(n)
2 }: h$ }  m* r% n! _. G4 [  l6 R{9 s4 g% p9 V: i/ U; }
    return (enHex((0xf00000 & n) >> 20) +* M. h+ x2 X1 o( ?7 m4 N; O
            enHex((0x0f0000 & n) >> 16) +
* F; A. f2 s" S/ l5 `$ E* C            enHex((0x00f000 & n) >> 12) +& X' A' L2 x, a9 S' j  [
            enHex((0x000f00 & n) >>  8) +# \0 d5 C; f! N$ ]8 o* e) A9 v, n
            enHex((0x0000f0 & n) >>  4) +
( B2 K# i+ s0 h1 L/ {            enHex((0x00000f & n) >>  0))
0 i2 G  s8 t) u  d# S}1 j" b" u( P+ m
// Convert a six character hex to decimal5 W8 `! S$ L: t3 X4 w' G, D  p
function toDecimal(hexNum)
* }/ K' P: `! l6 M) e4 y0 C; F# Q{
. U4 i% q7 t- |$ H$ w, M           var tmp = ""+hexNum.toUpperCase()
# V1 ^; O7 g$ X    while (tmp.length < 6) tmp = "0"+tmp. V* J% f- V) {2 s) Q* E& H9 O" z
           return ((deHex(tmp.substring(0,1)) << 20) +$ i) v. E6 Y0 {" s, Q2 Q. {
                   (deHex(tmp.substring(1,2)) << 16) + , j, K9 C! b! x( W% Y2 `% `7 q
            (deHex(tmp.substring(2,3)) << 12) +4 [; t% b* z1 ~  F- y/ l; c
            (deHex(tmp.substring(3,4)) << 8) +8 Q3 @- Z, n! ]* X  Y  A
            (deHex(tmp.substring(4,5)) << 4) +
" E# z- n  H0 L  x                   (deHex(tmp.substring(5,6))))
  ~. Z3 w% K  M! x9 L}
/ c( ]7 w( x  E6 |///////////////////Shimmering Links/////////////////////& f) T6 y* R, n
//global variables
" N* W, |- f0 ~3 i2 Rvar hoverColour5 H( \' e2 u/ {. [
var numLinks;
: @5 w6 |& F: S  A" Bvar rate;
, ~3 \3 m9 u! p$ ^9 W( W# kvar numFadeLevels;
, L6 x2 B. u4 n" I. Ovar bgR;2 L. h  I8 U7 }0 }
var bgG;
- d4 n- z3 A& q+ V5 ?4 V# svar bgB;
  ^: s9 H% R( C" ?8 f) qvar currR;
9 V' V. D6 |3 M7 W) t& Qvar currG;; M7 D  E1 Y5 x. j+ X- n% W
var currB;
5 f/ j* i, ^5 B6 xvar count;
8 Q6 E) e  `2 V* \6 zvar fadeOut;
) Y! f3 t, s( o  Jvar continuous;) v1 O' p, s- w( F" X8 D
var newColour;/ Q$ }9 n* Z1 b4 f0 ?) w! ?
var tID;1 o4 y( f' W2 s- c1 Q/ h) K, h2 |
var redInterval;
" f* X* d2 Q8 y% @& P. ?. pvar greenInterval;
" Q7 C# m% G5 |( m$ b) U) Ovar blueInterval;8 U& E3 {+ D' D% Z( ]8 M
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour); M' _" H8 e1 e1 y
{1 Y. G9 u6 t/ }1 K6 B+ ~) |# F
        hoverColour = mouseOverColour;7 {+ k7 Y& [( H& C( Y; f& T7 P
        numLinks = numberOfLinks;
1 m% w* r5 ?# u/ R        rate = 1;
. I3 o3 U2 Q3 w1 p; b0 N* b6 e% q        numFadeLevels = 30;  v7 E3 S/ F- `- A9 k
        function initArray(theArray, length, val)
$ `1 g4 f6 e1 P" D3 U$ P, ?. _        {
/ i0 o$ Q7 W) V5 f                for(i=0;i<length;i++)0 _  `& T8 H! @4 r
                {
3 b$ L4 o# A. D/ r$ R9 m                        theArray = val;: A( w& |- k/ h5 B& d- @
                }
& i9 [- ?1 c) Y* w        }) X3 a7 j1 u% D. T
        bgR = '0000' + fadeOutColour.substring(1,3)) g! L0 O# C3 j0 \' b- v8 f+ K2 ^" i
        bgG = '0000' + fadeOutColour.substring(3,5)2 P( m# G9 k7 y, C
        bgB = '0000' + fadeOutColour.substring(5,7)# u- a% P" |  Z
        currR = new Array(numLinks);& Y; _$ r2 h  |
        currG = new Array(numLinks);
3 S1 f: V4 H) x$ z- l        currB = new Array(numLinks);
6 N+ j% M, ?% g' a        count = new Array(numLinks);
1 K- o; K: a" u, u        fadeOut = new Array(numLinks);
8 }' ?6 F4 B) H        continuous = new Array(numLinks);6 _6 a# C( s$ _, `8 O* ?
        newColour = new Array(numLinks);4 [6 `1 S6 @/ u4 P6 }8 k
        tID = new Array(numLinks);
, T; n- M  |/ W. q, W+ R3 v        redInterval = toDecimal(bgR) / numFadeLevels;
0 Y3 c5 K# O6 ^8 L9 D1 t6 s        greenInterval = toDecimal(bgG) / numFadeLevels;# u# O; m( k% y4 d
        blueInterval = toDecimal(bgB) / numFadeLevels;& l9 l$ B/ E, v2 P( L# b; C( J
        initArray(currR,numLinks,0);
4 N' a/ v  @- |" g# x4 I        initArray(currG,numLinks,0);% E4 W! Z# k8 I. v: r6 _% P1 ]
        initArray(currB,numLinks,0);
) Q  \4 O7 a; Q0 T        initArray(count,numLinks,0);  S7 A, ~0 ?" F" Q
        initArray(fadeOut,numLinks,true);, P3 n% T% w6 k1 b$ x. i8 x1 W
        initArray(continuous,numLinks,true);
' |0 b) ^: D9 z2 [  J9 R& z}       
4 q5 P# ~% c, |% wfunction startFade(id)
; l3 T2 O7 ~" J8 Q{2 e$ ]' Z1 ^$ Q/ B8 o' H- G( t7 \* T
        if(fadeOut[id] == true)
7 q$ x2 A# s: _        { /*move colour towards background colour (increment)*/
! K& g6 U! A: H) L* W' w% U* R                currR[id] += redInterval;
. E4 |  H/ ^; e: P( R9 P( w                currG[id] += greenInterval;( j9 x8 U) J1 Q; D1 `  U+ l' k
                currB[id] += blueInterval;
: Y: S  s  b2 N* [4 k; d4 S' [- m                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
+ k$ `5 a& M3 j. y$ ?# C7 b1 \                if(++count[id] == numFadeLevels)
. ^+ ~2 ?7 T# M2 E3 i                {
- ?7 {2 q9 ?) G4 Z. {4 @                        fadeOut[id] = false;7 Y. P( S* n, _+ a- R" G' g
                }0 P/ }' W( u1 h$ q$ {
        }8 i! F; g+ B$ `" l+ P" c
        else: a% I- t5 z- g
        {
5 A, C& R$ y% a' W9 w+ e                currR[id] -= redInterval;# t0 k: b5 b" D2 v, Q! u
* [3 a! ]2 x" o8 f$ ]
                currG[id] -= greenInterval;
7 P' i; j$ L7 C3 B3 U1 c, |/ x" ?2 [4 M. j# C, N
                currB[id] -= blueInterval;+ j1 Q) n" u$ O
6 }$ D, T6 O" W( ~
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);% c: W' b0 G& p2 T4 N

1 _( ?9 o. C" b/ S1 j8 }                if(--count[id] == 0)* x" N& [. i7 h5 N% z' w

$ z/ n* `$ b/ w) S3 ^                {
1 X9 Y6 \. K( }3 z: J. k5 |) j; \' d0 H) g0 Q
                        fadeOut[id] = true;
& G3 D% ~0 @# n  D
7 f# [% j3 p4 F8 R* E9 |) k# t                }7 _5 z9 q4 L7 D2 p

1 q7 {/ h0 c+ R; Z        }; C& ]7 n2 T" Q7 s7 Z1 m

9 v2 X, R$ }, x7 B! Y' M        if(continuous[id] == true)' H: T) R  B" c# r9 o

. I& z) e! r8 @6 C        {
6 ~5 {/ e7 b: i; C" G1 Q( n2 i. b9 {, |# v  o
                document.getElementById(id).style.color = newColour[id];               
" g/ `- Q; U+ l
/ l! u; @4 u2 U' p8 |        }
- q4 \* B8 F' M& l" d( H* ~' z" j4 O6 \# `3 y& h
        else
( r0 A; k% Q8 C1 k& K$ a4 N( ?2 A
" {0 l& p  v, _1 N) A! ~& e        {. n& d- H8 W4 l- I8 |
1 A3 \0 F6 a: b/ O- J) C* T* I, o
                document.getElementById(id).style.color = hoverColour;4 e% W% n3 T0 P$ Y' j2 B9 ^1 p' T) ~
; r1 |. B& U0 r" A( S
        }* g! M. o1 F  l6 l- W

1 t$ t( Q1 K( [( k        clearTimeout(tID[id]);
9 ~  Y' T6 ?' i; T# n
0 ?8 o; f7 [2 q' f/ |        tID[id]=setTimeout('startFade(' + id + ')', rate);
5 ^* z- L: w8 {" ^! B6 L, _- `) x. x+ ~2 @2 _" R
}
* u! N& ~$ Z6 x' w  [* ~
) C5 i- Q# p' ]function continueFade(id); |6 m/ m# |9 E

2 z# i7 a' _, z3 w9 M' M{8 D8 h; t- u; t1 Y3 a% @& O2 l6 Q$ j
  B4 m" Y% P' b! d# O0 m6 i
        continuous[id] = true;0 e! x5 r# z" M5 x$ @
( i( d$ `5 p* D: f' H6 c& s' I: t: m
}. x! a" h" r9 y/ ~; L( Q  U

4 q; J. W; B+ G+ U, afunction stopFade(id)& x# A$ i; T, M6 U0 Q
. ]3 C. P) |. x. b) X4 @3 J. D% U- Y- o
{
& x0 s7 [& S( w% A, s, h; f: d5 y/ S5 T  ~) s
        continuous[id] = false;# d7 z( R6 V# I9 F, m) Z4 q$ W

4 }( b$ E. Z. k( G: E5 m}
& ?0 Z9 J" d  |. i) s; C) ]1 }) t9 s; v8 J* R' R0 B/ ]8 X& k# G
function StartTimers()
" D7 ?8 u' H6 }/ Z# B! y& o" Y1 P2 i6 o* C! H, L8 M" [  R
{        //set up an initial set of timers to start the shimmering effect
' j( w$ n; n  s/ ~* Z+ Q
: `+ x5 u6 `  f9 A1 u        for(id=0; id<numLinks; id++)1 E3 g2 k$ v# o- t% a2 L+ \
1 h0 ]# j, p* O% r) z0 q/ e* P# n
        {( ~4 K, p2 [5 ~: A
4 Z3 e" s6 x; z/ R
                t=setTimeout('startFade(' + id + ')', id*100);' E0 V" Y9 S! ]1 }3 u3 L% a
& `0 Z9 Q3 q* _/ y9 ]5 w( d
        }" F1 e6 p. X$ a6 n4 V
( N1 G! Z0 O4 ?+ ~9 Q2 P
}
( ~; U7 Q' R( b2 s0 a! v
0 O( ~7 x6 H* [0 g" w//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')" R, C# F* d; L% z+ Y/ I" _
" v9 Z7 d" N1 k1 [3 g+ P: H) B
initLinks('#FF0000', 6, '#FFCC77');& s6 H7 Q6 z  M. H9 f2 I) i1 s

6 L' @$ K# b' d( q//-->: J* N! W) ~& G; e8 X4 t

  e3 G. w, \7 [' d9 I8 G# \+ ^</script>
* ^/ W8 B' S( b* N<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名:58元' O- [: h4 k# C9 [- m8 ?
</a>) |+ Q' J7 X) J  J, X4 O5 }$ s! z
<br># l& |: M4 s7 y6 T
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名:110元</a>' P) I4 I" K. [9 q4 G
<br>2 C$ I5 s9 Q# l0 n8 ?  Q1 l
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
+ _. F8 c6 P' @) V<br>       
2 _/ ^' z) i% F; n/ A<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>3 {, `" }5 C, i! A- s7 p* X
<br>
# x' k" k! W& b/ M8 {5 v) w<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
  t7 l- `! d& C/ O: W1 P* x; E5 d<br>
( e& d7 p1 [0 W; }<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>& ?: u. ?2 F2 {( E$ n8 h
<script language="javascript" type="text/javascript">
2 z4 g* |8 v3 K% s" s<!--# w3 R* f4 S, ~! o% }% g8 \% U% l1 H
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
. J* L  y; k0 j3 Z//-->
- e) W: N/ |8 Y; @0 k</script>

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