返回列表 发帖

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

<script language="javascript" type="text/javascript">
3 U, i' K; `* [+ n& p8 V% ], J<!--
! ?0 Q7 m: o5 w! ~9 Y6 u// convert a single digit (0 - 16) into hex3 W% B3 A+ i+ R
function enHex(aDigit). o, p" j  `4 h( x
{
7 s3 D( p5 l# Y2 E    return("0123456789ABCDEF".substring(aDigit, aDigit+1))( z1 b8 Y' y' l9 j
}7 D! a" L6 O/ h  Q$ E0 |
// convert a hex digit into decimal
$ j* c, m" \( L5 Rfunction deHex(aDigit)
( \6 R* E/ f5 U7 V) K% |5 a{$ @" r& B' r% J
    return("0123456789ABCDEF".indexOf(aDigit))' ?4 u" \; W* s% d0 `
}
( k; a1 s0 R5 k  ]+ i" j3 e% X5 k& P+ M- Y& r7 ~# @* ]& k! A
// Convert a 24bit number to hex
" |, j- ?5 }1 R2 t4 e  lfunction toHex(n)5 T7 n; a) p" W6 o; ?0 Q0 W- v( f2 g
{
  f) S" x$ }; C  B: H. l7 d    return (enHex((0xf00000 & n) >> 20) +: A: |- p2 M0 [% g
            enHex((0x0f0000 & n) >> 16) +0 W2 P2 G/ r& e( ~0 ^; p6 L
            enHex((0x00f000 & n) >> 12) +
8 c  X0 _" d# L% f6 A/ b            enHex((0x000f00 & n) >>  8) +
* l7 S8 y; ]* h            enHex((0x0000f0 & n) >>  4) +
" J6 Y4 n' R0 u- @, Q, m( G" H            enHex((0x00000f & n) >>  0))! Q5 Y7 [3 Y0 E1 N/ Q
}
( z, u4 E6 V3 W, [// Convert a six character hex to decimal
& P8 F) d4 t4 {3 I- \- [- x# j* Afunction toDecimal(hexNum)
! q0 x* Q0 ^! {/ `8 N{7 ]5 W$ p9 b2 Y# c4 C5 _( [. l
           var tmp = ""+hexNum.toUpperCase()
! S" o3 D# _- F* V* _    while (tmp.length < 6) tmp = "0"+tmp" q' w' y$ R! c
           return ((deHex(tmp.substring(0,1)) << 20) +
3 r+ {( s  v7 ?2 j( d                   (deHex(tmp.substring(1,2)) << 16) + / y% W. O  U7 ~4 G4 Q) i3 h& |
            (deHex(tmp.substring(2,3)) << 12) +
$ l8 i- k3 q& S# q            (deHex(tmp.substring(3,4)) << 8) +" f4 c; c8 E: V3 s: ]9 i5 L7 [' o1 F
            (deHex(tmp.substring(4,5)) << 4) +# h1 I: F( w/ V0 q
                   (deHex(tmp.substring(5,6))))+ O0 L/ Y6 g: l2 N1 n/ f/ M
}
# k. Q! X& J/ {: f8 z///////////////////Shimmering Links/////////////////////
# I8 ^/ P  T* O* {2 l//global variables( u- i1 k; M3 y2 ~; h
var hoverColour
& u0 i, D+ Y( i/ J" @var numLinks;
, f" W- o) H6 s9 @( F$ ovar rate;
6 q- B  u7 ~7 S# }# o! D# }  k# Gvar numFadeLevels;: d7 \3 a9 V5 @  L" e2 @
var bgR;
( g! w5 ?9 m2 `' `1 Bvar bgG;
& @* D9 e* P  v2 H4 c+ Q  O0 nvar bgB;
" ?* j/ |" Q8 A( d$ c) N4 U! zvar currR;
8 V4 B; Y& X0 o( ?var currG;# M2 A$ B+ d- B# O7 `4 X
var currB;; l+ p( w0 S- B6 ^5 X1 ~
var count;  G/ S/ @- ]0 l  W3 L
var fadeOut;" O9 j( A3 u3 E% M! G
var continuous;. y& E0 `' f5 A, e5 M, G# ~! s
var newColour;
6 D9 o7 t: s, pvar tID;* M1 o7 ?; C1 g% q: ~
var redInterval;6 h6 W. L* B* C$ R
var greenInterval;8 Y/ Z( `) D7 J4 X
var blueInterval;0 ^) j0 J' v) `: P2 J& `0 H
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)' J3 i( N: _* Y$ @' }) o* U
{" U0 d& f& P% T
        hoverColour = mouseOverColour;+ ^" _( q- G1 }  x! a) v
        numLinks = numberOfLinks;4 u0 q4 K) I5 W1 D; c. L
        rate = 1;
9 w9 @5 M7 r# d2 u3 r        numFadeLevels = 30;
; v# |4 L5 P6 u( x7 ^1 |+ d        function initArray(theArray, length, val)
3 p/ f- C2 g, N& {6 \6 q& ~        {; z8 ^2 E$ z; G6 R# Q
                for(i=0;i<length;i++)
4 V0 N# |4 `4 x5 M: K' P                {
' x" \& D& e$ T% c- K$ ]% J                        theArray = val;) i1 V; b( z) [: p% H& H
                }
' O9 Z& W- W% y2 r- C. V! K        }" w% g7 m* Y2 v1 y7 H% _( E
        bgR = '0000' + fadeOutColour.substring(1,3)
2 d" O; R) @1 d& @% Q1 P        bgG = '0000' + fadeOutColour.substring(3,5)
% x' B2 i4 U5 m, r0 o% w        bgB = '0000' + fadeOutColour.substring(5,7)
$ U5 I4 j/ V+ z& `9 f        currR = new Array(numLinks);
: h9 ?4 R0 |. B' E, N8 c# Y        currG = new Array(numLinks);
; \  f! r. I9 g        currB = new Array(numLinks);
8 \+ N, S4 H) m* ?) }4 U6 D- z$ v        count = new Array(numLinks);9 _8 t; \$ T% ~, C( \
        fadeOut = new Array(numLinks);* T7 }1 e+ Y* }' r% D- H
        continuous = new Array(numLinks);3 ~. C8 |" p7 B% n. q# `0 u
        newColour = new Array(numLinks);* T( S. u5 J+ w
        tID = new Array(numLinks);6 y3 w) V$ {9 d5 i
        redInterval = toDecimal(bgR) / numFadeLevels;
0 d& J5 C5 p% E* d) x        greenInterval = toDecimal(bgG) / numFadeLevels;
: Q/ E9 G( E& X% A2 H! K' S        blueInterval = toDecimal(bgB) / numFadeLevels;
6 m4 c5 I/ [! \  @8 t% [9 w6 F        initArray(currR,numLinks,0);% d1 w% N: C; d, J, o
        initArray(currG,numLinks,0);# y5 p/ ^. e+ R2 \4 D. l
        initArray(currB,numLinks,0);
# o9 N0 S+ H1 k6 m        initArray(count,numLinks,0);5 c0 E0 i/ N' A/ }
        initArray(fadeOut,numLinks,true);' |0 V9 ]; @4 S( J1 A9 ?$ }
        initArray(continuous,numLinks,true);
) ?2 j: W% Q* @: F8 ~}       
+ N) i4 h  k+ T* @9 y, }) mfunction startFade(id)- e* I7 x4 i6 ]2 {$ c
{
) S* j- Y" {0 P3 W9 p2 R        if(fadeOut[id] == true)
* N% F4 k1 i% t3 e/ l        { /*move colour towards background colour (increment)*/
3 A  T4 f7 \% U6 n: M                currR[id] += redInterval;
, Q* \! c8 C6 G                currG[id] += greenInterval;
. H- M7 z+ t; h* Z0 D/ c  k! c                currB[id] += blueInterval;
" o1 Q; v7 n  c6 u* d                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);. `! K3 d" D4 a9 X
                if(++count[id] == numFadeLevels)
  n+ n6 r* `8 g& C* \! H; b                {
1 A9 u) h' ]0 M6 b5 p                        fadeOut[id] = false;$ J4 H9 v. B, Y0 h5 f! E
                }
( D, G5 W4 E$ J! N9 y        }# l" t9 u# D" [% b- F% w
        else
2 x" e7 _! C. [; I3 @& Y        {
& @' O/ S* D6 A: O% U                currR[id] -= redInterval;
- @  b5 J7 N) r0 m' D4 y! @/ D) ~( t& s" x
                currG[id] -= greenInterval;4 k% E9 h1 o/ S8 k  ~1 T$ Z+ {
  Y6 d( c3 R) I; k
                currB[id] -= blueInterval;
# G: J4 D* @% i- Y
& P% @6 y& N; u" r( t                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
8 T/ }7 D. s# ]5 B2 ~% ]
3 A* s! F  J6 @8 e                if(--count[id] == 0)! Q9 r$ U. W& j$ @0 q
0 j* @+ J( d& ^2 s
                {% g4 P* V- ~( |4 h1 V" i/ z
: N5 A6 d5 B/ W
                        fadeOut[id] = true;8 G4 A1 Z! c/ I6 H
0 p+ q5 I  f' p
                }. d* c' h5 K0 h1 X1 L
* i; U4 m- z# d. T
        }( [# D4 s, {0 j" f" g# n
3 s3 q  D2 U2 `# S- J
        if(continuous[id] == true)
7 h' i1 Z, ]1 X6 H2 d$ i; N+ e; X
# f! Z# N' p) y; e/ W        {: `/ c/ U* W9 ?* m2 P3 ~& A( r' h* K

4 e5 {1 V: C  W& B6 {                document.getElementById(id).style.color = newColour[id];                - B+ b, c- G! ?2 b9 q

* j6 j! a+ @9 r4 }: m* N        }6 E- G2 D  Q2 V3 W# i

: H, @4 q$ B1 ]# l' }& R1 P  k        else
% A9 m5 a6 X$ r$ [! f, P. K4 I! U8 j0 }2 Z8 A) S& p5 k9 J  B" `
        {- _0 P5 b4 o# [9 E5 t6 k$ [% ~

7 p  @1 l, }! h                document.getElementById(id).style.color = hoverColour;! U' P( \! g0 [" o# \3 S
2 D9 Y- Z# h8 y8 a! ?
        }% A* r7 T" X, f' R5 h) z

) L/ Y; d  y2 y* w: f7 v/ w        clearTimeout(tID[id]);
" K. x  g/ G$ j% W* j  Q1 |+ }( n
7 w( `  Q( x. _6 t5 Z( a- P4 x* _% k        tID[id]=setTimeout('startFade(' + id + ')', rate);
+ O: [% \2 R# ]
! W* l0 s! M" Y0 S- z1 K' |}& c. q: P. v" A# I' B
; D; {" M) o; y$ y* K. R" J7 V
function continueFade(id)
+ |$ h. o9 d8 a* E* z4 x) L& H1 d8 x( C0 E, D
{- Z" P$ j& @  `* i6 P
5 r% q, e6 P9 \$ j
        continuous[id] = true;+ A" T6 n0 S' U' Q" N7 B% [

/ d( r7 k2 J6 l2 a0 N7 w- r}9 u5 a* @! j4 q: ?% a
3 e0 ]; F  P; h9 ~
function stopFade(id)
1 Y: W1 [) u2 i0 |  F6 N. l! n2 b0 p! p! ?) P8 B: P# R
{
+ X+ M$ |! |5 e) D6 h! p6 \! Y8 k6 Z$ z1 h1 u& v
        continuous[id] = false;
* t3 ~5 P+ V6 r& ^& A! q9 l; Z
& l4 m9 Q" V) W  V}! M6 a) Z4 X. d5 X; W( M
0 o/ R- G9 N7 Q; i8 k
function StartTimers()& Y9 {+ B0 R3 I" S% U3 V* N
/ C& U; n7 g& I* ]
{        //set up an initial set of timers to start the shimmering effect, `2 B! _! N0 ?$ i
, Q) b/ f  T" f! Y! z
        for(id=0; id<numLinks; id++); ]% B6 a( T$ @" A9 d* A# T* ^

8 c( c& n! K3 k. v% x9 K. p7 }        {* }( O3 u6 B% w& y* s; U! v' j

, W' E! G2 x5 {7 U) l, g! q                t=setTimeout('startFade(' + id + ')', id*100);
% V8 D9 s, ?" I/ T6 k4 D- O9 R$ t) `  I9 Y2 H# ?) N- w& e7 c& P
        }
2 ]- @1 l% c9 t# G, s
1 D% G" x+ D2 b}
0 W7 L9 W; v6 d9 ^* ^& x; H+ v. v3 C! U3 U* l
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
3 @8 I6 u7 R: d) P5 E1 h8 Y4 j
/ D: S1 ^# o" }0 @& S+ g) \6 JinitLinks('#FF0000', 6, '#FFCC77');
7 a) Y( H4 C2 d0 ^4 D, b  S8 M  x/ ]% _* Q- O! W( a! G
//-->
" D% m' `4 J0 |" e3 K
4 o" v+ B- u1 s+ J' o</script>
+ H$ V/ ]8 A+ \# p" k<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名:58元! z* ~- `5 e4 U2 B
</a>' `; P. T  Q' D: l
<br># e4 o) X- A" o
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名:110元</a>, E, _6 c# ~7 D7 @
<br>
) ?. c  I; ^2 ]2 a<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
7 V8 S( u2 y& f# [( ^$ H* L<br>        1 W$ L0 i& s# x5 d  w  c( I# g# M
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
1 `+ |6 o( [' s<br>4 G" z7 b, {  M. S6 {4 F
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>% X6 V' P2 F2 W( f' ~
<br>; r2 B- K- _5 m4 U9 C
<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>
, Z( F, v" z( o( f, [. c<script language="javascript" type="text/javascript">4 l. M: D7 M/ y5 J
<!--
- q$ H9 k8 H; Q. GsetTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
) d+ w0 b* A) F1 b% T//-->9 W  c5 \: L9 X2 r: q. D/ m7 W
</script>

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