返回列表 发帖

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

<script language="javascript" type="text/javascript">
( ~8 a. ~7 U! q) L; G<!--( Z$ k, ?3 y8 O
// convert a single digit (0 - 16) into hex
3 V. t2 A$ K( dfunction enHex(aDigit)' Z5 e2 Y# i: p
{
1 U* }1 y$ ?9 X5 s0 H( t; ~" V. f, e    return("0123456789ABCDEF".substring(aDigit, aDigit+1))7 a) Q) }' x1 L. O' }3 P6 ~& H
}
( {' e1 x6 c& U// convert a hex digit into decimal
- ~4 ?) _' t" S  ?5 ^9 z5 A2 c, pfunction deHex(aDigit)9 M. Y  u6 X, d8 s
{
' J1 R4 s. N/ ?# p5 P    return("0123456789ABCDEF".indexOf(aDigit))9 B. F* `1 O6 ]% k+ g- d/ ~
}8 R! P4 T7 w8 H/ S6 c* V, U

9 \) d3 d, J, H4 l2 G) L, [0 J// Convert a 24bit number to hex
* U! R+ T2 x  p$ F% g  Mfunction toHex(n)& H9 a( L1 i) c6 ~, m5 N  i
{
6 n: M2 F' |9 y    return (enHex((0xf00000 & n) >> 20) ++ X! _) S( E- \  u* n! k5 S* a. d
            enHex((0x0f0000 & n) >> 16) +
5 E4 l; ~4 q: a- @            enHex((0x00f000 & n) >> 12) +
  x; s3 S7 N4 c/ q            enHex((0x000f00 & n) >>  8) +
0 B% P% N! w8 I            enHex((0x0000f0 & n) >>  4) +' i; I/ ?) A4 U6 p- t# P+ R
            enHex((0x00000f & n) >>  0))
+ w" j' Q5 N+ J5 X) X# Y}
/ h8 ~. v  Z' x$ p8 ?// Convert a six character hex to decimal' f) q9 j9 S- j/ P
function toDecimal(hexNum)% O% p6 f# F7 J- L' e: x8 Z
{$ X5 F8 r7 {  g+ \& J! m6 V2 C
           var tmp = ""+hexNum.toUpperCase()
& s/ e0 i/ P  o1 R  ?* ^9 n/ {    while (tmp.length < 6) tmp = "0"+tmp
9 l+ f, _; @1 u           return ((deHex(tmp.substring(0,1)) << 20) +& s  X* @/ X  O, T) a; }$ n
                   (deHex(tmp.substring(1,2)) << 16) +
* J+ ?6 n' A# R" }2 G! e            (deHex(tmp.substring(2,3)) << 12) +  J9 x+ {- I" [( j
            (deHex(tmp.substring(3,4)) << 8) +! Z7 y5 u) `0 Z' V' G$ T) g
            (deHex(tmp.substring(4,5)) << 4) +7 x/ [2 A  |3 w( _2 y4 o
                   (deHex(tmp.substring(5,6))))
% R2 c7 n' h$ K7 _) a& D}
- O, f4 T9 c" G///////////////////Shimmering Links/////////////////////
2 C) y- L0 G5 L  M3 S% {" {- c//global variables2 G5 ^3 O$ p$ C( S! U% Q2 S
var hoverColour- }3 P  A* T, \9 p2 l; M* ]8 |
var numLinks;
- _. L! k8 K" l0 }3 X. `( E8 C% i: i. Vvar rate;
) F# O0 a% X3 x3 Wvar numFadeLevels;
: t  H/ D# o7 B: O& D8 F- S4 avar bgR;: ]- I( ^) r" Y4 q7 l4 g- ^% Z
var bgG;0 \9 l" h. Q2 h6 F4 _# D: r5 e' i
var bgB;
# ^0 u0 {- @8 c' `5 {' Vvar currR;8 ^/ \9 l% Q; x
var currG;
4 k1 g, i) `1 j, Uvar currB;
5 h- S: v8 D! k, a. r2 zvar count;- [3 B! N& N, R1 w4 o0 A* V
var fadeOut;8 R' u+ I5 v  S  z$ Q+ I
var continuous;8 f; l# n" ~7 g5 F: v
var newColour;
9 v7 c4 r8 d7 V# E* u9 i4 s8 L3 Vvar tID;
* q, i  L  T$ V7 K! dvar redInterval;
  m/ t  J' e3 ^. ivar greenInterval;7 S9 K6 ]1 q7 n- M: C# f9 s, ]
var blueInterval;+ }+ O# B- M+ k$ h% S3 D3 a
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
, O/ d" \9 F! H1 c: o{
9 M4 ]$ F  v7 ?1 C# g2 A        hoverColour = mouseOverColour;! N: L2 t/ X& L; C
        numLinks = numberOfLinks;% g3 `8 ?9 o+ v
        rate = 1;: K$ Q6 z3 b( Y2 }
        numFadeLevels = 30;. \& U9 N; {  Y% I
        function initArray(theArray, length, val)5 W* M1 v# o! }$ T5 U- g- y9 `* g
        {# d# I. F- h* F: U7 j7 ~
                for(i=0;i<length;i++)
9 c' N6 J3 G. g# ~: g                {
- \7 B* K" f0 n1 H2 s                        theArray = val;
/ i: H: W* t( v% `! o5 f1 n                }
% y$ I. m% ]! @, g( u) F- }        }
; c- f. |1 L% P9 ^9 {) V7 O        bgR = '0000' + fadeOutColour.substring(1,3)/ {% ?) R; X2 |
        bgG = '0000' + fadeOutColour.substring(3,5)
0 [: b' |( c8 _, r        bgB = '0000' + fadeOutColour.substring(5,7)
- A0 f0 G7 X5 N  u        currR = new Array(numLinks);
' K2 l. p' i0 ?' s, K5 ~, u        currG = new Array(numLinks);
/ h! v' m% Q5 r        currB = new Array(numLinks);
4 G" \" u3 P* c$ z+ P5 q; F        count = new Array(numLinks);& v* C+ J8 W' z, j4 k' ~  o" c* u
        fadeOut = new Array(numLinks);
% n7 K" S1 q% \9 k. K1 W        continuous = new Array(numLinks);
" y# ]/ X6 u6 V  C. P/ C4 @$ H        newColour = new Array(numLinks);
, e0 V# _% V6 V/ |        tID = new Array(numLinks);
' j# {) ?1 _! a7 W        redInterval = toDecimal(bgR) / numFadeLevels;
7 n% D8 W! B" v& ^! K        greenInterval = toDecimal(bgG) / numFadeLevels;
& N1 g$ o) m& a. f  n        blueInterval = toDecimal(bgB) / numFadeLevels;8 h# @1 [# Y  k& z8 W* p+ b% K
        initArray(currR,numLinks,0);
/ H5 d# u6 {' s" Z- @        initArray(currG,numLinks,0);
: x( y9 y% U* P  b        initArray(currB,numLinks,0);4 o8 U4 p' l: W; T; U
        initArray(count,numLinks,0);- E3 z5 S! D; p
        initArray(fadeOut,numLinks,true);  z, R) C2 J# {
        initArray(continuous,numLinks,true);
  d. a( M  F( {" H+ ^. W! _4 Y}       
9 \' Y, J0 I  Z5 k, _9 tfunction startFade(id)2 Z% V$ `4 z( @+ L; v6 }0 J
{
0 E9 q$ d! u" V" z( n! o' Z, w        if(fadeOut[id] == true)% h* V+ c! z8 ?3 h, U
        { /*move colour towards background colour (increment)*/
1 l9 ^& ]7 \0 E! R) m+ l                currR[id] += redInterval;) ~: C0 k; t: E. Y+ t9 S: Y
                currG[id] += greenInterval;) Y7 W3 W' |6 E! |/ c8 P
                currB[id] += blueInterval;
& W8 Z2 N" T* p% o2 S8 h9 F- J                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
: s4 y+ q. m' J/ K3 v$ [9 v                if(++count[id] == numFadeLevels)# T5 z& g0 ^( \: e7 H
                {
& U6 H: L; K1 `# |9 P                        fadeOut[id] = false;
  O$ K3 e- x9 @( O7 M. T. I& ^! n                }
. j" l$ p$ ?' A) ]        }
  E# Z# X3 `- a/ I% ^% R) h6 }8 ]  H) h' ?2 x        else, i. L1 s' V4 W& p
        {
) `8 Q! S/ Q8 M8 D9 l" K8 I                currR[id] -= redInterval;
( s2 i* T! b0 B( Y8 m
3 H" ~. x( n; Y$ h                currG[id] -= greenInterval;
( i" E3 M, ]0 X' @! T) L: J6 d( C7 ~, Z$ M0 {, C- s
                currB[id] -= blueInterval;
8 R; |# Y2 _5 |. x, P, K1 W2 C; Z& G
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);( h& J, Y8 `8 J6 E( G. c

) t# n9 c2 V# e" F: C                if(--count[id] == 0)9 L- x& w. B# W5 Y

$ S4 p3 x2 P; h" r' n+ H                {
7 v& m+ X1 D% ^  j+ Z. q5 F) C5 Y1 f( d% F' n
                        fadeOut[id] = true;
! v! u+ F8 c' S4 U7 a( A6 X/ H1 T& A. f7 c( E" G
                }
9 r  K* D% W4 t+ n! B  L& S% D
& g" J: i" A8 X0 k: L! m5 w        }
) p; n; H5 z' D" F  g. d6 c7 |1 Z. ?9 ?" p* z0 a1 O
        if(continuous[id] == true)/ Y) E3 Z! ]3 t- T

, n' C6 x! ^5 A5 V; X        {7 g& C5 p9 g7 O% A7 u# N% R

' O. f: p) f  n! E3 f                document.getElementById(id).style.color = newColour[id];               
: U: Z7 H+ C9 N& m/ s8 @& N; D4 X( T6 z7 M) E8 l* [- N
        }  O  Y/ V) P+ o% i* R7 Y

3 n9 X7 K, o. o3 n8 U        else
0 j4 a) F  ]" n- B, ~7 t3 B0 h" n
2 }) j3 K) T8 z+ z- ^7 Q( j        {( N  r# C& Y' g
2 T3 ^6 m' C6 ]3 D* \. o2 T+ f
                document.getElementById(id).style.color = hoverColour;
: v1 F9 ^  G2 `' f( x6 J6 U- U, ^
1 s) `/ {. z9 T3 Y' X3 P4 _! Q, Y        }
. _9 f! O, n% y, o" h! m+ v
  p. @# W0 ]6 |3 K$ [  L        clearTimeout(tID[id]);
  o% d  X  j5 u6 h+ k0 F4 o4 x8 M- }0 |5 r" ^. y% M: X# c' L3 A, d
        tID[id]=setTimeout('startFade(' + id + ')', rate);8 Y+ E: R8 J( w4 ]% n4 U/ u  d$ g

5 h! s9 g, f1 G+ A8 ?}9 ]( k; E0 }6 }6 h, T2 J
7 n, q, V  d/ k
function continueFade(id)0 ?7 d* J* c  T

/ x4 I1 z5 n  r! F) ^{$ E# G6 j, @% v1 _* P
4 C: Q6 j: I' `+ K
        continuous[id] = true;
, }+ A6 a# g3 d( D6 V' N8 p
7 ~  q  @; B* Y3 h, z5 q}
; c+ i& U! e( s4 t4 S, W$ a2 s# ]8 r0 e
function stopFade(id): V# {5 E  Y1 d2 W' \

) T( \: w5 P7 O# Z  q{5 K( ~8 B. \* Q3 u. m! t

; [! k( a# _: K        continuous[id] = false;! M) {2 K8 q% z/ Q
' U8 J6 T; ]# I# i+ p% Q
}
9 B+ a9 q4 f0 G( |' M1 N4 w/ h+ H7 f/ ^8 V8 q. i4 U! d- ?/ s9 T
function StartTimers()8 O: Q2 t: ]* B

( d' w0 z5 f- C* E7 z8 m{        //set up an initial set of timers to start the shimmering effect4 q% z* M+ m' O9 U

3 U8 V8 M6 T) _& T' }/ r4 g: |        for(id=0; id<numLinks; id++)
% [' q! ^, O, {- _1 H
4 m! n7 _% x' L5 t, ?. X        {
4 ?4 d5 p% U* S3 C+ k0 K$ x4 @6 b* s3 G
                t=setTimeout('startFade(' + id + ')', id*100);
0 `5 n/ t3 L- @0 |7 ?6 e4 t# a* f7 G
        }! }+ ^* h* D5 {% F5 i" H
! p/ U  m* {3 P, Y; `
}
6 h5 a0 |  P8 L$ s' u9 j! _* I% Q; f0 C4 O2 H
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')0 h+ j4 N2 e" v, `) V1 H

7 L/ i. D1 Q; C; ?4 TinitLinks('#FF0000', 6, '#FFCC77');
% A$ ?$ a1 y* S
- l8 _( o2 _. p7 x//-->
1 F; q. S  u* i' d& y! _1 `0 L) s3 T; r! ?: @
</script>, O  b" u7 a; q+ L; `
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名:58元
) X! E1 \: I% q</a>3 {5 m0 o8 O/ v
<br>
; o: s- b) i2 H: k# t<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名:110元</a>9 v: N* B( e7 Y+ ]9 d6 x4 n' g
<br>) O; n) K+ h- u; x- T' h+ T
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>+ l- M8 F# L* N% j& R$ E5 Z
<br>        / k1 E) `7 n6 ?
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
' `3 y0 q4 j; g# t9 J<br>8 P$ O# C" A8 _; a# P; G
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>+ n0 Q  P. e) b
<br>
! ?1 [, L# N' `  L<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>1 [! B4 G+ y- Z2 k* K
<script language="javascript" type="text/javascript">
( P1 g' Z9 o. D5 p7 e* {$ F3 g9 Z% r<!--" Y7 U9 M3 P1 U6 B% s
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
9 Z: |/ b& B5 M4 @3 c//-->+ p. O9 c* a3 ^7 y& Q. _
</script>

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