返回列表 发帖

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

<script language="javascript" type="text/javascript">
4 a1 D9 F) }- W<!--
4 B( O  y1 m- V  J0 I// convert a single digit (0 - 16) into hex  ?2 s3 M: h+ c& O
function enHex(aDigit)
! [. I: f! e8 N/ A/ J  _' Y{
2 S; [; f; ^0 g2 q; C, ?    return("0123456789ABCDEF".substring(aDigit, aDigit+1))# U( ?+ z2 T2 w' T& G' g- [
}1 j+ ~# Q" ~+ L; o# E5 {+ c& `
// convert a hex digit into decimal: X& p9 H$ h4 J  W; @! p. L; `
function deHex(aDigit)
+ N: e% @- s* h) q- r{
7 F5 {2 _. N, W4 p, g1 q9 S    return("0123456789ABCDEF".indexOf(aDigit))
' E( Y6 \! ?1 M8 p! ^: N}9 d* B# p1 ~3 B1 _( i

- F! _5 n, @5 ~8 v" K5 M* H// Convert a 24bit number to hex1 @/ v$ D, G0 e# e8 R2 B
function toHex(n)2 @% B9 H: v0 y+ ~8 F( F0 G8 I
{
. m8 a9 i1 G$ P4 Q. A3 P, z    return (enHex((0xf00000 & n) >> 20) +
* @$ K/ n7 l6 K9 n4 @            enHex((0x0f0000 & n) >> 16) +( N- o, a2 W( v1 g
            enHex((0x00f000 & n) >> 12) +3 Y# Y$ J/ Y& ^
            enHex((0x000f00 & n) >>  8) +1 o3 |. f- p* j# J
            enHex((0x0000f0 & n) >>  4) +( K9 n6 v8 m0 {
            enHex((0x00000f & n) >>  0))
6 b: W# l) `) n0 l- V& m}5 [* d& i2 `" F1 ?% N9 q
// Convert a six character hex to decimal3 a+ C$ X# t" s; T4 v) ?% H8 }$ {
function toDecimal(hexNum)
+ i- @, r  @7 |1 h, B" T{
# [- J1 O& x. d6 F           var tmp = ""+hexNum.toUpperCase()
- E( v# O- t) Y5 u- m4 n    while (tmp.length < 6) tmp = "0"+tmp. z: q" v* x' j+ ^& E4 U9 h
           return ((deHex(tmp.substring(0,1)) << 20) ++ A3 V4 h" u! d( o
                   (deHex(tmp.substring(1,2)) << 16) +
% ^, u9 s( U% ~3 h/ l5 W            (deHex(tmp.substring(2,3)) << 12) +- y3 G0 K9 V) Z" }2 y) `- L
            (deHex(tmp.substring(3,4)) << 8) +. H' _  @6 k4 X2 @' \: @0 A, Z
            (deHex(tmp.substring(4,5)) << 4) +
. B8 s- H, B$ D4 \8 l0 G                   (deHex(tmp.substring(5,6))))- q; i# S0 V( z9 f1 J0 A: C
}+ U# Z0 z" t) g, G7 V4 c% Y) C3 z1 t
///////////////////Shimmering Links/////////////////////
; i! ~9 R# V6 r! ]; x% {" r//global variables& D; {( H, o+ w% e0 I* x4 D( v7 A
var hoverColour
( ~* f& i9 E: |8 Vvar numLinks;6 Q% C$ W& h8 q, S: N1 O
var rate;/ j. l9 F' c+ Y1 X8 \/ d
var numFadeLevels;
4 ~9 |" G9 N. Q  Vvar bgR;
+ ~& j2 Q/ J* m! F; ]1 M- kvar bgG;
+ T0 Y% V) Q$ y7 }3 |+ n# p  tvar bgB;
4 s7 h* {  F; }+ n. R, U  Zvar currR;
! D) @3 A7 U- zvar currG;' G# \4 f% T& m  r* V8 ]( q
var currB;
8 u2 }# T8 [9 G* `) t  c+ |& ]3 ?var count;4 m  [; Y- M' m4 F
var fadeOut;
! ?0 |) \9 ]- l! L2 r/ N  w' r5 P; X: Svar continuous;/ I1 c! Q2 U- i# c* N) M8 {& o
var newColour;
1 H4 E7 e5 G, R3 j$ z' J( o# Hvar tID;
% Y& r1 K) B9 G, B% {3 P  `/ ]5 xvar redInterval;
* H) C. t8 x. m! H* H3 H1 Hvar greenInterval;8 h: P1 {4 N) J
var blueInterval;
5 l) M4 ~3 r3 D, w# M6 b1 Pfunction initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
# N1 S1 |( p+ W8 Z1 C{6 ^1 q- I& J* Y
        hoverColour = mouseOverColour;
$ ]6 b) }9 h$ j+ u1 n" m4 o( l2 H        numLinks = numberOfLinks;  L4 A5 C9 ?" u- g2 y" M
        rate = 1;
5 [& |" k6 \# h$ C  ]9 n        numFadeLevels = 30;
; E* u! O) E8 r9 ?1 p        function initArray(theArray, length, val)
% J7 v: g& j& }, ^        {+ M5 d3 |/ N: Z
                for(i=0;i<length;i++)
( c( j' F( B, \) w' v/ }                {
. h& }/ z  ~5 t7 H2 h2 }, U+ d                        theArray = val;
% ?3 ^! l7 P9 x. V  t9 |                }8 l5 J9 k$ [3 O, j7 X
        }1 V- m, L4 S6 ^. `: _
        bgR = '0000' + fadeOutColour.substring(1,3)) J& _  S( L  w; j; `
        bgG = '0000' + fadeOutColour.substring(3,5)/ h3 U, ~" T  v
        bgB = '0000' + fadeOutColour.substring(5,7)
4 \/ B9 J0 q# w# f5 O, }: W        currR = new Array(numLinks);
5 D, ^+ E5 q1 T. _        currG = new Array(numLinks);
. {1 X& ]' x, z4 m. s) L        currB = new Array(numLinks);& _, N, g5 b& b; n% L7 a% ]
        count = new Array(numLinks);& k" [5 ^! B* S! p7 O) c
        fadeOut = new Array(numLinks);6 w6 T* a9 J# Z
        continuous = new Array(numLinks);! W  m) b" S4 L, F! @
        newColour = new Array(numLinks);
& \% @$ a5 |$ C1 q, v! H        tID = new Array(numLinks);: ^! x% p/ E2 _& o) ?  Y- `
        redInterval = toDecimal(bgR) / numFadeLevels;
0 x6 E# c8 z) ~' M8 D& H        greenInterval = toDecimal(bgG) / numFadeLevels;
: X- F& V, H7 {7 h! h        blueInterval = toDecimal(bgB) / numFadeLevels;
+ }3 D7 ]9 Q% _' v5 k: E( X' N        initArray(currR,numLinks,0);% u8 s" g1 e9 a. b" Q; o' ~
        initArray(currG,numLinks,0);
. ]" U5 z9 Y& J; X        initArray(currB,numLinks,0);# d! o2 y# w1 |" [8 d7 R" P% Z' C
        initArray(count,numLinks,0);/ e4 D2 T, f2 I- Q2 a
        initArray(fadeOut,numLinks,true);: O2 T: |9 S( Z, p* h0 l( |
        initArray(continuous,numLinks,true);
- u) T8 C/ n) H$ k& \7 s}       
% h% O( m: s4 n7 |function startFade(id)
4 e9 k& |! X' F{4 A. K$ p' X. o# S# T
        if(fadeOut[id] == true)" \$ ~; f7 g/ M) Y5 o' d0 y' d
        { /*move colour towards background colour (increment)*/
2 a4 ^5 }5 L% H0 d/ o8 \                currR[id] += redInterval;
. \7 N9 \) A! @' b* H                currG[id] += greenInterval;
* T' z1 O+ P8 x: _4 B3 Q                currB[id] += blueInterval;7 M7 [9 X% r' n& {/ O6 ^3 j; A, N
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
( G. l" b& Z5 b! e- c" e                if(++count[id] == numFadeLevels)
1 o4 y+ P9 s, O7 {" e7 R9 y; ~" P/ G  e                {' [) W0 h5 z1 n/ M& j: T
                        fadeOut[id] = false;: o9 ]- v6 F* Z
                }
! O* `. ]2 t- A. k0 T$ _' e        }
5 B5 C% z) g7 I) B        else* ]* }* \0 T* d& G6 ~+ K! ]
        {  ~8 S& N$ ]5 I, n( z' G
                currR[id] -= redInterval;
/ a5 h/ c" f) n# l0 _" W
" j' R& J7 O8 G# x$ \( m0 t                currG[id] -= greenInterval;
  P7 m8 N5 n1 F- W- t, E/ E' r7 a5 p: J6 o9 u* y
                currB[id] -= blueInterval;6 \) }) [5 @# t8 J9 @
) q: I" [* ~7 a' B4 G
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);; t$ D" \6 p8 v- R* N- B

3 V# Q! |* }0 f& _2 l" y2 u7 J                if(--count[id] == 0)/ U; }/ x" y. ^; M/ L$ s

1 H, V3 S# e* l, l% Q                {8 |( v/ s( L5 u9 O$ D) T& B+ I
/ i8 N9 Z$ [, @
                        fadeOut[id] = true;
3 d( V" }4 k- P) y* K, R, M4 L$ g4 C) \
                }
6 x9 [4 |, d" u" w3 \! r
0 ?2 J# n5 n! ^/ M" y        }' C* u: f) _' ^0 [6 f0 ^3 g
8 z+ O0 W/ Y" U% H6 m
        if(continuous[id] == true); |# ]: n8 o; |2 C6 Q

4 X, H: A1 I- s! i- d2 X        {
- M$ n# W# U% k
" G+ [. t8 p5 n, X' E                document.getElementById(id).style.color = newColour[id];                6 d$ C. V: x; Z! A: j0 q( i

) s3 V% {2 R% O7 L) \" K        }4 O5 J1 \& l( d: m2 ^* j2 x3 p

& o) r8 `0 A' A' q        else
# o" B3 u/ \+ S, m" s/ v
; z* x( U2 h0 a; U0 l2 g        {" c5 n) Z* g* Z3 l

( \8 f$ P3 Z9 J9 Q  _                document.getElementById(id).style.color = hoverColour;6 K: P. n# Q& ~5 n1 [$ P: }) j

( N% R* H9 N! O: h1 l4 z        }
# v$ E2 G# S3 ?7 y- n9 y
+ S$ q- v% x* A7 o        clearTimeout(tID[id]);
# Y6 U/ V4 Z0 F/ d# K
  b) l5 R# G! E3 G        tID[id]=setTimeout('startFade(' + id + ')', rate);  b' v% Y8 m: @* p

- y# H9 J: S+ D1 _+ q8 v1 y1 `}! h+ n4 s  d. c7 n: Z7 A
4 P0 }+ P4 b7 z* P8 D1 L
function continueFade(id)
9 e4 z8 `. O1 `( o& L
- x* r" ~9 Z& M3 \# p3 ]; Z{
/ @. {3 R, _7 }4 d5 x$ C' l- m5 m) a+ R
        continuous[id] = true;
1 W3 l' Y% x0 B
: r% C7 H9 g% m- r* C+ ?) l" |# f}
8 [, H# z4 |) e3 u4 _6 ^2 T, L
' ]2 M% m# T* m- ~function stopFade(id)
" G. ]4 {9 b& y6 O& M
* |3 t; B5 t; w3 G{
5 u: b! [0 E; w  d% W, `5 d7 R0 H% B
        continuous[id] = false;
$ Q# U, L; u0 C' p* o- _- j( }6 t4 Y" c1 b
}
' P& N5 a6 M( L1 m
& f1 W9 P6 j0 ^! K$ ~function StartTimers()
; U3 @4 ^& W! M/ H7 m4 O7 v- t: ^7 |8 b, P9 r2 g5 y! i* U
{        //set up an initial set of timers to start the shimmering effect
% L) B& X- U- I: F" X+ v3 z) c
& f5 ~2 k( C+ D8 j        for(id=0; id<numLinks; id++)  w) B7 R& X$ R. W: G
. |$ f5 q: o. l4 L
        {8 s! m% G) S+ C

+ [6 f& b5 z5 [+ p0 |+ K' r                t=setTimeout('startFade(' + id + ')', id*100);& O- z. ]" }9 U0 P3 ?" \  w$ J/ [
6 T: e# M1 ~; d+ u
        }! H# J8 s+ w3 q: A

9 I9 @  R: ]' s' T  V! k. ~! K}
: Y- L6 S7 E5 _" u0 I; P2 C! `5 F5 u7 O
' I! Q6 }- Z0 D( W8 ]% s1 i//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')- s% @1 y0 m* N2 f6 a/ }

6 ]/ Z3 z- i- ]8 G( z2 uinitLinks('#FF0000', 6, '#FFCC77');
0 A1 @' Q) c, H( c* Z. k& Z5 }3 a! m# p% h) i/ J0 |! C
//-->* V$ \9 [1 r! u# B$ L" C
6 |: U' H+ r2 Z* ~8 P
</script>. b5 \4 X4 A5 {; M! f, K
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名:58元' @: c" c6 B  Z6 f7 c& }
</a>
; v& j' E) s) N2 P, {0 `% |# }<br>
  P3 w# O& f9 u1 V2 w# S. M. W+ Y<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名:110元</a>
5 h- g* ?0 e5 H+ I. C6 B- `4 G<br>* ?$ a" g7 J7 j6 r
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
% E1 a# e+ }, W4 f. v) F" k8 ~% l<br>          v% R& g2 Q* f! u
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
+ i! z/ _2 S5 W# v$ r8 a: ~/ C! {<br>0 p( o: E0 Q' C) S
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
3 f4 N* E( ?8 X7 `/ t- |<br>
; m- w, L% h5 r+ k5 _<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>8 _* S$ i, ]. N0 }% g: w
<script language="javascript" type="text/javascript">
9 n( a, G1 l# n9 d+ W  A9 i<!--
: L# Y) |% Y. \* |3 ]4 @/ rsetTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
: }4 {; p: k  I9 I: i1 r; S4 S//-->. j; \& S4 k% n7 ~9 [5 @
</script>

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