返回列表 发帖

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

<script language="javascript" type="text/javascript">
' A! Z3 G1 {; O6 D( ]% O<!--7 [: \3 M. D' F$ [) f, U2 L; }
// convert a single digit (0 - 16) into hex2 C8 I/ `) @0 {7 q
function enHex(aDigit)
! q) v# Z8 M. W& F{
, }' G) b4 A- X3 J& x    return("0123456789ABCDEF".substring(aDigit, aDigit+1))
- u# c! i3 M- W/ H- }, d}6 Q* ?% H# f$ `; V
// convert a hex digit into decimal/ Y4 ]! x3 H6 Z" z
function deHex(aDigit)
0 _$ I, L) f4 }( N4 K3 Z6 w; q/ @{
9 T: Z3 Y$ q; s# R* i3 t7 F    return("0123456789ABCDEF".indexOf(aDigit)). n" N! l% A1 g3 u- }$ Q$ m% v
}
9 r1 P% ~5 @& K4 X) I9 x# V
2 o; d, v- W' o* Z9 N// Convert a 24bit number to hex: ?4 s4 B8 t, X0 o
function toHex(n): q6 J* A* F- w1 @2 z* R
{% I: b* `5 q5 Y8 B; T7 p% A
    return (enHex((0xf00000 & n) >> 20) +
* C) w6 c" _, \+ U0 b; a( b/ F$ R            enHex((0x0f0000 & n) >> 16) +2 a. @9 L: Z: p4 `7 y% k' @
            enHex((0x00f000 & n) >> 12) +3 V2 ]! r' s! `; j; g1 k
            enHex((0x000f00 & n) >>  8) +8 o: ~* }/ T% u# Y
            enHex((0x0000f0 & n) >>  4) +9 z& E! d* t, m* ~
            enHex((0x00000f & n) >>  0))- k8 Z1 ^8 D1 D) Q! }+ d0 ^2 [
}
) I5 }) L/ W. L) j// Convert a six character hex to decimal$ z# L" R& M( y( O3 E
function toDecimal(hexNum)  Z; M3 `# S$ V1 I8 I* G$ y3 h
{- Q& M  M; Z) V0 W# n7 z4 b2 n4 C& s
           var tmp = ""+hexNum.toUpperCase()# l4 M9 M* n/ o
    while (tmp.length < 6) tmp = "0"+tmp
4 `+ _' E. I$ }+ }, P           return ((deHex(tmp.substring(0,1)) << 20) +5 a7 t. a$ `3 w" w
                   (deHex(tmp.substring(1,2)) << 16) + ) e" N% k3 ~) M2 M  A
            (deHex(tmp.substring(2,3)) << 12) +8 _; _1 j# {- T0 G
            (deHex(tmp.substring(3,4)) << 8) +( }1 r8 A( ^2 @- \2 ^0 Y( D3 Q
            (deHex(tmp.substring(4,5)) << 4) +
: O7 w) ^; L5 ?2 T% @                   (deHex(tmp.substring(5,6))))
" H. C0 l! h/ Z$ A+ x$ r}
. V  P' s0 O& c4 |& D: v* \3 ]6 }///////////////////Shimmering Links/////////////////////
+ R4 c1 C9 E8 O$ G& v( V" f0 q3 ~//global variables
' x3 x9 S/ y  a; {  `5 I% Z8 O; t' Avar hoverColour
6 y2 U+ ?2 w. C6 u  _$ K5 z+ z1 Ovar numLinks;- }! C! k+ j2 r7 ~6 ]+ |
var rate;0 c" y) V# W- a
var numFadeLevels;; J! u8 e- j( l5 ]! ]
var bgR;
% m' v. z; v: evar bgG;
+ ~# k( |. q: z3 X1 evar bgB;
8 L7 \& w9 T7 P+ Kvar currR;$ b9 f0 [# N7 N
var currG;
  B5 W% h9 E3 t, n8 Hvar currB;
% z. r4 m1 G8 N7 ~9 S3 Y& o/ ]: Nvar count;
9 S' M0 V  g2 C0 t' u7 fvar fadeOut;
3 Y5 h* \% C9 l# |8 svar continuous;) u( J0 f- K  g2 v+ y/ L& J* @% G. G
var newColour;( g; i# |9 a5 Q5 T5 B) b  B  R
var tID;+ D3 x1 S! e$ E1 w
var redInterval;
! d' n2 R4 i* R5 Vvar greenInterval;
7 K; u# ~$ T6 R; T! A# Jvar blueInterval;% {* K  K( q7 w8 s7 w/ C2 j
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)0 K: t; b: N; l$ ?- I* r# S& h
{
+ c9 g. u4 j! r* _2 W  V        hoverColour = mouseOverColour;
3 E7 |3 R/ H# l2 t0 n        numLinks = numberOfLinks;+ a, X% a: S. V: W! V
        rate = 1;
$ u2 L3 G) j- V7 W( E9 h% R, T        numFadeLevels = 30;
+ t$ @3 z, f/ g. d5 Z: c; y7 \        function initArray(theArray, length, val)
3 y! c" Z" ?: q' @        {
1 C3 X: l7 b/ V3 I                for(i=0;i<length;i++)& w- m4 ~, D* E, F
                {$ P& A1 N( V  L, c8 L
                        theArray = val;
9 N6 R' n+ ~- k# f                }
4 u# q0 {; Y) B; f0 y9 y# ?) n8 k2 `        }6 ~1 }) q1 p8 S$ U& k( L$ A
        bgR = '0000' + fadeOutColour.substring(1,3)' x5 C/ ~' ~( d
        bgG = '0000' + fadeOutColour.substring(3,5)
9 z+ }( L6 j  O& A        bgB = '0000' + fadeOutColour.substring(5,7)
) i* k  {; S- j0 L$ _        currR = new Array(numLinks);# d* g0 Q+ T" w3 T; I! i$ n
        currG = new Array(numLinks);4 `8 O, G$ U* B( t( Q& E
        currB = new Array(numLinks);
1 T9 k# |# L( G/ [4 u8 f  N        count = new Array(numLinks);
  c# W; T- |0 s# a6 m( M" j        fadeOut = new Array(numLinks);1 X( Q9 h5 Y. [7 i- _
        continuous = new Array(numLinks);
2 n1 K6 F$ N& A  o, J        newColour = new Array(numLinks);
: }) B( i) M5 n4 f1 M1 H$ j8 x        tID = new Array(numLinks);9 {. b- Q' ?% `0 R
        redInterval = toDecimal(bgR) / numFadeLevels;
/ w5 e' Y  s4 J* `; a        greenInterval = toDecimal(bgG) / numFadeLevels;
  u7 \) \$ ]6 Y9 t: [        blueInterval = toDecimal(bgB) / numFadeLevels;
( F+ b4 W$ S. o% _4 v* B: x) _6 G' H        initArray(currR,numLinks,0);
# D, G& r3 f/ G5 G: A  n5 [- s        initArray(currG,numLinks,0);
4 e4 w& n* ~2 i" F# r( i        initArray(currB,numLinks,0);
0 W: t4 D- h  L        initArray(count,numLinks,0);
, a6 F( [4 R" t' @5 U        initArray(fadeOut,numLinks,true);( q- Z5 X, M! u; k
        initArray(continuous,numLinks,true);7 m. l8 c9 }2 ?
}        ( N( G1 Q2 E- g! p9 t( T! w
function startFade(id)
% h3 Z8 ^. A  k0 b: @- M{
1 |2 y- `5 E# G# J        if(fadeOut[id] == true)
4 Q9 U( C! m' e        { /*move colour towards background colour (increment)*/
- }4 a/ j! `( F1 m                currR[id] += redInterval;
. m! H2 q6 M4 D; W                currG[id] += greenInterval;
! [4 [, K6 @9 M9 k# ^                currB[id] += blueInterval;
1 a" V+ z3 a5 K9 r  d' D+ ?1 S                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);% y& A- J  }, K9 n6 m7 u8 [
                if(++count[id] == numFadeLevels)
) E$ I& F' F6 n+ U8 w; N/ F" S+ W                {
4 Q9 R) T1 Q: L% M, f1 e9 {; r/ n                        fadeOut[id] = false;
9 p7 v+ E; q( m* V. _                }: ~9 x5 X  D7 y8 I
        }0 y# [) s1 R  f3 Z
        else5 F1 A6 ?) T! K7 L% B1 s; E
        {* X  }+ w! ^( v1 O6 s, W6 ^8 b2 |
                currR[id] -= redInterval;
. h1 m! P5 F+ c3 s* g" s. X. u# ~" f: j
                currG[id] -= greenInterval;
7 o) {5 [% m# t! U, n0 l4 b6 ?; l  w! r! n) o, R+ o
                currB[id] -= blueInterval;3 P5 }) N9 Z% x+ j

7 c1 f  p9 O9 v4 J                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);4 e* [* E( z7 b, [6 T4 \
$ ]* ^) ]2 m/ |+ K0 k
                if(--count[id] == 0)" q* o( Q8 `" R0 e

- r" n, M, ?& T: g' R                {
7 F1 I9 o; Y4 u7 G- F  e4 K, F2 ?% [: h! E6 N9 X: k
                        fadeOut[id] = true;
! y, W3 F: d- d, Q4 I% S9 E' w7 D2 H; C" A
                }1 A, a* x* Y/ p5 u! Q* z

& A" ^$ f! g* v/ y' q2 N        }- P, U! q! N' z6 `$ A' h
' ]% v& L8 W4 r# i, o: p, Z  T; U
        if(continuous[id] == true)$ O( o% i2 b' x7 s2 k6 e% @
% I; b/ U1 d# _) J: S
        {. \) p; O  L, w

& ^# }. @' S7 T! s+ [% v7 f1 R. j0 K# R                document.getElementById(id).style.color = newColour[id];               
8 z. }; m& D) f0 Q. A( V4 V) a9 @8 W9 ~
        }) g% N6 q& Q) G5 x8 j

) v, p' d) K! h/ G! s$ k: `) H        else7 B: j# n* m3 [0 Z. U# H) G! d

5 N% J$ p' _, n9 N% Y# ]        {5 G9 ?7 O5 s4 z4 {  o, S1 Z

6 ^( J* N- }! i- @2 s( v) K                document.getElementById(id).style.color = hoverColour;3 p* e2 j' S& h# m4 `
5 q! n- q- B% u1 n- m
        }
; }, R8 f$ {) ], _6 Q% X& ~
0 W9 O# A  W" z9 h% m" M: I        clearTimeout(tID[id]);
! H% l$ t! E( b! p9 ^0 _
, @( h" z2 ~0 F: e% }7 d' y        tID[id]=setTimeout('startFade(' + id + ')', rate);
0 ?# d) ?- a; T) y$ R
. h( x. V8 b. r}- L" Y% r8 c4 y0 J

' N8 T( u4 {+ M# P0 T" Rfunction continueFade(id)
( i% y! W+ V6 n; g: i8 q- }! s3 K) F( c/ `& b9 r' l
{
0 D; v5 q/ w, d" S4 T5 t$ D+ D2 X7 d* @) X
        continuous[id] = true;0 _' M1 m1 g3 }: ]* v# S: u4 s
* ?, r3 S( T5 R# Q* [2 s/ M
}
2 w0 y' G/ }* U/ ~$ p& [6 Z
! i) s) O: T: t) v' e) G* Hfunction stopFade(id)
. Q, v8 U% P. j6 \: _( P+ }  I# Z! N: b. x! C
{
) c+ B' o! N5 s7 C1 K' I5 ?' e7 H' ], B% w8 W: Z  ?+ n
        continuous[id] = false;; a/ w" P$ @: T; m* F5 Y6 V

) S; h! B4 L: C* E- s5 e}
8 p' V0 g7 T- c0 j; r1 ?, Z* b% Q# y) b; R/ O) k6 b' G. L3 W1 D9 w
function StartTimers()
  c! \+ {8 |7 Q. b2 u; ]1 M; d8 w2 E. e) q
{        //set up an initial set of timers to start the shimmering effect. t2 H; W( c! J# e( F0 {+ U7 f
$ A9 A# v6 ~/ s( F, E$ a4 @/ S
        for(id=0; id<numLinks; id++)
5 }2 u& z% B$ n" B' v1 d" u( S8 N7 H. t& c# Q
        {
3 z9 E' |9 J5 W) s9 Q. F
+ }; K) s: \* \& W% V  I                t=setTimeout('startFade(' + id + ')', id*100);9 c9 D6 m9 a9 r5 b( u6 j3 |
( T- d1 m. I3 `7 K3 n: ~7 q
        }6 U5 M3 g9 @4 t3 B7 f

0 j4 d4 M6 n6 _; z$ I+ L* M}+ N1 @9 ^1 i3 n5 B) V* Q5 R: n: D' O

4 c  {6 o4 l* q8 T//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')# b/ |9 W, N6 f2 R$ ~
' T# \8 X1 b* _3 l
initLinks('#FF0000', 6, '#FFCC77');& Y6 b7 M2 y' E; ?, q
- [( B7 l) E/ p0 [+ F
//-->8 p* W- P7 `  H- G9 N
( ~. w( q7 ~: r+ @# z. H
</script>* q- Y3 X( n6 x. {4 o
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名:58元) j1 E, d: H5 C" f! z: P/ V
</a>5 h( R5 b( }3 B1 Y' K. `, M
<br>
: |& |0 a6 |" v! z<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名:110元</a>
- W" U3 B7 C% h1 _8 d( X) k6 E8 r7 c<br>( v+ n2 w" o$ k( w
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
0 \1 d: S  R  y) {" k' N: |- z- ~<br>       
; m7 J, g: _% N4 h<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>4 D8 E: P% r1 O! e
<br>
: G4 E8 `% @" _( k% M4 E) R  M<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>6 U5 q  w5 D: J: ~( s3 \
<br>
& O, o$ W' e0 |9 [  m  x8 k  P6 Q+ B<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>( }, u" P" F4 g# D' r
<script language="javascript" type="text/javascript">
6 f5 c8 C0 {% d<!--
  j/ t3 ]0 B) k' U" E6 D. KsetTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
5 ^8 Z4 o1 Q- I- D' x4 L  F5 S6 x) K//-->
# u/ q+ d9 N/ ^</script>

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