返回列表 发帖

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

<script language="javascript" type="text/javascript">% u- X7 r( o9 H# w$ B" g6 F/ e, l
<!--
+ s6 [/ ^5 D0 }% z. x+ Y// convert a single digit (0 - 16) into hex
# w8 B+ y1 `' P( Q0 Efunction enHex(aDigit)
& i! N: s0 _9 ^$ v7 S# R{' U! d6 l3 [- c# A# `6 w
    return("0123456789ABCDEF".substring(aDigit, aDigit+1))1 t& p0 t/ R4 d/ X) Y9 x, F. E  @; \
}. Q- Q7 h2 U) G1 F( r! b
// convert a hex digit into decimal
3 l* b2 T5 m* `( T: afunction deHex(aDigit); e6 ^, {3 ?" k; ?& ]/ x) k
{
+ j, n- d9 I3 d  B  C) s9 c    return("0123456789ABCDEF".indexOf(aDigit))
# S! e+ x( H* E$ e% q* u& v6 T}; P3 [; [0 n+ A* E6 T, M+ d

0 _2 B! E, T- `: Y6 F8 F// Convert a 24bit number to hex
: b6 C& ?. V* w/ L3 cfunction toHex(n)4 \8 m- H/ ^6 B$ V& n& D) h' H
{
2 {$ e# N8 B( n1 A2 `    return (enHex((0xf00000 & n) >> 20) +& C* i- v; v- v% y  y' F8 y
            enHex((0x0f0000 & n) >> 16) +
  F5 Q; V; ]0 ?7 S1 ?' A# a7 ]# Z1 ]6 w            enHex((0x00f000 & n) >> 12) +
4 i2 x( Y( w* g1 d- S8 \            enHex((0x000f00 & n) >>  8) +& j4 ?  W7 T3 M7 N
            enHex((0x0000f0 & n) >>  4) +
0 b8 ]2 e* |/ K0 Z4 K# u            enHex((0x00000f & n) >>  0))' a) T5 f5 H, {3 a6 n
}- o! _9 A( @4 |
// Convert a six character hex to decimal$ V. T7 d' Z. r, _+ ~
function toDecimal(hexNum)
$ b& X  t# W% K5 k+ t{3 U$ \7 y  v2 [/ B' F- O: J' C
           var tmp = ""+hexNum.toUpperCase()4 U& z. y% ]# f. n
    while (tmp.length < 6) tmp = "0"+tmp9 ~: z! R/ z9 ~! K" P' \5 \: g9 t; h
           return ((deHex(tmp.substring(0,1)) << 20) +
. r( }9 f( v* N( X' X0 ~                   (deHex(tmp.substring(1,2)) << 16) + : h* H6 A# j- C) L
            (deHex(tmp.substring(2,3)) << 12) +
! o" ]+ E# B* T1 b) {            (deHex(tmp.substring(3,4)) << 8) +
( k5 B; J( f* F  J            (deHex(tmp.substring(4,5)) << 4) +
/ }% x3 U6 L3 A; O                   (deHex(tmp.substring(5,6))))
: `! ^+ F, X6 c0 V' u2 d$ N. d; }}8 w" F$ B% x# w' j- C: Q+ C0 b
///////////////////Shimmering Links/////////////////////5 I" Y* T. U; k9 l4 J
//global variables
+ {' H; v2 o3 `7 u$ B0 ]8 h3 A& c. |var hoverColour( x2 X. B( z2 N- ~0 ~3 Z* p7 v
var numLinks;
$ z4 n9 W0 D% ?6 h' Ovar rate;
3 ~0 D* h* d' tvar numFadeLevels;
2 e- z. U# o  w2 B# uvar bgR;
4 {/ k- v4 z1 ]) ~var bgG;6 Z2 ~% s2 x8 Y3 L  ^
var bgB;, c- Q4 X2 P* ]  X, z1 I- B
var currR;" H* y0 M$ t/ t6 @5 q. c' J
var currG;
! G1 f6 B7 `/ A9 y2 s# xvar currB;  ~* v) z. \$ h9 g) Q4 ^' {9 m. P
var count;
$ u0 Y% H# b$ s, @" q* w$ hvar fadeOut;0 y4 |8 w5 T3 Q3 o$ X; k* Z- u
var continuous;5 D0 m' ?4 z0 B* b/ S% Q2 ~
var newColour;# N; K: C8 H! {# X4 ?
var tID;9 U5 T3 O9 h* r) g
var redInterval;. w' F/ A4 D3 G5 x% r7 l
var greenInterval;  @$ O+ l& B5 q& o1 m1 T$ H: D
var blueInterval;
) R6 H  Q7 j8 l8 v/ B8 ~" ifunction initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
1 k5 W! ]3 o0 e" C/ P! J9 w% O{+ J7 U3 z/ g* Z7 D1 l
        hoverColour = mouseOverColour;/ `# Q2 o. [! d" U' Q: W/ _
        numLinks = numberOfLinks;
0 ]* h  C  U  [        rate = 1;
( f9 H6 F/ _; c4 I: M9 p- T- U        numFadeLevels = 30;; c( {  s5 B1 h3 H, g% K
        function initArray(theArray, length, val)
- P. N5 ~/ A2 e  }        {1 @9 M4 d0 Z$ l; i
                for(i=0;i<length;i++)
# D" s, u$ K& `5 p( U% d                {1 X* B) |; B8 V) p3 X- S0 v
                        theArray = val;
% `: e3 h( {# F: R                }% _& q1 x: |. b: f  s* X9 E/ e2 i3 `+ B
        }
" H2 n# P* @, f! ~: m. o8 e9 T% ]        bgR = '0000' + fadeOutColour.substring(1,3)
; d# `" ^7 @6 s( Z  k        bgG = '0000' + fadeOutColour.substring(3,5)
! u! w2 q7 U$ P" n7 ~+ ]        bgB = '0000' + fadeOutColour.substring(5,7)
9 Z2 ~1 o( d5 {, X1 P        currR = new Array(numLinks);
4 c, m5 \' X4 _3 |: b& v        currG = new Array(numLinks);
5 Q% r+ v% L' L& W9 ~) [2 k        currB = new Array(numLinks);0 A5 a5 U" S' k9 \' }: o
        count = new Array(numLinks);5 H( M- K% c% F& A2 t$ A" P
        fadeOut = new Array(numLinks);
' d  b7 J. d! h8 ?/ l! o        continuous = new Array(numLinks);
- g7 m/ a$ Z' R9 d7 p1 W9 H        newColour = new Array(numLinks);
# r' t5 U5 g! J& H7 L/ x        tID = new Array(numLinks);' H8 S3 j! t/ {8 b
        redInterval = toDecimal(bgR) / numFadeLevels;
# y3 G' M5 u8 K; Y- G1 P) P" R& Y        greenInterval = toDecimal(bgG) / numFadeLevels;2 F% V5 b+ K  c
        blueInterval = toDecimal(bgB) / numFadeLevels;+ Y  k$ ~8 B! g* S. z
        initArray(currR,numLinks,0);
# |8 `! O- r) c: y        initArray(currG,numLinks,0);) p$ b6 y1 i* Z
        initArray(currB,numLinks,0);! n! E. q5 r8 X# {1 l6 X
        initArray(count,numLinks,0);
1 ^% L" p. O3 `( f' \        initArray(fadeOut,numLinks,true);
: S: |! j6 K& x) E1 [' [5 z        initArray(continuous,numLinks,true);
1 \. c5 T" ]+ t. X  d( e}        + Z( r) ^% M8 z' `) W
function startFade(id)
' @$ E. H& S+ W# B1 @4 h{( |& C1 I' l: W& D' _, {
        if(fadeOut[id] == true)) \% D) N" L- Y5 D( u. y
        { /*move colour towards background colour (increment)*/9 ?) c+ A( |/ }9 X( ?
                currR[id] += redInterval;: c' t; Z; g' J, b5 J' \
                currG[id] += greenInterval;
3 W2 S1 k" S7 L. T, [                currB[id] += blueInterval;
/ I0 v  j( U7 h                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
5 l, v1 u; Y/ |4 _* M& u                if(++count[id] == numFadeLevels)' ?0 _; }$ R7 A, i  E# q9 l
                {% c8 X4 |: v! p4 |
                        fadeOut[id] = false;- ]7 M  _) P3 R: [. {) T# j$ V6 o2 E
                }+ u0 q8 s3 S0 i1 M: r* E9 U! t
        }, W3 m/ I5 C4 m2 \/ [4 |% V2 }
        else
4 x7 M1 _2 K$ Q        {8 a# T. J* ~# X) i5 M* N
                currR[id] -= redInterval;; X& O, _: V# ?7 w- ?

6 q! ^# I" x. w7 t$ F0 _  Y! r) Y& v+ [                currG[id] -= greenInterval;) T8 r" x5 a5 K- G
* d# W6 m0 Z/ U" X/ N2 ^5 A
                currB[id] -= blueInterval;
3 k/ i, N7 Q: P; I9 d2 p
( _" W3 m; l- ?: K' H3 w8 y/ E2 w& X! m                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
" {1 l( ~! X  x. q/ A0 j. |0 K. W0 U) [9 X$ g( ~5 L: ^
                if(--count[id] == 0)) C( Y7 e; j+ [

% J% p  C7 b- ~0 W                {
- f3 v& t1 l; g# @& e0 Y( L
& _+ W: d0 e. u1 G                        fadeOut[id] = true;; O  S% z4 B- ?) y
3 P1 {7 j3 _5 E! m' w" E
                }
; O0 d3 H$ M$ I- `+ m3 {8 ^1 I. y/ Z. l& A( y; L
        }8 K4 Z" C. B. \4 Q

* L( W; }. P5 z2 s0 a6 v+ q- b- k        if(continuous[id] == true)
& ~+ ~( R/ O' h
$ x6 B& U7 g( i( C- W1 t3 K        {
) H% o7 w" |/ h7 v. V0 v" ?5 k, X+ b. U' i" D
                document.getElementById(id).style.color = newColour[id];                * y' x: r  ^# z- c  }3 V
+ l2 S0 H; B/ \; w. y
        }, Q/ {: h. w& B3 \1 X+ ~; @4 O4 L

" ?9 V: h7 o& D5 t        else
3 k9 E+ O% C4 F3 C* U1 w( T
4 @8 S. y: _& j4 _& v. c" ^        {
3 P. B% J8 `9 W" W& {$ |1 s
% |5 g6 v+ f6 z4 h% x  E  L+ T                document.getElementById(id).style.color = hoverColour;
( [$ @2 X( U+ l' J' o
& F% ~' q0 O! \; M1 W$ z- }3 O        }/ s, \, P+ ?+ ]% S' F, {
3 X  @% o" @0 B
        clearTimeout(tID[id]);
0 U. Q% Q4 y% e4 L) S3 v1 F
5 I6 i9 U! d( W6 W        tID[id]=setTimeout('startFade(' + id + ')', rate);
" y2 x" U) o# P! L. A# n/ i9 T- n
( ~/ M) H) C& x/ z- ?0 R}3 I4 }" ?8 S0 y: |. ]7 @
# Q. I3 d3 A" q9 W4 H2 _" \; O* U
function continueFade(id)
0 Y' O! H) l$ E! o. @/ a; v. G& I' r
{
, ^3 b) ~3 x+ L0 ?5 F4 d4 e
8 F7 u2 z/ J& Z& X; `; E9 A( H7 S+ K        continuous[id] = true;# t. q9 Y4 k2 |5 T" ]/ ]
4 B) a# ?) R9 \$ {7 |0 H
}
  n8 @' W3 ?8 O7 a  r) J8 v7 A. K0 T+ b$ \9 q9 D4 A
function stopFade(id)
% s5 [' [7 ~0 `0 ^" N+ p8 J
" c( C' w1 ]& u3 f: j' `{
, R1 a% X0 w* P8 ^$ d% w) x  Q2 Z8 @) A; r$ J1 \
        continuous[id] = false;
( l. e( ]  j+ c7 J  n# b* z( v; P& Q+ j& p
}
, A; r- F, N0 @8 [. @2 }- ~( Q' P' I* Y; \! f8 E& L
function StartTimers()) c3 }1 {9 }  [; v0 h! a3 g7 I

& a8 x& S1 x; M1 I{        //set up an initial set of timers to start the shimmering effect
% g5 o8 b5 p& e) s+ j; w0 U9 |3 _  i/ d
4 I' O6 `! c; V6 @        for(id=0; id<numLinks; id++)0 t) \0 I/ t% N. Z. d9 z9 G, {

6 N/ E" r' a% ?  [        {+ e( [$ `7 P2 x; l" Q$ f0 J, D
2 o1 v5 l% L1 X% G
                t=setTimeout('startFade(' + id + ')', id*100);
6 w! i1 u3 t% S- i+ S+ @$ p2 a
/ F$ g* H4 u' Y; n7 l        }; E7 E' i! J; k1 l' F2 Y

3 C7 @5 w- O, `! L# }}
+ g3 ~; ^" m8 i) J! K  u) b! e: L( f/ I% `  Q4 {
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
9 Z' [+ d* K6 L$ a) d4 Y! W0 S4 R5 s$ Y- r
initLinks('#FF0000', 6, '#FFCC77');
: l8 [+ R2 a2 j8 x0 r% a. b( Q. G. z: L+ N/ [" U7 S  D6 Q* Z2 d5 x) y
//-->
. c# E# J1 E* N  l
. Q# T7 T) ]! S5 |/ Y</script>
! {( Q1 u) o5 _2 L! R<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名:58元4 Q3 }7 J3 ~5 T" N( y
</a>
' B/ |& h2 P( T2 N1 P: T0 _<br>
) P7 f' n; d5 z2 d<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名:110元</a>
, h, d4 h% n) j; r+ I( r5 g5 w5 h<br>
; l: r3 V4 ?6 H' b5 J  M5 Y9 k<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>6 K+ X2 x& ]* P. P/ h
<br>        0 A3 f+ d% E1 ^  s9 F+ x
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
' Q& p# J5 d5 z2 I/ z- b# T<br>
" ]* k( b' v' Z. g; E8 [<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
6 @& l) Z. }2 b2 u6 |<br>, ]/ l0 l/ R0 {8 ?- a2 L
<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>% P) g* }' J& r, i' {
<script language="javascript" type="text/javascript">4 Z) u" D8 ~5 P4 B! H  w& m
<!--
# R+ i) ~( G- P+ J6 p$ HsetTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
0 C' F5 a! V# E- m: q5 L6 y& v//-->5 X; B7 r- |: Y- m- r! W
</script>

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