返回列表 发帖

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

<script language="javascript" type="text/javascript">9 `6 [+ M" N3 [
<!--
6 o) V3 N' ?6 w1 z$ X- O// convert a single digit (0 - 16) into hex
8 c3 h8 ~+ S9 ]7 b* ?function enHex(aDigit)
; c: L' {. T, m* R4 L{
) ?* G3 z9 r* e# E$ N    return("0123456789ABCDEF".substring(aDigit, aDigit+1))
9 K" z, w6 [) I) S* C/ K}
8 ], L: N. Z( n6 s// convert a hex digit into decimal
' g  P$ J# U& ]& f2 `function deHex(aDigit)
( R7 t% p+ l) R- n0 i, Z- Z1 g{. B2 j3 K+ e2 P; G6 J+ }
    return("0123456789ABCDEF".indexOf(aDigit))
7 E$ y+ W- t0 w}( p# }' E' H* V& r  f; G

! E4 N" e0 @2 }: g2 X- R// Convert a 24bit number to hex
' e. K) ?( Q" L& a6 ffunction toHex(n)
6 E0 O' ^% {' f- B7 O9 Q) {9 b: W{
+ B5 O, c" L5 l2 R7 w1 F    return (enHex((0xf00000 & n) >> 20) +5 y" n5 O0 V5 F( m) ?. m# t, ?+ m
            enHex((0x0f0000 & n) >> 16) +, a, Y. [. o1 G) f& N3 a
            enHex((0x00f000 & n) >> 12) +
" U0 P$ q  H# c3 {            enHex((0x000f00 & n) >>  8) +
7 U+ B% d4 H6 t, X" o  r# t            enHex((0x0000f0 & n) >>  4) +
* _9 u6 f% n) ]. ]            enHex((0x00000f & n) >>  0))
$ o/ X) y" D) y# U* U}
& J2 V( j0 g4 z6 ^/ S- F// Convert a six character hex to decimal! g9 {5 j% w) u3 r) c
function toDecimal(hexNum)5 t! R; Y6 [" m( y/ ^. o! c
{) u' h; P% C' @% B
           var tmp = ""+hexNum.toUpperCase()
8 k1 e* r. `$ H# P* q4 z" ?; p    while (tmp.length < 6) tmp = "0"+tmp
' y  m1 N1 M4 Q+ [           return ((deHex(tmp.substring(0,1)) << 20) +
1 t; n+ h, C# `) O/ b. e. U                   (deHex(tmp.substring(1,2)) << 16) + : [, d! |7 e% D3 a8 Y! H
            (deHex(tmp.substring(2,3)) << 12) +
# l/ O% L4 |2 M! V7 t5 l' s; s/ W            (deHex(tmp.substring(3,4)) << 8) +
+ X" Q. P. ?) f6 ]& i5 v            (deHex(tmp.substring(4,5)) << 4) +, y9 W! \& v; b# q0 k
                   (deHex(tmp.substring(5,6))))9 J  N% t+ u/ B
}' h. V4 r) @+ @" h5 x
///////////////////Shimmering Links/////////////////////
: V* `- i* b( s' Z% T/ E//global variables
% R7 c8 Q+ b0 n) t, avar hoverColour% }: h- y' A9 g+ ]
var numLinks;
8 d8 L" b8 b  S2 X7 g' h$ H6 [& L( Pvar rate;1 e; h7 |( v* ^
var numFadeLevels;3 q% @) c9 ?1 e7 l6 V% r9 f) U
var bgR;  q! L' a# b- F% M4 Y5 Z& y
var bgG;
4 k* b8 r2 `* w0 O! ^var bgB;
7 x9 C: S" H8 T2 e+ Mvar currR;4 Y9 m2 B7 {$ _& @" r
var currG;
& C/ F1 N( B) \1 H8 a8 g0 Svar currB;1 ]: e5 a9 {; i' ?
var count;
4 W; k5 n- k5 S: ^8 Evar fadeOut;
+ O3 r& l) k( s$ f9 A6 B: z% g( }var continuous;
* \6 L7 U/ C3 g8 R8 cvar newColour;* W7 W; N3 u) Z1 l6 ^5 t& P0 V% p
var tID;
* `0 u. n$ S$ g# H5 |3 c) rvar redInterval;  `- z( N) `0 |
var greenInterval;
6 p$ z( t) u. ]0 z5 R, ]var blueInterval;
' @0 p0 u5 }5 Y, ^! ^2 {function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)5 \: P9 h' C6 j- O( s% M
{
& \$ G- V4 f& S% j2 t& _; _  e+ `, L        hoverColour = mouseOverColour;6 n  B7 s, l/ C4 G( _) m7 R- r
        numLinks = numberOfLinks;* k+ i  }0 O/ e7 Y9 j3 l
        rate = 1;
- @  P4 k3 i/ l$ j  `# Q- u- S9 I3 q        numFadeLevels = 30;
8 @6 c9 p7 w3 H        function initArray(theArray, length, val)
: R8 F$ D; h8 b        {0 g+ u# M& ]6 P# h
                for(i=0;i<length;i++)0 S0 b/ G5 x- A' q8 l" e
                {" ]6 P% N3 R2 u0 u; U
                        theArray = val;
* I2 O7 _' g( S8 V: x                }
  |' K: g( I8 x& s" X& G        }
  ?& I9 E6 _4 x5 ^( ~  i6 ~        bgR = '0000' + fadeOutColour.substring(1,3): ~3 x5 f) c* h! l. A$ X1 b
        bgG = '0000' + fadeOutColour.substring(3,5); x4 Q" p$ {: k8 M
        bgB = '0000' + fadeOutColour.substring(5,7)  G% x" C5 I7 a0 {4 _4 g
        currR = new Array(numLinks);' ~3 C$ @5 C, c
        currG = new Array(numLinks);2 o9 H* E+ Y, e/ m3 ?
        currB = new Array(numLinks);
- S; N, ~) N, d8 W; h3 h& V+ i9 ~0 C        count = new Array(numLinks);7 s. ]0 @6 g- P+ s" Q- ]
        fadeOut = new Array(numLinks);; Y& \3 o8 J) w; u- G
        continuous = new Array(numLinks);. {$ E! B/ U3 c4 J1 X- N0 d/ J! }
        newColour = new Array(numLinks);: J- r- o2 j7 x- I
        tID = new Array(numLinks);
& b# Q) x. J9 s6 S/ w        redInterval = toDecimal(bgR) / numFadeLevels;+ w" B, h' O1 p0 l: P* D
        greenInterval = toDecimal(bgG) / numFadeLevels;
: [  H2 G) O9 b! e( z  x0 D6 }        blueInterval = toDecimal(bgB) / numFadeLevels;( l7 N6 u# `, C9 ~9 o& y  I( D
        initArray(currR,numLinks,0);
& d5 @! s# P: X9 Z7 f# {  g- ]        initArray(currG,numLinks,0);
, Q( G5 O4 [: W        initArray(currB,numLinks,0);- a' n: D! S  I) @( |7 z1 u
        initArray(count,numLinks,0);
# }* X8 R4 v3 n& V9 C        initArray(fadeOut,numLinks,true);
" M2 N& o, m5 I: b' I        initArray(continuous,numLinks,true);" \! U$ d* U8 j$ n( x
}       
7 L6 ^, ?6 Z  ^+ Q$ I/ xfunction startFade(id)
! ^2 O+ @( N* q4 t: y{
: q$ e$ ?3 @9 @/ @. s        if(fadeOut[id] == true)) B' _  M, r& l& v
        { /*move colour towards background colour (increment)*/3 j9 P& y" s) R
                currR[id] += redInterval;
+ i9 m+ K& E, N% }$ v. w& q6 H" L                currG[id] += greenInterval;
0 x# M6 t5 {& h- U3 p! O                currB[id] += blueInterval;2 |! E! S6 }+ v: Y! X
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
. v2 L- z% F7 h$ e9 A# k# P                if(++count[id] == numFadeLevels)' ~' a) ^4 y. S- d
                {5 Z. b; Q' ]2 D) t1 r. d% K" T# P
                        fadeOut[id] = false;
5 ^  q, I/ |$ e                }* P" i* I* P& f1 X( d: e: x$ H
        }6 ~$ u- }3 D' A: m# e& R
        else+ W% L9 y) s8 X! O& ?9 p- U- U
        {
( `% G2 D' ~- {% e) u                currR[id] -= redInterval;* l$ {/ d& _: k7 L" M
. b# z, E- q3 T7 a2 X0 G3 [1 b
                currG[id] -= greenInterval;0 K  I1 E8 z2 I' L; k. _

, }8 @# V# ?6 K. O& h) c3 v9 @                currB[id] -= blueInterval;3 ]6 Y; |# M2 m: r1 W

3 z2 B2 W& b( M                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
* |, N( K8 n/ l5 F6 ^3 w; z) Y  |4 k% U: X1 j
                if(--count[id] == 0)
1 E: ?% D) |. r6 |6 J% B4 s% s8 e) R$ `4 _) r% D- g# {
                {
7 V4 P* @) Z' [+ k( f( |- i1 b4 Y' I5 q+ _# B4 e
                        fadeOut[id] = true;, O1 Y7 R4 t1 Y1 K' X+ }
  d6 y0 x, g' Q, u. H/ D4 x, M( Q3 i
                }
+ ^' K- s, F. _; i' c( J$ y+ \- E# S& F2 x0 Q  b, [( ?; |
        }
4 [/ o2 P9 N/ v: Q, d/ m
2 ?- C3 [/ }. ~5 W( e' ~  F# h        if(continuous[id] == true)
, S/ ~4 c, @" Z4 ]1 l/ m, {" Z/ f! I5 ?  Z
        {
1 C9 F( G$ C" O! K
2 o- x( ?- o5 F: z% z) c1 q                document.getElementById(id).style.color = newColour[id];               
, @$ [0 x) }' H$ u1 C
; p3 I# [$ I( C3 V! k        }
8 @# k  E/ Y5 R7 E0 F5 e5 g: m# P4 S" l9 v4 O7 r3 Y% u; b
        else
) `* M; H$ e8 D. R) W+ j
/ `* A; J. V! Q4 D$ [, S9 A3 e8 B        {6 k7 j" g6 G. o& R5 Y$ C5 J

$ v8 Q2 i! m. y- [                document.getElementById(id).style.color = hoverColour;5 x( B0 l' m& \0 n

# ?- j" ~6 W8 ^4 {1 \2 a' a        }( O% h1 a# u8 b0 U. l) R" ]) \% K
; a' L+ s# c# R) f, h' g: b
        clearTimeout(tID[id]);
2 h' H$ \9 n, T5 X3 r* s- J8 x3 B; g* O6 t# L
        tID[id]=setTimeout('startFade(' + id + ')', rate);% A: ^* f$ Z. o+ g

$ J$ @) ^% ^/ P6 Y}
/ N3 a  Z" j5 C  W2 x
; [4 [1 k# Y9 ~& `function continueFade(id)
' E% V7 L6 e7 f& p# ^' Q$ E1 j6 G8 H8 j3 W, q: I5 G6 z
{
( t" B8 f3 g5 Z0 E3 e
+ b- f# }2 \# [7 w        continuous[id] = true;
! l0 ~0 g9 o8 s( Y' z8 Z
, G- E. F! s3 r; r# A5 T' V}
! u. F- ?$ K: ?% h7 |6 e& ?* w. T' X! e2 V( J8 @
function stopFade(id)
4 ^3 Q* N6 d6 H8 b
; Q! Z% m. M  v, C{
, F/ G+ Y- D  y) f/ O% {) h- z" b% {! O  x' d
        continuous[id] = false;
; v' n4 w  c- K
& r. Q. u9 Y( o8 |& \4 @; q}' m5 k- j4 W' m

! T" {% e9 ?; i9 f$ E* Ofunction StartTimers()
# B, T$ D/ ]) F* O1 `
9 A  S0 W9 s) r* M1 y* A* Q{        //set up an initial set of timers to start the shimmering effect" i  _, e' d' k* `

8 d8 d+ f, i' `        for(id=0; id<numLinks; id++)
+ v/ S  v; D- p' |' [4 s
) a+ K& h2 u- B# w& s4 z. }1 x( p: h        {* Q/ ?! i! G5 p

" j( s: t' \; |8 |8 A                t=setTimeout('startFade(' + id + ')', id*100);
5 {* g# q+ B4 M6 M7 C- T
+ `/ C- a' Z( u6 r# ]: ^        }
$ n; r4 M& w/ j( E- Q3 i9 r* C4 @! `& a
}2 e: N- m" s* z4 m3 b

9 w" r" T1 h0 G2 x' `//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
# _" h  m/ `- X* Y6 Z: H; f" f- k6 n9 A# O8 y; ~6 J" \
initLinks('#FF0000', 6, '#FFCC77');1 U7 h+ O7 e1 |1 R; U
# M+ O6 G5 Q9 K! x% D' \1 g) S
//-->7 {6 [) r7 K2 m# K

8 T' @0 d6 J5 X% T6 g. z</script>
$ x5 w, f* H/ \; y9 ~<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名:58元
& B" ?; B$ u! X1 d; H</a>; S# m5 c; T4 b$ N! k% q& Y# v: ?
<br>- n2 i/ h% x+ k5 h1 b) F
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名:110元</a>6 B  ?4 J9 F( z) e/ a
<br>  g9 j  a8 p2 M  r3 r1 P
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
; C% v8 Y/ c3 a5 m2 M<br>        / v5 j# @3 B" ]$ \2 F9 [6 k
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
" d9 q( b& n& l2 ~<br>$ T: f+ b+ n" A9 s1 N3 X7 i
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>5 g8 j; h6 @4 u9 Q  U( U
<br>
) p1 y! g* p3 \  R<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>1 e) `  O8 Y2 ^+ P
<script language="javascript" type="text/javascript">* b" l) M! g) F# C
<!--5 `2 F8 l0 u2 o' U4 ]6 r2 \3 C
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
  L4 u% L5 O4 U$ ?0 t- i1 }% S//-->- N  Q/ D" X# G
</script>

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