返回列表 发帖

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

<script language="javascript" type="text/javascript">/ R* \7 Y1 J" c& @
<!--4 ?! r8 H  n' c8 m4 W  w+ p
// convert a single digit (0 - 16) into hex% I! e% L; v7 J1 E- `: m7 f3 [$ a
function enHex(aDigit)4 ]: M! X' @  m9 C- `
{7 P, i6 [' C' D6 x
    return("0123456789ABCDEF".substring(aDigit, aDigit+1))$ @0 {6 ?& }2 r6 E7 |0 x
}  O5 ]' k7 K3 y; @+ l: D
// convert a hex digit into decimal
. U# h% L1 b0 s: K3 \function deHex(aDigit)
: X7 z/ |3 z' z- E{
0 |4 M! b: K4 o4 f    return("0123456789ABCDEF".indexOf(aDigit))
  I" t: ]3 s* J: C  S3 z* Q}, J; l# C0 ]9 f7 }

# U, l- d  i. b1 H// Convert a 24bit number to hex
/ R; e# F. M6 Q- t5 Efunction toHex(n). z; w/ {; z" E0 b! u( t+ f0 S
{" H& X' S9 Z; w- p: J- B# H9 y
    return (enHex((0xf00000 & n) >> 20) +
8 x. l! {3 ~4 h/ @0 q: n. W4 i            enHex((0x0f0000 & n) >> 16) +* v1 K  r0 `& i2 W- A& h8 V! m% H5 P
            enHex((0x00f000 & n) >> 12) +
( z) J: B- x/ ?            enHex((0x000f00 & n) >>  8) +2 k: w3 T& d2 x
            enHex((0x0000f0 & n) >>  4) +
9 e* A& N" y, m! L8 `3 ?) I            enHex((0x00000f & n) >>  0))
# n$ S2 L: o4 z! O' w9 _; u; G( V}
7 g) p& B' U* p% m9 C+ W0 V$ @// Convert a six character hex to decimal4 S5 c- W& G+ ^6 Q6 A5 g
function toDecimal(hexNum)
0 v* U' `# I' n- L+ V{
. [9 g& O: b' z% r! f           var tmp = ""+hexNum.toUpperCase()
3 u! h/ k2 h  M, k- N  D$ f  v    while (tmp.length < 6) tmp = "0"+tmp
9 J3 g- E5 q* F9 e           return ((deHex(tmp.substring(0,1)) << 20) +5 I! G- `+ q; f' {0 K7 V! j+ F
                   (deHex(tmp.substring(1,2)) << 16) +
- T& A3 ~, J7 g( Q4 b            (deHex(tmp.substring(2,3)) << 12) +
; W. v" n3 G) ~$ |            (deHex(tmp.substring(3,4)) << 8) +1 W; K* M* `9 G0 Z  Q
            (deHex(tmp.substring(4,5)) << 4) +9 G5 ?3 N; y$ l9 f
                   (deHex(tmp.substring(5,6))))
: n/ w+ A. a( W" l1 P}
$ G% Y1 Y/ |( k- ?# F0 M, u///////////////////Shimmering Links/////////////////////7 A8 ?, F; c: b/ t) X- l" P+ v3 D
//global variables9 @2 k+ ^2 M  l0 W1 L
var hoverColour
; @5 w$ u' x/ r0 H4 ivar numLinks;& \) H3 L+ T* G" @2 ^5 k
var rate;( _4 s) I5 H) t/ q% u9 D+ f9 P
var numFadeLevels;
9 [4 q. z9 f, t* H8 _& v0 Uvar bgR;7 L' W4 m7 Q! ]; l+ D- W
var bgG;! W- i& K+ L' h/ Q4 m8 t. F7 W
var bgB;
' a/ M& o' I+ O3 D) I9 f( O. pvar currR;* J  |' K( y+ F
var currG;! e9 K6 r7 f3 W
var currB;& `1 x  T+ F6 A2 E, v  ~7 ^- }
var count;5 U1 C" ~/ M4 ~, S. s  q$ |# W
var fadeOut;- L% S1 E" y; U: l- t. q5 f1 b
var continuous;- r3 G% P' ?- h" A
var newColour;
6 y6 B, L0 r, X, gvar tID;% T  b6 I7 s/ G5 f0 B
var redInterval;. L7 Y6 ?$ Z6 Y+ d$ t0 h
var greenInterval;4 l* V9 ?) M4 E- m
var blueInterval;- c' g: K" h% w& n& O4 z- k" d
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour); {4 b/ f% O/ w  ?; \, U0 n
{
7 w( q! X1 x: Q8 l        hoverColour = mouseOverColour;
1 E0 m8 k0 E& N* g        numLinks = numberOfLinks;  {) J$ {4 V) k# A) `6 T
        rate = 1;
5 [! k% q6 l% w0 k" [, c2 _/ m0 u        numFadeLevels = 30;
1 l. K" S( p* z0 t5 q% H1 u        function initArray(theArray, length, val)
/ n8 p9 o$ G# n+ W" \        {
0 M! r+ M; d$ \6 |                for(i=0;i<length;i++)1 d  J# y0 D! j0 i6 I/ w
                {
( a( d  |2 @4 d% E! b: W/ O  y% L                        theArray = val;
7 T! x: n+ k- R) z8 v; ]( G: W' n9 E                }
/ b0 C; Y; v' H7 n0 `7 u+ a        }: G) F, ]2 s! ?* ?. `% B
        bgR = '0000' + fadeOutColour.substring(1,3)
$ ~9 d: d+ p4 x: F. U* E7 P        bgG = '0000' + fadeOutColour.substring(3,5)7 g7 B) D; y0 q# F/ A. }
        bgB = '0000' + fadeOutColour.substring(5,7)
$ N# U2 L% C9 H& A. D* H7 a        currR = new Array(numLinks);* g* Y0 l8 m3 r5 o
        currG = new Array(numLinks);+ V; Z5 u9 g2 g5 |
        currB = new Array(numLinks);
9 |- T6 i8 q1 O& R% y        count = new Array(numLinks);
( X2 @1 Q! t, P        fadeOut = new Array(numLinks);
- R/ K) C  U' ~        continuous = new Array(numLinks);% ?/ d1 `9 }2 z8 }$ R
        newColour = new Array(numLinks);
6 o4 r% |1 ~$ b9 s/ Y$ K6 h        tID = new Array(numLinks);  O  i! Y! C. Z0 y/ k4 G$ r: S7 p
        redInterval = toDecimal(bgR) / numFadeLevels;
" T3 Y: k- X0 \1 x+ H$ }* O5 c# _        greenInterval = toDecimal(bgG) / numFadeLevels;
2 I5 u( @  H8 ~& X# W* \" @: Z        blueInterval = toDecimal(bgB) / numFadeLevels;
. G5 ^% q( E& y        initArray(currR,numLinks,0);
. [$ v* U) I4 r        initArray(currG,numLinks,0);
* s4 G: v3 s0 s        initArray(currB,numLinks,0);& n$ X7 R6 d: H/ s$ C
        initArray(count,numLinks,0);8 y3 r6 d0 h' E3 `. c
        initArray(fadeOut,numLinks,true);
+ }% u1 J1 Y% M1 m        initArray(continuous,numLinks,true);
! q, Y  A; f  ^; i3 N}       
8 g, D- k* D7 p6 X7 M: y) }2 ffunction startFade(id)+ e/ e) i  O& Y: {% R$ P+ H) s
{2 Z3 e) A' W" x# G7 I
        if(fadeOut[id] == true)2 ]0 V$ c. `8 @
        { /*move colour towards background colour (increment)*/) S6 A: L, a2 x( H* @1 j* C
                currR[id] += redInterval;. f' j/ N; G* A2 Y6 \7 K: z5 \. ?; s
                currG[id] += greenInterval;
; p: t3 |7 e2 M                currB[id] += blueInterval;
' u# G  D& F. g% d$ x# V                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);5 n) {! I) `- O& ^: @- q& E
                if(++count[id] == numFadeLevels)
  d/ a0 P7 f+ A                {* x5 n$ P! t' U6 {8 m+ [7 _
                        fadeOut[id] = false;
' v4 n) i/ z; A1 V: ]4 p                }$ F! U6 \7 _" Z" {# D
        }
) q, F- ?4 k7 u3 |% }, }6 B' ]        else( R5 I6 M; m2 `" m* ^
        {6 y, j* W6 b# z4 H0 r  C8 P  c( m
                currR[id] -= redInterval;% s  b) q& \: z1 n

' T; o( G, U, c" P8 y2 o. t- i                currG[id] -= greenInterval;
* e4 l2 M8 Q4 t$ |
- _) Q( e! x* m$ K                currB[id] -= blueInterval;+ I4 Z" U! r) t& E& V
# @' E: m: j7 u$ h$ j/ l
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);* I. y+ u9 m9 N& C
$ L5 S( Q/ S7 h
                if(--count[id] == 0): V$ w: A; p2 A# ?6 U

" G& S5 A+ r! A  o3 F" H                {) c# |; S4 a+ S) s5 g# p* V4 r7 N
6 ?4 D, E/ Y+ U2 \( L
                        fadeOut[id] = true;/ P  L6 l! S0 u( N6 g' p% M) }. O

. g! ^% ?( L* ?) {! |8 u: B                }: S; N% e2 X/ z/ V/ \. I7 Y9 P

: L6 T; }" ?  m% a+ E" \        }
8 z, T# d; e; k3 q0 z. B/ p8 |2 Z2 |/ o, A
        if(continuous[id] == true)
- C  F8 t3 f$ r
! O! E0 @* x5 i8 ^$ r        {
/ ]; w4 J( }8 M. ^+ j' L8 s
$ J% O+ F6 W( b6 r                document.getElementById(id).style.color = newColour[id];               
* ]/ a; t% G' Q) O2 m+ r, x( g' {9 Q' v
        }9 i7 J( X- }+ F8 J' F/ r  N1 h! m

: k0 L, |# w( W2 x% E5 A! I) S        else
$ q1 G) D  Q+ z$ x2 j
1 ?3 }) G- r- n; \! K        {" N, T6 K' G; T& ]
3 \/ E& A8 y7 \' a
                document.getElementById(id).style.color = hoverColour;0 {% E9 b4 q; \4 W, q  W2 [: i
6 ]' H" Y# V' M/ L0 x* v/ \
        }2 U  f# ~6 t0 k8 k( l. `; d
+ a$ C( G* t: f  g, `3 C
        clearTimeout(tID[id]);
0 o1 t% i* B" k# ~0 Q7 v  ?5 O; A, K& a/ a8 _& J
        tID[id]=setTimeout('startFade(' + id + ')', rate);
. Y9 d  _! p! M: R  \7 V1 E8 m9 ~  q4 P: q
}
$ F& I3 e' r/ G& b
. P6 w$ y5 [7 I& mfunction continueFade(id)3 ?! ^! O% P+ x/ @9 Z9 e- X3 b
$ c* |4 |9 k+ z3 N+ R+ L
{
# V8 o: u  v" ^5 P& n7 _1 U* U9 ]" b0 n! C6 `
        continuous[id] = true;
+ h/ E* Q$ W7 P: i( m! ?9 |
) x4 k+ @) X- C$ O* t- t( ?: F}
! E4 t' p% f* q7 K6 p/ k& f
- {6 b0 ]& [. m7 f: Yfunction stopFade(id)
, P# n" k6 g5 A# n0 V1 U
% T5 \# K; d. q8 o8 B/ F" m{& N' ^# _- v$ X5 Y

6 p: {4 G- c5 b1 O& ]! `$ V        continuous[id] = false;" u: v8 U' @+ s' W7 d

9 g% e) a% v7 F2 ~: s}, _: ]! H$ J! v. g. ^
* \+ |  i* K9 D4 n: V! z5 k3 k# p
function StartTimers()* _, u$ p+ |' B  y& b6 Q. [  z
* w' ~, E( J, s! x' @
{        //set up an initial set of timers to start the shimmering effect
( u6 S. @1 J: L/ F9 x0 n& N: o  T& L3 v5 s
        for(id=0; id<numLinks; id++)! e7 _, R( x. X' y' Z0 L( q) f
% b2 S1 o. v8 u; |$ j
        {9 o3 Y3 L: R. _' d: r

5 ]: a; f# N1 {! u( b1 J2 c* u                t=setTimeout('startFade(' + id + ')', id*100);
* Q% L( P* }% h1 O1 u7 V4 T
7 T1 P% }+ }; b( G* G! e1 j        }6 m% U" Z! O/ A8 J. \: x+ i

8 \( U1 T% e* G( ~  w3 P) I9 l. m}
) B! @9 t9 q0 S. G' X  j. }' ^
+ E# P' P: C* p0 [2 m: `//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')0 B1 r: @" S9 W. X5 g2 g
* Y0 _$ T2 J" q( C1 L
initLinks('#FF0000', 6, '#FFCC77');
: C+ Z, ~% b$ m0 u* Z+ v. l8 J# f+ s, I) Z- V7 X3 h0 H( G9 U8 V
//-->
& B' G/ O7 X- T  u+ e$ S, l9 ]' |% ~( j
</script>, r3 Q! A- _  m+ |# z7 F
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名:58元
8 }$ M9 d6 M. \; Y& s% A' G</a>- g- D+ \' e. x8 `  j0 d& @+ X" d8 g
<br>
8 u' e7 D# i' R<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名:110元</a>
# l; b" h+ _( D1 B# j<br>
7 ^# q4 c$ [% w( |<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
( X# g* {5 ~" _2 O' W  [3 i/ b3 @<br>       
; |5 |1 Z+ s5 t# w$ b" u; c<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
$ D0 B$ ?" n  l8 K) r  w<br>5 o+ ^7 v- j3 F* X5 C
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
& _3 t+ T+ k7 i0 t0 z7 q/ c<br>
2 |% J$ [+ v" R6 w/ T3 L<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>9 v8 u% n+ a  U* j
<script language="javascript" type="text/javascript">: n( m2 z9 n# T, Q
<!--
# K; @5 W$ f8 d3 H- m5 OsetTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
* }, b  ?$ r" ^0 V0 U/ B//-->. r( D# D$ Y6 @7 N( \2 M2 u7 |/ e4 x  P
</script>

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