返回列表 发帖

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

<script language="javascript" type="text/javascript">* K  o0 C# z5 X
<!--
1 h9 @: V4 Z& l; E8 T0 g! Z$ O7 i// convert a single digit (0 - 16) into hex
; `( N: s. i4 f% o) Y5 Gfunction enHex(aDigit)6 N- ]. {0 s& n0 y$ P
{2 G/ ^! u8 U( u0 K2 O. G! P
    return("0123456789ABCDEF".substring(aDigit, aDigit+1)); W9 R4 j7 W* t/ Z
}
3 t- j  O6 ?( |7 b( E" i* @# u// convert a hex digit into decimal
' n5 I3 r' @! _! vfunction deHex(aDigit)* C( O9 a- H1 p: T: ~! p2 N! M) c
{% P) y2 Z1 o6 |
    return("0123456789ABCDEF".indexOf(aDigit))
$ D( f3 f4 l, l" Z( Z( X}
) u7 ^6 S6 g/ C* j  H5 g
  t5 T- E2 x/ A( W) `+ D// Convert a 24bit number to hex# S& V4 z* l+ R/ [5 f
function toHex(n)
3 y& D8 _0 e( q{
- e/ ^4 d0 F# Y* ]    return (enHex((0xf00000 & n) >> 20) +
% e, Q( N4 S& {            enHex((0x0f0000 & n) >> 16) +
( g  _5 ]1 Y% E5 d: j* v            enHex((0x00f000 & n) >> 12) +3 Z0 P( c1 J9 k
            enHex((0x000f00 & n) >>  8) +
! _  o& G8 ]0 j7 L            enHex((0x0000f0 & n) >>  4) +
( ?4 V0 _4 R# a0 K            enHex((0x00000f & n) >>  0))
  @) R- v5 t# T& F! F}+ M( h0 c$ I: }1 F* @
// Convert a six character hex to decimal
/ K7 Z( c* b3 }3 Q/ t. hfunction toDecimal(hexNum): P+ ~1 i& C" ?( Q5 N3 ~
{5 w8 x7 ~5 N- B, a9 A
           var tmp = ""+hexNum.toUpperCase()
- K. b! }) |! N" V* Q, v& E    while (tmp.length < 6) tmp = "0"+tmp3 @: T" w& W2 a3 m- R
           return ((deHex(tmp.substring(0,1)) << 20) +/ r* g6 P  x0 D; v6 n
                   (deHex(tmp.substring(1,2)) << 16) + ( K; J7 `( i5 v
            (deHex(tmp.substring(2,3)) << 12) +
- G; N  i/ k! Z3 ~9 T+ b4 r/ i) K            (deHex(tmp.substring(3,4)) << 8) +& M; ^, \9 q; m( W
            (deHex(tmp.substring(4,5)) << 4) +  x0 I# z+ M( P
                   (deHex(tmp.substring(5,6))))
/ ~' }' R! y$ B/ N% ]) E}5 r8 d& j: ~; r' t4 z% J2 K
///////////////////Shimmering Links/////////////////////
0 G- \6 E+ |( k8 H//global variables
. l* b0 u" ]; nvar hoverColour& e  z0 v* _1 A! U% F/ }
var numLinks;+ [) c9 D0 q; U
var rate;
" G# W: Q" T0 ~8 z. X8 ^var numFadeLevels;
/ p8 o4 Q9 ^4 bvar bgR;: l9 Y+ J# B: n3 G: |% X. a) @3 a
var bgG;
1 w" x: p# `- u. k9 H- avar bgB;9 Z# r  b5 n+ `& e; w5 F
var currR;
# x1 x7 h6 l8 M* ?2 zvar currG;
2 O( L0 |$ Q. j3 G1 nvar currB;6 t! {0 b$ ^2 W3 L+ z8 r3 K1 C
var count;
: y" w5 J4 y- m6 w" M2 {var fadeOut;7 f; s9 K" _8 [5 b. l; O
var continuous;! B& o& n! l0 i8 z( H
var newColour;2 m4 E( ~+ U1 [; S% Z
var tID;/ M5 y) t) G9 T) S
var redInterval;6 Z# `( D+ z) P8 m, I. Q2 s5 T
var greenInterval;
# M" ]5 W* a: `$ j' Q8 v/ qvar blueInterval;. ^& L3 L9 `( F( d/ C
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
) e- d8 k4 h2 l: q{
* _/ T( n4 E. p        hoverColour = mouseOverColour;2 @7 S, Z* c# ]$ o4 T. @" e
        numLinks = numberOfLinks;
, w3 p( G7 r3 W9 d        rate = 1;
0 r( p+ J3 M; w; e        numFadeLevels = 30;# |$ Q. ^4 y7 M( w, y5 c
        function initArray(theArray, length, val)' r7 x( c- Z& k
        {* e7 _3 ~2 e3 f7 M( N
                for(i=0;i<length;i++)$ m) X* x; U9 \! |8 h; C
                {0 M7 B& p- J" w6 Q
                        theArray = val;: u1 {5 ?+ A# [- z7 J! Q
                }/ B. F, B9 _0 D' |2 b% V
        }/ \& [& G% p3 I2 D) X. y
        bgR = '0000' + fadeOutColour.substring(1,3)
6 {' |1 l6 {: O, v5 M        bgG = '0000' + fadeOutColour.substring(3,5)& q; X! l' y( E- R
        bgB = '0000' + fadeOutColour.substring(5,7)
3 G$ H  C) H6 {5 P- D3 J0 {        currR = new Array(numLinks);6 v. B5 Q  H, r& R! z7 d) U
        currG = new Array(numLinks);
( g( T0 F/ b3 N0 m$ }: {1 }        currB = new Array(numLinks);" v, n% M1 X: i
        count = new Array(numLinks);
. g7 X% l+ u2 z$ h4 L8 H; @7 k+ J        fadeOut = new Array(numLinks);+ |8 A5 f: S: z' S& w
        continuous = new Array(numLinks);+ m! I3 ~) l# y& u/ m& U6 I2 }
        newColour = new Array(numLinks);7 B2 e  F0 p0 ?' o1 s1 l
        tID = new Array(numLinks);* k  n' Y9 O5 |# V9 I" d
        redInterval = toDecimal(bgR) / numFadeLevels;
6 v$ I1 A' o% b! n) W        greenInterval = toDecimal(bgG) / numFadeLevels;
% o. l1 x  j# A1 V5 E. j; i        blueInterval = toDecimal(bgB) / numFadeLevels;, X0 ^9 C+ }; s0 z
        initArray(currR,numLinks,0);9 v8 A% ?/ G0 c" K4 X: ?
        initArray(currG,numLinks,0);
& _* d- {  I- l" M: x. r; ~        initArray(currB,numLinks,0);
# v7 y. L' m4 s& F- w        initArray(count,numLinks,0);
( p; ~2 j, w" ]5 l# r& W        initArray(fadeOut,numLinks,true);
0 ?. k4 {+ d7 K        initArray(continuous,numLinks,true);
+ J* x: P% `+ o4 W8 L" M9 `}       
, A5 t. ^) H4 q4 ?' a+ B8 Tfunction startFade(id)# h7 h5 u2 o0 _5 T' d
{
. f; x6 l$ c7 q* R$ i! \        if(fadeOut[id] == true)
, ]7 o* m' [1 ]. P9 ]2 n4 M. ^, P        { /*move colour towards background colour (increment)*/( }& o  }8 [( z* h" b/ C5 j8 @/ I
                currR[id] += redInterval;& b- J: z9 x8 O. z( u. \- L
                currG[id] += greenInterval;: E& ?6 a! V$ I5 `- P8 `/ e9 t
                currB[id] += blueInterval;9 z2 d# Q# Y: X5 e" Z- f7 K; W
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
: K/ W/ s. F% z, ^) K9 S4 z9 ~5 W" V# k                if(++count[id] == numFadeLevels)
" y$ e, @+ V8 R' v. r2 g  ]* t                {
/ `& D8 y- s- m. f: u2 U                        fadeOut[id] = false;
) e) s- R% s: b) o  R                }+ `/ D7 V4 W' Q
        }
" p* f2 g+ @* j+ U. |5 \        else
  A$ M2 |3 ]( H/ [9 }/ Q: E. R        {' C; t' p  k( O2 a
                currR[id] -= redInterval;
& X) O9 a  s7 [! j
3 x# n& K7 k( b; p: N                currG[id] -= greenInterval;
% T# a. n% }  ?4 t6 [
  C3 H, N; w! y" z                currB[id] -= blueInterval;- z  @3 T  w* A; ?5 F% b

  w" O: g, {5 k+ P/ B# [                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);0 e# [5 v  E' Q5 H4 q2 l. h

0 V& `8 \6 j; Y: M- H) v) N                if(--count[id] == 0)
& g1 l$ N$ Y: D2 E) `, U4 ?
( w, c' H; Y9 s* j+ }/ s! Y                {$ X% a: _9 ~) s0 x5 j

# k& z& h. t! G$ v                        fadeOut[id] = true;
1 o% R' q% x' z! c- x, r$ C) X
0 t, j( R; R3 D; n7 d, h5 h$ z: {" ]3 W                }
+ l) c. Z. L( N8 h1 N6 r2 ^' s5 \1 e: R/ r; W' g. @
        }! }# _5 o8 h0 p+ h
# U9 J8 y2 a4 H* ?2 f! Q
        if(continuous[id] == true)( B- J: `' W0 F% \# m7 G5 J

+ ?5 b. M* o9 A. T- ]5 i        {4 V0 U( m1 M" H' s' u# P4 K8 I
( _+ D) n& J' N( {' q# x; w
                document.getElementById(id).style.color = newColour[id];                ! [/ y; u/ ]" _8 t1 Y$ c

( P3 T( }, D% ?4 v; l# o: M) y        }5 c9 c) Q7 W4 d+ q7 {# q

& W- @: n! x) `$ P# O% I3 ?2 T. V        else5 ^$ R8 f9 O) `1 B! s' W

+ P3 ?% \/ w  I( R        {$ [" P0 v. c4 @1 s  X! R; G

, x( T# |; [! Z* \8 P  M                document.getElementById(id).style.color = hoverColour;$ @& U4 o' V2 w/ U2 F; I* c/ C

, J* A) C8 ^; q& T        }
6 }; J+ y/ Z  F5 H# ]
3 d0 Q3 U) ^. Z$ r; u        clearTimeout(tID[id]);  p# N5 k2 N: r4 I  o: o

2 }% C4 Z" F- t. m. F: N& o  g        tID[id]=setTimeout('startFade(' + id + ')', rate);
. j2 t7 m7 [( q3 H9 H+ H/ k/ b4 A4 D1 H; v: X
}. ~4 ^  d4 Q5 Z; W
( Q4 F) z+ w" {, U) [: J* x
function continueFade(id)2 k* e4 i" C6 E4 [

" W; w5 H$ E3 ^8 c{# S( h  k! `  j

4 g$ m2 |! S  m. k4 X- D& u        continuous[id] = true;& q/ H3 R3 _: s. m& {

, o" I. K2 j# H+ |}: h4 j' ?# y. n% u" h" N/ X# c

( {4 O# ^6 q. L- G. ?8 M5 xfunction stopFade(id)/ C% ]; x, ?7 k

# Z* W: E) J. U! A$ \" B9 x+ t/ H" D{
" {& C  C! x; t: O$ J; H. A0 I3 z! {6 }( ]6 \6 g0 N
        continuous[id] = false;
6 G9 p% c  p/ O! ]+ U- H0 w
. z% R9 e3 n- @3 P  }}' ?% v' W- a# r& c' j
4 f# P* f8 K8 x- T, N6 O
function StartTimers()" X% T8 j" E  U! B

9 s" ^5 D  U/ Q1 }) [  A1 g{        //set up an initial set of timers to start the shimmering effect( U' k1 O- e, @& S' H
  m* C+ p+ l# w4 b, J
        for(id=0; id<numLinks; id++)
, p- e5 K' \# u2 E4 R
! D5 c: b5 K) _: R, X        {- j5 Q6 Y4 L3 L9 _1 V
6 h8 ^$ b* w8 v0 ~
                t=setTimeout('startFade(' + id + ')', id*100);6 T+ R' E& T; y9 n4 g. _1 O' w' |
+ z8 K/ w' y8 ~4 C& a# A# R+ X$ C$ V1 W
        }
/ c$ O% ?7 ?/ e& Z1 \% ~5 a0 j; x$ S: M# m; d: ~8 s
}
( ?" T# W8 s# V1 o! B0 Q* X' u. x0 S$ A9 d. L% C3 {! z9 O9 z
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
' o. S+ u$ k) x2 j9 ~' F7 B/ _& g( E
initLinks('#FF0000', 6, '#FFCC77');
: Z2 p5 O9 t$ ]0 o1 l8 j% }! o6 |, O$ ]0 c3 B
//-->
  v7 H0 q# ~: d/ W% {% m
* ]* U9 f$ _. @+ w/ \</script>3 A9 }3 Y( q: `/ W) R
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名:58元. M1 L- y  o' b
</a>- j8 x9 U0 t- E
<br>9 j- r: O5 }/ f. ?9 M. F
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名:110元</a>
* |0 E; u( i* d$ F+ O2 C<br>
. _8 E8 {5 F; O# }4 J* J<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>& G' p3 j" Z' W( Y- f5 r7 _0 x
<br>        0 h7 u! n$ l4 g  F$ w$ @4 |
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
" ^8 [4 S) _1 M5 T<br>
/ N$ r; _+ \2 \" v6 P<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>* P3 N# O3 R/ I3 t# @+ G
<br>
! \$ \; V3 s4 `) g3 E) s<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>7 i5 j: T2 G( o% j8 n
<script language="javascript" type="text/javascript">
' A" H1 n5 j4 f  g<!--
4 z; M, L( ]+ n8 m% p7 C* k# [setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
/ ~$ G& l$ \5 t3 I; S( g0 H! S//-->' s7 ]" L/ m( Z' `9 v  R
</script>

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