返回列表 发帖

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

<script language="javascript" type="text/javascript">
0 V6 @. F* _2 C, `: O$ v: N<!--$ h( ~, S! p; J
// convert a single digit (0 - 16) into hex
1 W- D# s8 G" `. tfunction enHex(aDigit)
6 G; o- x1 `5 t& ^* c) q{5 H) q5 {  _5 U% _, A3 T
    return("0123456789ABCDEF".substring(aDigit, aDigit+1))' W6 m6 \" W7 ~& ^0 @
}
5 F7 S5 O4 S6 O$ O) O! j$ N// convert a hex digit into decimal
8 F9 Y7 B+ d5 \) M- R6 mfunction deHex(aDigit)
  m2 N4 u: f( v{
# ~) |1 z- @3 @& d" _' U- G    return("0123456789ABCDEF".indexOf(aDigit))0 F( L6 h2 W: ~: ^* R/ A
}
9 y$ V$ j! `. U' Y
$ X7 k( E; H- m- m8 v  Q// Convert a 24bit number to hex
# `% A& q  A! w. \function toHex(n)3 t* u3 @/ Q% n
{
( [* I% I, \0 h. Z2 ]    return (enHex((0xf00000 & n) >> 20) +
0 i7 C# X' C' D$ z; o2 t            enHex((0x0f0000 & n) >> 16) +- h9 ]! j4 \0 ~- h0 |$ I3 {
            enHex((0x00f000 & n) >> 12) +
5 `% ~5 N8 z5 C( @" v8 G            enHex((0x000f00 & n) >>  8) +
/ W: f& Z) g% r. N* q9 Y            enHex((0x0000f0 & n) >>  4) +; b- j* `+ s6 M: p' |4 `$ M
            enHex((0x00000f & n) >>  0))
: q# p# a' N  |}: W% u+ N! x3 O, ]/ N7 M6 M
// Convert a six character hex to decimal
; }& t+ Y5 s6 `2 P4 c" G# P& \5 Z* i% cfunction toDecimal(hexNum)
" Z1 x5 Z0 X8 a2 m( _7 t{) M% q! y9 V4 d! Y
           var tmp = ""+hexNum.toUpperCase()
" ]4 G% z( Z, d6 G% w/ |    while (tmp.length < 6) tmp = "0"+tmp2 G1 M2 c3 o' m, {( G( ^5 b2 i6 K
           return ((deHex(tmp.substring(0,1)) << 20) +
# v; m/ r+ {# r  C/ @$ ?                   (deHex(tmp.substring(1,2)) << 16) + ; B* t2 O! e- D( D
            (deHex(tmp.substring(2,3)) << 12) +
* Y; R2 W; e" n! k+ W            (deHex(tmp.substring(3,4)) << 8) +
+ H+ D) a  i: o' [) z' S            (deHex(tmp.substring(4,5)) << 4) +
! @: \0 q$ j1 p- h2 a, k- `) M                   (deHex(tmp.substring(5,6))))
  A, N' `/ f! V$ v/ r0 U}$ k3 i% S; g. X( c+ O! }* E
///////////////////Shimmering Links/////////////////////  U, z8 H% \* w4 _+ d$ {, o+ f
//global variables5 P4 p4 j  r9 T
var hoverColour
0 P( W! J8 r# x, _) Gvar numLinks;' ~1 w3 v+ U! s; W/ J
var rate;
0 Y$ j% R3 X# ~. O- S% q* W+ wvar numFadeLevels;
6 B: {0 _  g& Rvar bgR;
* X/ W- b, H/ ?8 P8 k( G( dvar bgG;  T& v' x; ~8 \7 D$ E) E; x
var bgB;
9 }! Y: k/ ^1 x& ^1 q6 uvar currR;6 @, _; l; p; Y
var currG;
" N2 e. U- ?7 A6 U. V7 T6 Ovar currB;+ N; s- O1 t/ k- K4 ~2 i& C
var count;$ o! w: J, o9 |1 R! i
var fadeOut;; @7 g3 o' W7 }. c
var continuous;! b; X- R  I  }/ m
var newColour;; w- B% r; n4 l; j" y8 {$ {
var tID;
, ?. X) R7 M) W. W' B- j7 d# Ovar redInterval;! ?9 i/ G& y) R4 L) H( w; [# u
var greenInterval;/ x$ a+ P' D/ k+ m! q
var blueInterval;2 `+ g* U6 E/ i% L0 k" e
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)% K3 w! Z! Q6 B* S* {2 d
{
' J6 @0 n2 |1 w" `, q' w6 u2 y        hoverColour = mouseOverColour;! b( `/ e1 H1 C  i" @
        numLinks = numberOfLinks;
8 K3 l  A6 `5 o  f7 P/ ^2 t4 @- x        rate = 1;
# s3 a; T" E+ B$ S! I2 F9 Q        numFadeLevels = 30;
( S# v4 ], E- I' D/ m: f. A        function initArray(theArray, length, val)
6 ]5 q# Q* y& W        {
; v. S+ u7 _% f& y                for(i=0;i<length;i++)
' X# H+ J4 O3 K' o: W                {) F% j0 s0 X& D; e' g- v
                        theArray = val;" m6 D- N7 n  _& c' r. Y# o" v# v2 Q" A
                }- s# ?* p7 R7 q( _9 I3 k9 X
        }6 l1 n8 G6 ?- y: ?' e7 i
        bgR = '0000' + fadeOutColour.substring(1,3)
  `. ]( u  T. Z& x        bgG = '0000' + fadeOutColour.substring(3,5)
: \( q4 L% Y/ z- ?: u' t: D        bgB = '0000' + fadeOutColour.substring(5,7)5 x& x& V( c% c& U8 N, ^
        currR = new Array(numLinks);$ J0 g4 C" U. v" }
        currG = new Array(numLinks);
: H$ t& _5 M6 t" D        currB = new Array(numLinks);
4 b" N3 o, _; K        count = new Array(numLinks);
1 G8 Q# a/ e# k: x        fadeOut = new Array(numLinks);
2 i* T& T- u: k/ [( L        continuous = new Array(numLinks);
6 s" z9 K! S$ }; k0 G        newColour = new Array(numLinks);
6 J% W; L. A# {- }  ?        tID = new Array(numLinks);/ I$ }1 f( A  ]
        redInterval = toDecimal(bgR) / numFadeLevels;
7 }1 v: P( y- v: s) f) k% F        greenInterval = toDecimal(bgG) / numFadeLevels;
7 w$ K( W$ Q. ~4 L; [. x        blueInterval = toDecimal(bgB) / numFadeLevels;
3 B6 e  }) M$ e, U- a! @1 k/ C        initArray(currR,numLinks,0);
: y* t* L5 J) O! }        initArray(currG,numLinks,0);
# Z1 S$ N$ w0 d2 c2 d        initArray(currB,numLinks,0);
( S2 p% ~# V( @( v; b        initArray(count,numLinks,0);
! j: E2 [/ I- M( B8 B1 N) h        initArray(fadeOut,numLinks,true);: e5 z3 D* R3 Z4 z' L, j$ W
        initArray(continuous,numLinks,true);3 P9 Q8 A+ b, F0 N3 }2 {# z% ]7 [
}       
) [# H3 F) J. o/ b( a$ N, w) v, Ofunction startFade(id)
4 F4 t. B8 ^1 z3 }* {2 p* m{$ Y% ]% T! [. z
        if(fadeOut[id] == true)
8 W% ?6 c; y! j4 ^. n  h        { /*move colour towards background colour (increment)*/
  x* X. g/ P/ u4 a; X) s                currR[id] += redInterval;8 \: \. E4 M4 q# K* M) n
                currG[id] += greenInterval;2 \" l' o" q2 ^; s5 E% F
                currB[id] += blueInterval;  g- B% n  i; }: z. o
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);8 P7 _+ x% u1 b1 f5 U- c' Q& {* u
                if(++count[id] == numFadeLevels)8 D/ v9 ~: x1 F9 Q: ^- d0 G1 h  M
                {9 a" g& f9 S/ S6 h+ Z5 a! ]- x
                        fadeOut[id] = false;+ C. O/ b" b6 d6 J6 V
                }
; O. f" c& c5 z; m7 U( T( Z/ S+ J* s        }
6 h2 ?, k3 n$ ~1 e" }0 p& L        else
+ g: O' l6 t8 m8 a        {
8 O. W6 X9 _+ N. X$ C) s# K                currR[id] -= redInterval;
& d& m! O4 q2 x3 J! ]; B& p' ?) r' m5 J  I
                currG[id] -= greenInterval;$ v1 W( A/ P6 B" u) O5 W7 q+ r

- q4 E' O, b6 P                currB[id] -= blueInterval;
0 t' Z" Y0 Y9 v5 D% u3 y
$ b9 Q/ I  `, k" `2 X$ {2 z                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
; C" Z/ v+ W3 Y2 b$ G, H; W
8 E! i; \* Z8 u: G                if(--count[id] == 0)
& x: Y! ~0 ~% r' a5 ~# \5 O
2 z. t8 q1 }: {. W" U, X+ Q                {7 T$ p. m, u% S5 T, G, G+ ^
8 t8 i- d) O4 i; P) c3 z0 k
                        fadeOut[id] = true;* P2 a( m0 |" m  q1 k

* z4 N+ I* b/ f: W9 |                }4 P, W; \# D6 K  e8 A/ ]+ m
5 Z- U9 C, Z4 b  ?: W$ H! J" q
        }) J7 k5 D$ {7 P

- B+ X  c; b. |: i( c3 l        if(continuous[id] == true)) W0 L$ h  s- W

4 N6 m3 u! |' O        {
/ e1 R- J& X' q8 u% D+ ?
* M3 A- Z/ S+ J) T& L/ X  r                document.getElementById(id).style.color = newColour[id];                4 L0 n( t3 L5 H5 \! @' P1 M9 `- S

" |0 d  n( A2 C# r/ d        }
  `# h. G- k' N9 k
; P+ e# c* J" c4 N        else6 r+ H5 G' Q" p( G/ I8 |4 \

8 R1 {4 c6 r4 V; G        {! o( i% @6 k% z: V' y8 x% x5 @9 Y
9 g: U: G; p( J1 m2 n* m
                document.getElementById(id).style.color = hoverColour;6 {" p4 |3 K$ i; F* r

! g/ G7 o( T$ }+ p4 w# M        }
# B3 u2 u" {9 v2 S1 v0 S% U0 r
! G9 x+ p& U6 \# M& S/ O: K        clearTimeout(tID[id]);& b4 ~  l# Z8 D9 O; z9 g& F
" s: K2 |6 w) n+ w5 v9 \: A/ m4 U
        tID[id]=setTimeout('startFade(' + id + ')', rate);5 h1 ?# N& }& v5 k( ~

( m$ a+ j8 j$ Q9 U% k}, O) E, N7 c8 o- G
5 [5 ]! ?7 n+ B! T" B
function continueFade(id)9 ?8 B( G) n/ U5 N$ ]

# V9 n6 U* M7 M# R, l/ X& R{9 O0 j9 w# E! X# n% B- x

( m. s3 {$ K( d8 |0 \6 X& w3 H& L        continuous[id] = true;3 O, H1 Q5 s3 |+ v! a7 b( L) u0 F

7 ]6 A$ U3 p4 _- m4 n" R}
5 \( k0 [/ l6 o7 b1 N) V! J1 f  A& Z# N$ Q9 o  y( j/ K
function stopFade(id)
! Q! Q$ b0 Z, z" ~0 U  }& E  T& R, w9 z; g
{
$ G- Y# c/ z8 T" M+ t8 @% B. N7 D& j0 b/ U& N- O, P6 T6 l
        continuous[id] = false;
' b% q+ A, w. ^/ w; c( U' v
1 V9 Z( ?+ q4 e. A}
: K7 x. P; U6 W. y3 q0 I# }
% d1 U! }. w" W# rfunction StartTimers()" r8 e' z6 _. d+ M
3 L- G, N' G/ g' \7 ?
{        //set up an initial set of timers to start the shimmering effect6 c" J) y* G) I, _& W, j
* g5 b; W3 K& _2 T2 a0 R
        for(id=0; id<numLinks; id++)
0 P# C+ U( O3 b6 z  X3 J3 ]/ c! N0 z, h# C
        {
( {3 P* K: b& H  B3 V, v8 k9 c; ]# O9 o0 q' Y: o
                t=setTimeout('startFade(' + id + ')', id*100);
, r1 g# |& R5 n3 ?6 M" e/ y& h3 }1 D4 W; b" ~
        }6 C7 I, e7 _4 z2 g" L) Q
, s  Z! i9 Y" n' ^6 _* S
}
0 @. F% I. N# h8 e- ^+ h
5 \- ]5 z: e2 ^) [, d//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
6 _; ]- _) I2 Z& G% z+ C
6 ]8 g* G4 V; Q, ^1 qinitLinks('#FF0000', 6, '#FFCC77');
" i  u) k7 c' Y6 _+ ~( V5 z
2 K/ B1 E! h: s$ e2 M  q//-->+ I/ P9 ~' A3 `, v# K) l

$ c* ?# t  C$ O* `' J( n, }% U</script>
$ x" c8 W1 S" R" Q- w8 ~<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名:58元$ D' E5 @; D9 ?7 X
</a>; @9 b( I/ b' `. [9 o8 I7 `- q. j, E
<br>- [$ S2 W5 C; v6 h$ P
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名:110元</a>
4 j, e. A/ M- Y/ [) t3 g<br>8 w# u8 Z; L' w9 ]% w
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>* t; M: w+ x# @3 H8 }1 J
<br>       
' j- Q2 S- i: B! H7 z. p% ~<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>3 E: {9 j$ c# h! Z2 n" _5 x
<br>
1 B( e- K6 v/ O. j. I<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>$ n. I+ M- Q$ x9 `
<br>
- s( Z& Q2 W3 K8 {/ y, A<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>
% G' d3 ?) N' Q4 M6 F<script language="javascript" type="text/javascript">
9 q5 l2 Y0 d! b2 x5 }* C<!--
0 v' H2 l; ]+ N, }& GsetTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
5 ~  d1 G0 l! X4 u$ e- `//-->2 B* V; t" V) ~8 V
</script>

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