返回列表 发帖

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

<script language="javascript" type="text/javascript">" ?! F  E7 O, q; g+ E
<!--6 e  M  v! w& o% I
// convert a single digit (0 - 16) into hex
9 c5 E3 s1 t- h) a; L# Hfunction enHex(aDigit)7 @7 g  G" p; e. G" y* h
{
5 K) g) l% W8 R. k    return("0123456789ABCDEF".substring(aDigit, aDigit+1))  E- H' f, w1 W
}; W1 G; {5 c2 J8 f: }
// convert a hex digit into decimal
7 f" B3 z4 o: H) `! ?5 B2 Mfunction deHex(aDigit)+ B7 s7 I. f+ Q: o! u. p! I# Q
{0 `( Q- u7 O+ W+ {6 n! S+ I. U
    return("0123456789ABCDEF".indexOf(aDigit))
7 g3 l3 P& ]1 d( R3 {}' H, P2 T2 S* F: g) a+ t
3 ]( H% ^' B) [* u- P" x. v& l! [7 ?
// Convert a 24bit number to hex2 v) d0 F$ i8 p, |% I
function toHex(n)
; e0 W( ^. p1 U3 ^. I' z{; c+ ~5 g7 T, \5 U+ c
    return (enHex((0xf00000 & n) >> 20) +
# O- s% z5 o$ v# o$ c" ^            enHex((0x0f0000 & n) >> 16) +2 _! o" }, T5 e
            enHex((0x00f000 & n) >> 12) +3 H+ D  |: _3 B0 {' |1 q
            enHex((0x000f00 & n) >>  8) +
! q# r4 M& U, j' z$ a. y2 U# R/ y            enHex((0x0000f0 & n) >>  4) +. g9 s- f3 d4 O$ U
            enHex((0x00000f & n) >>  0))# [8 ?, F7 f9 D. e3 E
}9 h7 F+ e) n4 N: L' A( h/ |
// Convert a six character hex to decimal) ]2 w5 o7 [0 Z& k5 X# a: {- R. z* ~- S
function toDecimal(hexNum)
. F" n* C% R% I/ {0 o1 Z{/ U  A" `- F, B; ~/ G1 W
           var tmp = ""+hexNum.toUpperCase()' |4 \2 H7 [0 u4 h% x' _
    while (tmp.length < 6) tmp = "0"+tmp
- X  \7 e2 {% {: {           return ((deHex(tmp.substring(0,1)) << 20) +% I$ g) K3 r% ~
                   (deHex(tmp.substring(1,2)) << 16) +
% r* ^2 d$ E' d" d9 p' x0 a3 ~' B& s            (deHex(tmp.substring(2,3)) << 12) +- _2 T; K7 e1 R) \# h& t. N
            (deHex(tmp.substring(3,4)) << 8) +8 T3 }. y8 h' [% n! J" s
            (deHex(tmp.substring(4,5)) << 4) +" P: g& Z6 S. m* ^9 k7 L/ j
                   (deHex(tmp.substring(5,6)))), G6 u. L( @/ W) }
}1 J+ r4 |4 j) z! E( V- X6 z. G" s
///////////////////Shimmering Links/////////////////////
7 D2 k9 V' E" G: Y//global variables
. M! b. X* {& qvar hoverColour
4 |3 Y2 E: A. x1 w2 D0 zvar numLinks;2 ^/ Z+ l. G4 W
var rate;" ~% j# `. h. X  {% q
var numFadeLevels;8 U8 m  }6 n' r( e7 r2 |) ~
var bgR;
1 T* u& R& @7 ]4 rvar bgG;; W4 z4 U9 ]* G( D+ |3 H
var bgB;
* C6 y& `# k7 bvar currR;( d: `! o6 [" r7 o  c0 c8 N4 a
var currG;
, T( f$ s& i) O6 W  v% Y% {; nvar currB;; F: Q/ c: Z9 X' U4 c& s/ w0 t
var count;, M- e( x, b  x7 A8 O/ |
var fadeOut;' [& h9 m8 Y$ H, q5 J1 C7 J1 ?
var continuous;1 w+ S# f4 _4 w/ B: ]0 `
var newColour;' B6 \$ I. |+ C9 @  b* Z
var tID;$ i9 U  f1 p( Z- J& h
var redInterval;
/ }- A' {) l! yvar greenInterval;- r/ \. w3 v3 X% k. N' S1 W
var blueInterval;7 r5 ~& ?& r$ V! l3 n1 C
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
% ~; P) I% W* r% |3 K9 m$ R{! h$ ], C) x, h* _6 I  `
        hoverColour = mouseOverColour;
. M8 V, Y" n' c4 s( X        numLinks = numberOfLinks;9 h$ M' [: c  b' P1 C/ Q
        rate = 1;
# i" r1 b. Q1 r) \# E8 E        numFadeLevels = 30;
( {, ^! b) [/ e$ }. |) _        function initArray(theArray, length, val)
6 |' [$ ~! P0 o" s$ `2 Y2 d$ H        {
) W+ x3 R0 Z. ~2 Y. Q                for(i=0;i<length;i++)/ \3 z! M8 Q* W
                {
3 H9 t/ |/ w) w3 ~0 }- a* O                        theArray = val;$ o' l4 }" `, U  o6 S' a3 k* q
                }
+ L5 S' ~$ [  r# i! _$ Y        }
. {5 \7 |8 f9 F  G" T* p        bgR = '0000' + fadeOutColour.substring(1,3)7 c- a+ M! _2 \( r- ^& Q3 i
        bgG = '0000' + fadeOutColour.substring(3,5)* ?9 k* D4 f. K+ ?# [6 l9 G
        bgB = '0000' + fadeOutColour.substring(5,7)/ ^" X5 A$ ~8 s4 j. V. @
        currR = new Array(numLinks);
4 W- D- ^4 q; y9 {        currG = new Array(numLinks);
9 d* a# g' x0 {' `* N! \        currB = new Array(numLinks);
* a3 m# W" ~7 Y4 @3 S        count = new Array(numLinks);7 R' p* }4 F2 R
        fadeOut = new Array(numLinks);
8 \2 _% n) @  k8 V: P1 E        continuous = new Array(numLinks);5 a0 c% J( D% H: q" U& i
        newColour = new Array(numLinks);" f& B$ V8 o6 f
        tID = new Array(numLinks);
% C' V2 p) }* _9 }        redInterval = toDecimal(bgR) / numFadeLevels;
9 p2 S2 X! y! i' Z* z* C7 y$ |& k        greenInterval = toDecimal(bgG) / numFadeLevels;; b: x1 e4 u, I/ o
        blueInterval = toDecimal(bgB) / numFadeLevels;
: ]* k$ v) c, F# n) L6 q: m        initArray(currR,numLinks,0);& C1 L! Y* G' P, K# I: _; e
        initArray(currG,numLinks,0);. ~9 x$ M/ d3 b" w3 F+ w
        initArray(currB,numLinks,0);
, e9 Y- y  ~! d% V        initArray(count,numLinks,0);, K  ]2 E" e  \8 h1 U
        initArray(fadeOut,numLinks,true);' w$ A0 D8 p* [. d+ z  }
        initArray(continuous,numLinks,true);
; _; y4 K. o6 q' }4 c3 m8 M  Y# }# E% B}        % y0 u# I+ T6 R6 O& p
function startFade(id)
! D/ {8 U" r& y; J. Z{" {$ Z$ e- v( {1 b+ }  _3 @1 n
        if(fadeOut[id] == true)5 x: _% r, U! M  J0 V! U/ X
        { /*move colour towards background colour (increment)*/' |. T# V. O8 x7 d. `  o0 |
                currR[id] += redInterval;, s3 X# A. |) ^9 ^; A: |! \1 r
                currG[id] += greenInterval;
0 o7 S8 M. {; t, N& d" A4 x                currB[id] += blueInterval;
5 s1 v  ^$ B9 P5 U( Q: j! N; Z& F                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);. @$ P' Z$ k, {
                if(++count[id] == numFadeLevels); F" y0 N8 p2 R, R9 o
                {
# {9 o; x8 S: ?( t1 S                        fadeOut[id] = false;. T& g3 X# ~3 ?" P
                }
8 O" r" X6 _' p+ p/ |. I6 J; v        }7 `. r. T2 t: r: M# F( D! M7 e  t
        else
  ], ^$ J$ B' c. ~8 F3 C/ @) ?        {' s" x9 {8 s0 I- C' Q. K- I3 B
                currR[id] -= redInterval;
& I! @, J& c. _9 E3 O# ?: p5 O( i: N- Q9 E+ x( }1 H3 f0 x+ P
                currG[id] -= greenInterval;
7 X3 Z1 ^! g. |& Z! w2 F/ V) u: B% @/ W, O2 w/ n7 ]
                currB[id] -= blueInterval;3 i, g! l) B$ e* ~

: S2 N& G& f% N, T$ D. |                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);& q5 Z1 I. F5 X# k6 C" E
& e" m; n) x) X) A( }
                if(--count[id] == 0)
$ s' |; t; @, \& e4 j" O2 c/ j- D; F: ^2 s4 Y% P. K. H
                {/ c9 s- @: U% l5 D* B/ \

5 X$ o) a: x: E( l! c* q0 t                        fadeOut[id] = true;
% O- C% M$ b1 m8 y  w
) \" m- l1 C! _, t+ Z$ Y, N) d) C                }
7 ]9 j" N9 `1 P* p! B3 X3 e% y9 t# ^4 e  w' b
        }7 ^- ?" g, S( Z. [& H
! D5 I1 n0 P2 N6 v. u
        if(continuous[id] == true)
9 {( e1 I; y  J) {" n4 s- Z4 J& D- N0 a; `
        {* R' w8 _1 z2 q2 x
: c# ?8 U9 c$ r' K" @3 i
                document.getElementById(id).style.color = newColour[id];                ! b4 r) Y: s& ^8 z
% c  T% b' P  U6 H) ?/ s
        }& m8 v6 V* _/ Q, k) D: }2 h
4 @% j: Y' J" F+ A5 n& q; d: \
        else
8 a3 v9 J' b8 h7 z5 C: L! W7 E+ Y; N2 p3 g& r) E5 Y& ?5 f  S
        {
8 j% A1 F- t& Q' ~4 w  \, d8 K& m
+ i: v* l" g6 {7 D+ Q                document.getElementById(id).style.color = hoverColour;9 S! K/ e2 i6 _/ a
; e7 I5 l: O" a- c% B+ ~( ^
        }
- ^' ^/ i5 x* S% h9 ]7 T5 W$ f; @  S9 Y* n. |
        clearTimeout(tID[id]);; M' Q0 Z5 E# g4 N* G, ^

' p" f$ S1 r- r+ ]' b4 C        tID[id]=setTimeout('startFade(' + id + ')', rate);2 _' |1 X0 d! M$ \! u

- J1 A, n0 ?* N}
2 |6 a: D) W% U) N$ |& U0 L* D2 w6 j7 t! Y% |$ Z
function continueFade(id)% q, \% {# v5 C- w- v' h

+ v4 K) U5 F' ^" p{
: n. L( o$ ?  H4 B6 t  c# I. u+ }* z' B4 q3 K9 p
        continuous[id] = true;
4 I4 }" J) H7 ^6 X7 \# c  Q4 N
9 P1 X+ C+ {. [1 V}8 @( a) b* k; f. D1 x

6 `" b9 M; j7 o2 P, t% W0 S: ?& Wfunction stopFade(id)
1 [# R3 _1 @. e. V, q5 \' W- O  z# ~9 X) F& [/ }6 r1 g1 L
{1 y, W1 Q- ~, w( C

) P9 _' C- {* a8 z) i' _) _        continuous[id] = false;5 S: }  S1 u% y9 n7 K

* m  t0 d0 P9 b% w8 ^}$ y' g7 y2 \; m/ J9 O! S8 H
2 g0 `3 }' I8 ]: N  v* k, P
function StartTimers()8 j8 j. Y7 Q+ j. m
7 ~9 q- _: R1 b2 _2 \" A
{        //set up an initial set of timers to start the shimmering effect1 V) r/ B& H! U4 u) ~/ L6 d8 N

# [0 P9 W( _: X        for(id=0; id<numLinks; id++)
# @$ z9 e1 V( E3 `2 o( v) y2 D/ ~7 v( R2 g- q" E
        {- D( ]& h" U& U; I( y# K

4 f, T3 }6 M# @$ _6 L                t=setTimeout('startFade(' + id + ')', id*100);
, r3 \# I6 a% i1 P
4 g$ f5 R4 A( P! Y1 m6 I        }, B. i0 E( K1 Y$ Y

- R+ k6 L9 P+ a: [4 S; D}
! G8 D" q' t# o5 L/ {( k6 L) c0 a- |# t- Q/ {  F0 L
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
& P" ]* S7 O  e4 M5 y# C5 `& ?* ]2 r
initLinks('#FF0000', 6, '#FFCC77');
# }& p2 _0 T0 h! u2 R9 H! y9 K  n- J
//-->
& Z% v6 B/ ^2 E- Q2 `, V- D0 P* f7 E% v
- |) X0 h3 m; Q* k$ v4 K2 @</script>4 s! g1 J0 ^& K/ ^) q
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名:58元
5 Z5 R% n+ f$ v</a>( l8 `2 {1 v' M; \  c
<br>% X# A1 F2 a, o7 n
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名:110元</a>8 @5 Z0 @0 U2 f6 o
<br>
+ P9 `1 _! D8 C7 X) M% i/ y<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>! U4 h0 e$ L2 L  i
<br>        ! m5 M0 B2 i% H7 b* `  F
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>/ ]- f- T$ b0 N; h/ u
<br>
0 k# h6 n5 o2 U) F* u4 G<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>! H* z. W& P- s5 q) R; v- b
<br>
; g$ R" ?3 ]$ U  k2 K<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>; D4 ?$ o4 Y) C
<script language="javascript" type="text/javascript">
: U1 S1 u1 |7 l) r) K) Z8 J/ a  k<!--; ^4 f3 m, S- r2 J! D, w# `3 M
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering! |4 p+ ]6 H3 y8 ]& H1 n
//-->
7 u0 r% g( S4 S</script>

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