返回列表 发帖

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

<script language="javascript" type="text/javascript">7 C9 K7 s6 e% I* ]8 m7 x7 ]
<!--
# m+ j1 N3 k8 I8 h* n) h& N// convert a single digit (0 - 16) into hex* T5 v$ J" L+ B' F* m
function enHex(aDigit)
6 y5 o6 ^: i# h" X( s% b7 Y6 U{0 N* P, A/ X7 X, H
    return("0123456789ABCDEF".substring(aDigit, aDigit+1))1 ^/ E" W" i& ]9 R) p6 t/ g& {
}
$ j+ E- _/ ]7 r  A// convert a hex digit into decimal( o5 \9 o- t/ b" ^( s
function deHex(aDigit)
% k1 O$ b2 |; T/ ?& |: Q+ V{
7 b5 X; k8 E  P, y    return("0123456789ABCDEF".indexOf(aDigit))
, k6 g6 x! {( b6 Z5 ^% h$ B}# P9 K( |& [* u. X

5 o! @$ _' w% d1 m! p- ]// Convert a 24bit number to hex
# w! ^/ T' J* x' }* ~; W+ Nfunction toHex(n)( g8 b- X; n9 w9 B
{" @" I' r( ]* n, [
    return (enHex((0xf00000 & n) >> 20) +
& Q. q- Q6 k. ]% L8 Z2 k            enHex((0x0f0000 & n) >> 16) +
: V) a  s  A) N6 s" z            enHex((0x00f000 & n) >> 12) +; J' K/ B0 m4 o7 i3 O
            enHex((0x000f00 & n) >>  8) +
+ X6 k9 B1 t+ i  ^. I            enHex((0x0000f0 & n) >>  4) +
4 A6 `+ s8 {0 |# E' f. u5 z            enHex((0x00000f & n) >>  0))% |8 Z1 N5 h% C9 I' O. M- v
}
$ f- |( [' W* s// Convert a six character hex to decimal0 V  ?/ Z: l7 m2 D) j; l( _
function toDecimal(hexNum)4 C0 s1 g9 d( p5 [3 u
{$ v- Z" V: `, ?
           var tmp = ""+hexNum.toUpperCase(). ]/ U6 C3 g, J! K) n
    while (tmp.length < 6) tmp = "0"+tmp
8 v! f" r  @: ]  p4 b0 ~3 ~: L           return ((deHex(tmp.substring(0,1)) << 20) +: X7 C9 N+ p6 |1 \: M
                   (deHex(tmp.substring(1,2)) << 16) + 7 T; V7 G: o" N& C3 H
            (deHex(tmp.substring(2,3)) << 12) +
5 A/ C$ l  X$ C8 W; Q* _3 O            (deHex(tmp.substring(3,4)) << 8) +6 P3 a1 w" L7 _0 C# h
            (deHex(tmp.substring(4,5)) << 4) +/ r2 f# C. B- m& m  k/ r9 C& T! U* L
                   (deHex(tmp.substring(5,6))))
/ ~/ [' v$ A( i: n( Q; f( i}# [  ]7 J. Q2 I
///////////////////Shimmering Links/////////////////////
" V6 d3 K0 O' J3 W# l//global variables! Z( K4 q  O9 w+ u
var hoverColour+ c$ J7 ], ~3 H! G! u3 b3 n- c
var numLinks;
% D) {/ F# z' D# `1 Yvar rate;0 }( n! U+ _) r7 a( a; _, i* t
var numFadeLevels;7 Y0 M+ D; q( H3 k( v- y4 }
var bgR;
: J* _% |9 r" D9 V' F9 Zvar bgG;: {* i9 |+ y8 N
var bgB;* y" `7 m8 r6 R0 X5 q$ \7 h+ ?
var currR;
- G3 q' A3 r6 G6 i* xvar currG;
: a$ L# G2 U: k3 r3 L9 h) S5 R+ bvar currB;
; B' }% X& o* U4 ]7 h3 @+ X7 `var count;
* r& Y9 E" X" c9 v: qvar fadeOut;
( N$ v" [6 Y3 o, Cvar continuous;% o6 h5 \  e& t/ Q4 b' C9 L
var newColour;$ F, c5 Z; ]& A  X9 y. R* l1 Q) T
var tID;
0 S5 Q/ Z: u( t5 e  a* C1 Qvar redInterval;
* b; R- v) k6 _; }var greenInterval;' s8 h; F3 H* ~
var blueInterval;: C% C( m* [; M$ m+ l- n
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)" v- G7 @# e7 }9 L0 p
{
* \) B; E2 C* {. _7 p  ~  s        hoverColour = mouseOverColour;: t% x1 t( X6 g( x, X4 u6 k* n
        numLinks = numberOfLinks;
: z; U3 ~& ?& y. c. Q, f        rate = 1;: Q3 B- D2 E* W3 H5 D* G
        numFadeLevels = 30;
: h# u$ p, e) \- Q) Y7 L        function initArray(theArray, length, val)5 [: ^3 y; |0 p
        {4 S0 \6 \6 f5 `3 H8 {2 f- B
                for(i=0;i<length;i++)3 P6 W" a& s$ C& C5 y( b$ R  x, O2 d
                {8 b/ Q/ ?; g# l8 ]$ L2 O
                        theArray = val;0 p( T. a3 X. \# `* X) d
                }
& l7 R: o, J$ Y* S7 l  d4 ]        }
8 E8 A/ `0 ~0 W9 g3 n5 n8 r" a        bgR = '0000' + fadeOutColour.substring(1,3)
/ }! ^3 X; n8 x7 \5 }! Q        bgG = '0000' + fadeOutColour.substring(3,5)
! F1 u3 D0 q( ~- m/ z. D; n" Z        bgB = '0000' + fadeOutColour.substring(5,7)
- ?: ]6 ^, l$ N# t        currR = new Array(numLinks);& h2 {; C: B7 c5 M# Q: O0 g; A% [" [
        currG = new Array(numLinks);( m; l: W. ?  m. L0 h/ a2 W
        currB = new Array(numLinks);4 g  @, G4 G. D% x; j, e
        count = new Array(numLinks);
7 K$ Q# o3 G/ O        fadeOut = new Array(numLinks);$ b( G5 m, K8 W% R0 |7 @
        continuous = new Array(numLinks);
9 j& _, T( E1 i6 e5 }+ ^4 V. @        newColour = new Array(numLinks);
) y9 T; |, K, ^" l# t% R" Y3 u        tID = new Array(numLinks);
! a- M' F( R* H, L        redInterval = toDecimal(bgR) / numFadeLevels;
- }, T" L& |2 @! J) a        greenInterval = toDecimal(bgG) / numFadeLevels;
- u: p* A% d8 M% ~6 N        blueInterval = toDecimal(bgB) / numFadeLevels;
( h% S4 X* l- K0 V7 [/ X3 n        initArray(currR,numLinks,0);
, R9 P" g  X2 E0 A* D3 W, S        initArray(currG,numLinks,0);
& O/ k8 q6 g, Z  a5 ]) z5 A! G        initArray(currB,numLinks,0);
* b9 `7 r* X  l+ }        initArray(count,numLinks,0);
% K* U% |1 v& ^% {' U0 I        initArray(fadeOut,numLinks,true);
' @2 [% Y! x2 o2 ^        initArray(continuous,numLinks,true);$ i/ e# J; T' Q7 d8 A2 N3 j
}       
6 m7 |  Q* W5 G# B) zfunction startFade(id)
  O; R7 Y% Z/ D1 C0 p) }{; S. M' \: D6 M" _, y( \
        if(fadeOut[id] == true)/ @1 O, u, k$ R) @8 s9 S% S7 J6 Z
        { /*move colour towards background colour (increment)*/
! p+ H( x5 }( k  i  ~                currR[id] += redInterval;: t  f1 ]# l* u- l  B
                currG[id] += greenInterval;( U! `4 l  s2 Q7 r! N3 F* j
                currB[id] += blueInterval;$ v* `2 w, |8 |+ y
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
. a  Q. [" v5 H$ {6 B                if(++count[id] == numFadeLevels)
& f) i. l4 [. [8 Z                {
: g( K& F3 [# ]. T7 }! z                        fadeOut[id] = false;* L! `0 l' p6 b+ V9 F3 R. R# g
                }
. j% A# D2 t- d. T        }
/ l; A6 _, J1 w/ i7 _9 o7 ]        else
/ |. A1 `% _6 F# p        {
4 B  }' g* a6 j                currR[id] -= redInterval;
: ~1 h& B8 C- P( E4 w) y5 o
/ f7 |+ U3 q# \, P$ b! D                currG[id] -= greenInterval;+ C6 L! E5 |4 M: K! Q" N9 o9 ~

' a7 O' _0 ^- f                currB[id] -= blueInterval;$ C9 j/ I7 |% V3 }' O7 n
7 l* g2 ~/ O4 ?& l: q
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);% E9 {7 V% {% P" [& C8 A% {9 d

8 c) c' m) i, }/ K: l                if(--count[id] == 0)
) W4 }. q; n6 Z! a2 Z  q- c
5 h1 }0 v6 g( D. j* T                {
  P0 x" ~% y+ u3 C! s( M5 r3 A6 l
                        fadeOut[id] = true;8 p1 c1 ^6 h* C  X& ]  M: N0 P1 X

" d% Y  V/ a0 w7 H" k; s                }* C0 Y  j& ?4 \
8 [' s. {/ q; a" p6 a. J
        }
! i- f8 k1 p- M: d2 S7 Q& I* h
8 G, Z6 M' B1 H- T$ A$ E        if(continuous[id] == true)6 l" ~4 q2 \% j7 W: r" l

- [6 l, {7 I; ^* X4 m4 o6 C9 p) H        {$ \( U  v1 H* \& @/ l# ?4 C  O, c

$ P! R- j; t3 y- d9 H9 G  {2 l                document.getElementById(id).style.color = newColour[id];                / u" T: e- u5 K" g4 z) ~, |

1 u0 P9 q: Z: j* [  O. f, c        }
0 t( v* r( c- C" f. ^% z6 u: h% W$ ^0 J* g$ E
        else9 d  a  u8 a: @6 U7 I% T6 i, _" C% ]
# K& e+ V( _: L. Y! U- y7 r" g! B5 l
        {& }5 m0 ?$ a$ z4 p: D: g
% V5 d) I6 j0 J7 ^% K
                document.getElementById(id).style.color = hoverColour;0 R6 T* U0 F! ?2 b0 X
: |! h) ^5 D& K/ ~# q
        }
( g" J3 a( B8 [  \  H% R! p) E; N8 u. H
, V/ K. f1 r2 q2 v1 N        clearTimeout(tID[id]);
/ ?  Q! P  {3 l5 X& W' u; f+ O1 |5 b% H4 L
        tID[id]=setTimeout('startFade(' + id + ')', rate);+ D, }7 P/ O0 V
) z! x% _5 g. w+ ?" ~/ [  j: f! f0 o
}
/ U" T# K1 `1 V
6 B' Y8 |$ n5 \3 |: Afunction continueFade(id)
  P: {) e7 @9 k) w. O8 W& ]% L* B& ~  |3 a3 P5 [0 o5 q
{. @9 @' l9 g" K) x: K7 P
, N+ S% Q8 a, w# Z. V  a8 E7 O+ E
        continuous[id] = true;9 Y$ o$ v. G; A' B
) W, m' n9 s  b3 f
}+ t6 D( C& I0 A

9 I) k) L3 J+ C4 ^4 Qfunction stopFade(id)
+ D: u0 H8 [# ?! E6 X  z9 {: ?" q% ]& I+ K1 V
{9 k  f9 G7 z* b/ M0 P+ {
& Q3 Y# ]" h% h1 T* U
        continuous[id] = false;
, X) z3 i- F( I& X" V# Y# t, |/ k7 F. U
}9 L! \- x, Y. p* L0 r
$ u! k/ s) P1 A3 T
function StartTimers()/ K/ W4 l$ U) z9 l3 g6 b
) A; ]4 w/ ]2 R: ]9 J
{        //set up an initial set of timers to start the shimmering effect
7 b& ^# ^1 a0 I+ D% K
1 {/ S* k2 `# @7 p  Z* N        for(id=0; id<numLinks; id++)
. G# T' H/ H; i9 b0 W( b4 j9 m  D
+ ^6 N) n; _4 l        {/ [2 I! t3 N! p0 L

4 P1 s7 `. Z, M) J& d+ u, ~                t=setTimeout('startFade(' + id + ')', id*100);! A" d; W! f# U, K) E
. t& I- j" b, I; O5 o
        }$ q2 z1 m! a' H- I+ O* K9 R

. X4 X- t! o6 e( I% I/ S- Z}
9 J4 [/ S0 M: u  r" S/ B3 N& M, H  z& G
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')! ~% w+ Z3 D. k1 R1 C
8 @9 m( J7 y& V, k+ i  ^
initLinks('#FF0000', 6, '#FFCC77');
) e1 U( {: h4 C8 {, n8 Q
8 s( e( ?- a) M1 t: l//-->
& N/ t* p' R0 ?2 {" A& l9 L& l( I- U6 X. P
</script>. R& Z6 l  V% w# U2 x/ ^
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名:58元. l8 J/ P0 n& m. i
</a>
3 U2 b& I$ }0 b, K0 G<br>
& P. A2 k+ J) P; C# }) ~) {<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名:110元</a>3 D4 _& s- r- I9 P! n! u5 F; J) L
<br>+ D0 X$ u3 j' y
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
+ g3 q) W  r! l5 F$ j% M<br>       
$ j( M9 o7 a) Q<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
1 e8 N3 d5 `* r& B0 I+ ^; ~, d+ b1 X<br>
5 j8 g" T, \! T7 h# k2 g9 _) ?<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>$ ^. x% o2 ~4 y1 a$ K) E* m" Y
<br>
4 f  H4 w4 e3 ?<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>
- ^0 t" v5 ?7 e& E8 Q8 ?, S<script language="javascript" type="text/javascript">
7 d1 `9 v- I& n0 F- y<!--
1 _8 O$ ~% i0 c9 }4 LsetTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
& K( ~& v. z& t# c2 E) a4 \2 {) b//-->$ i, l1 n& B5 V, x7 z' ?
</script>

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