|
  
- UID
- 133
- 帖子
- 51
- 精华
- 1
- 积分
- 186
- 金币
- 55
- 威望
- 2
- 贡献
- 0

|
网页之文字的循环闪动特效
<script language="javascript" type="text/javascript">* }" E, o- I% i- |% g+ C
<!--
- @/ }8 T% m2 G" g" {// convert a single digit (0 - 16) into hex$ ]! { ]* i' y1 U4 s6 _7 s
function enHex(aDigit); o0 Y8 F1 p: e" v8 D* B! D3 q0 D% H
{
8 S; q ^. f2 [3 D* ^- Q return("0123456789ABCDEF".substring(aDigit, aDigit+1))* o D* D7 M* q3 g0 R& y* w! M
}
6 |. w0 `2 X6 D! n# }. v3 b// convert a hex digit into decimal
5 g5 |# F( T% r' Rfunction deHex(aDigit)! [- A( I7 X1 L5 |
{
8 b3 _- F$ a+ {! Z1 S* ]5 k return("0123456789ABCDEF".indexOf(aDigit))
' o" o# Z$ E8 v0 {5 n# [}7 _ H2 O8 A- P, _" _+ W* G
0 H0 W" E1 o! O% _4 Y0 y$ C
// Convert a 24bit number to hex
+ I7 K% V) ]$ u" Q1 ifunction toHex(n)
( {' u/ a( ~7 [$ Z{; X/ h* [* [, l6 N
return (enHex((0xf00000 & n) >> 20) +, N2 e( _. |. i% v, e% [
enHex((0x0f0000 & n) >> 16) +. ~3 v" e+ S/ A, Z( w8 n
enHex((0x00f000 & n) >> 12) +; R/ x* J/ c1 w A4 q( U3 H
enHex((0x000f00 & n) >> 8) +
) n: x% l+ W4 s" H- O9 g2 c enHex((0x0000f0 & n) >> 4) +' i2 j5 D8 V4 ~- C7 U6 ]) V' g1 n
enHex((0x00000f & n) >> 0))5 y1 ~" m/ F6 _ `: E0 }
}4 J" X+ O. ^ P: z; i/ ~1 D% j; B
// Convert a six character hex to decimal6 J; i: J* |. A- n( i! z
function toDecimal(hexNum)' w" S* D( j! y1 T) E8 `1 O' g
{
1 M: Y( Z' R, Z% I' Q7 [6 K var tmp = ""+hexNum.toUpperCase(); \+ t7 J3 `, _" k. W b
while (tmp.length < 6) tmp = "0"+tmp( q* ` V/ o1 q; ^3 C
return ((deHex(tmp.substring(0,1)) << 20) +- I- E' |. \/ j1 N% A$ [, u
(deHex(tmp.substring(1,2)) << 16) +
" y4 z& ^7 u9 M$ D5 Z (deHex(tmp.substring(2,3)) << 12) +
4 h& [1 {$ w0 A6 ^ (deHex(tmp.substring(3,4)) << 8) +
% E' X- N, D0 I. A0 n8 D% x (deHex(tmp.substring(4,5)) << 4) +
) I! D% }& G6 f. u- C3 J (deHex(tmp.substring(5,6))))
8 z6 k& s: ^( _3 _5 `}
* q/ ~, E6 N( Z, P///////////////////Shimmering Links/////////////////////
, [8 ?6 \5 |- U/ A2 H//global variables
) i( o7 B) N/ K4 ~var hoverColour) w. ?1 L; M) ?' J
var numLinks;
' q% v" o4 f% a0 }8 R2 Xvar rate;
- q* A# U8 x1 W! U& cvar numFadeLevels;
, @5 E0 L! G( U- bvar bgR;8 s5 b" B( o7 x( M: {( o
var bgG;" K$ J% n4 o. Z+ o1 a$ Y9 f. H
var bgB;
$ ?* Q( J0 Q% D$ [1 } Q6 V. W) H8 _( Rvar currR;
: |# @% P4 I7 T) Bvar currG;+ @6 ^( t" P) V" r, S1 {! X
var currB;
. p" P2 x) u; J9 w8 [! \var count;
4 p. f3 I2 d' I: Avar fadeOut;
: ^2 v+ x3 ?: G2 q0 K+ a" j$ Zvar continuous;6 ]7 J( f8 c R; f* j7 m/ x. b( k
var newColour;: @& |& k$ z( Q' |
var tID;
4 G/ Q; \; X+ M6 Z# z# z( tvar redInterval;
/ o3 U3 `+ b8 S) ~% E1 |: d6 Mvar greenInterval;
0 p: N! {# n4 H# |& v9 G+ S! jvar blueInterval;
Z h+ K, z: p* {, F3 \4 Zfunction initLinks(mouseOverColour, numberOfLinks, fadeOutColour)# b5 N1 ^3 E# D2 E
{
1 ]3 Z a( [: B4 S: O hoverColour = mouseOverColour;
1 A) C0 U) i3 [$ N numLinks = numberOfLinks;
" M6 z! r. b- o/ B3 G' _4 ` rate = 1;
0 p( f2 Y S7 l, F U0 ^ numFadeLevels = 30;) H1 Q2 ]: r) X# I. d1 C
function initArray(theArray, length, val)
2 ?" Z) h6 j) @) V6 T! M* j {# f) L! S3 `+ t3 ?
for(i=0;i<length;i++)
; B$ R# @# R. z {- n5 u/ |; N4 ~0 ~! Q! R6 ~: Z. o
theArray = val;, h( p; N$ |# w2 E1 p6 \. i" l
}
& {9 d, K5 r8 R! [! [0 { }
' r4 z* Z; N3 C* Y bgR = '0000' + fadeOutColour.substring(1,3)
) }/ z: [7 m: e/ B( ]- Z; g bgG = '0000' + fadeOutColour.substring(3,5)
4 k, m3 X4 @+ H. J( }5 J* ] bgB = '0000' + fadeOutColour.substring(5,7)
0 R# J6 x( w. ], H* w4 T* Q& y currR = new Array(numLinks);
3 {+ B+ J1 |/ P: w+ I currG = new Array(numLinks);
7 F7 ]) W- t) K9 q% j3 c currB = new Array(numLinks);8 g6 Y# C9 Z* {2 z/ E# Z& ^, T" w
count = new Array(numLinks);- H( F N' F; L6 G6 n" s
fadeOut = new Array(numLinks);
2 l; e# `* a; n: [; g continuous = new Array(numLinks);
( m7 `8 M+ R+ n* e( Z, g0 ^ newColour = new Array(numLinks);
5 H! l* t) @. g3 e! S+ H/ T7 b tID = new Array(numLinks);
5 @8 b' r& D8 a redInterval = toDecimal(bgR) / numFadeLevels;9 N8 ~- W8 p" ^( `8 T4 k5 u7 t5 E
greenInterval = toDecimal(bgG) / numFadeLevels;, |+ C9 }3 t$ ^& J: x( ~, {
blueInterval = toDecimal(bgB) / numFadeLevels;$ k$ `# Z! c% q/ S9 F
initArray(currR,numLinks,0);" P0 D9 p0 S9 }5 s
initArray(currG,numLinks,0);
+ j ^- n' n0 I. ` initArray(currB,numLinks,0);
3 O# M# A3 J# a( [ initArray(count,numLinks,0);4 e9 \- f( z3 [5 m, U j
initArray(fadeOut,numLinks,true);2 Y" a6 m7 \! p0 a
initArray(continuous,numLinks,true);
/ F' `- ?* C7 G0 |: G" K}
; V9 s& r7 E5 Lfunction startFade(id)" u4 ^* R9 v: D9 R! _0 G( g6 g
{; \" J' e6 ]9 ]) A
if(fadeOut[id] == true)
7 E/ r% R) R( r5 M { /*move colour towards background colour (increment)*/0 n, k# k/ ~& l, C5 G% k0 Q
currR[id] += redInterval;
5 \" J4 R9 A( x9 b% W0 N; x |2 S currG[id] += greenInterval;' t" h: ~9 H& @
currB[id] += blueInterval;7 g& O$ m* u$ b
newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);2 {% e/ {4 u( O: Y/ m
if(++count[id] == numFadeLevels)& A: w3 i; ^' s
{( u. ^( z) j7 z3 F
fadeOut[id] = false;) ^- ~, w2 x/ b4 \# r
}
k. ?2 G7 ?/ ^2 L" |! y8 R7 p }
% q* [* ]) L0 \" I3 \" ^# J else% ?, ?; l* \( z8 {/ I: j' v- s7 V" l& \
{
7 ]7 W* @4 K' [8 b, ]5 W9 Q currR[id] -= redInterval;$ m$ {" E2 M) g8 |& a
~/ e" x8 H$ {2 `+ i
currG[id] -= greenInterval;
3 m. h: J1 T. {0 X
& K4 K y. ~- m; v' `7 V3 k2 R currB[id] -= blueInterval;
5 p F- @/ c. B5 C/ i5 Y: X, `3 \! x5 K3 {; `6 K* x' x
newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);+ [6 f0 t N* K" M, D/ d+ c
, t9 W+ A2 J: U, C1 j5 H1 d if(--count[id] == 0)
# }0 Q1 E" @/ X
- l8 h5 ]' C8 j! x8 w {
( e3 @+ A9 ?1 A3 S$ T. i" w9 b; X) V: ^+ u+ Z$ q3 Y- `4 n
fadeOut[id] = true;
. p, s, x. H+ e0 t' _" z
2 y/ x# \7 e; k }% \. |' D7 F. }9 n8 }2 {: N* x
& f. j y- N. k5 h5 z }
g' {- N4 r, {4 C& l1 r, i" N
2 Q k- x! n; h, f. S- W if(continuous[id] == true)2 R4 Z6 ]' R4 h
# I/ ?: o* S1 q" V
{
6 I# F) t8 u% w$ w' Q$ h
! J* @% S( z0 x9 D+ K: s document.getElementById(id).style.color = newColour[id];
1 G( e2 ] z O% ^8 f% J& v3 l/ v7 t" r4 M3 V' F
}; n5 f1 {' \2 B# X7 j/ _" c7 ]
" T, P m( @$ ~3 K
else
& f' R: |+ ~, Z
0 ~- [+ T# w( q, y1 x8 h) h" _ {
; x$ W0 }# ^" e) r7 D S- {" R6 a4 |$ X& G, [( @- U2 z+ f3 n
document.getElementById(id).style.color = hoverColour;
( A$ D4 r- C9 ]( b! N+ V2 v+ S% I6 n" c3 C: ]
}
7 }& y6 d) {9 G8 Y3 e c. j+ h
; T! Q+ g, n7 M! p9 I9 @. [ clearTimeout(tID[id]);
' r. P+ O4 g4 X L. A9 O
2 ?, W/ y7 y# ^) a/ _ tID[id]=setTimeout('startFade(' + id + ')', rate);
6 u8 Z' g _& q4 W
) P* v( W4 K) J. |% [}8 R$ } ?* j) v0 x1 ]3 I/ V
- ~5 o, e* }" }" g; rfunction continueFade(id)+ _3 t1 N5 u* v; w
! Q+ {) ~4 _- e" W% u+ S# j+ v
{, M! i, z$ b$ `/ C4 X. a' j
3 q+ a: }! G* P! k2 c3 B9 O5 y
continuous[id] = true;
; X W8 Z( s3 d J$ P5 b4 K5 L5 q
1 W3 n- I- C9 H0 [9 y2 ]9 s}
) \, c% \: y0 K: D# T9 Z
+ P1 f3 `1 v: D$ [6 Yfunction stopFade(id)/ v' U5 V2 ^# s. Q+ ]8 w
% q: P4 o p* r. z/ P7 h, A+ J
{
( K$ {; U7 ]" p
3 h- z5 H2 c3 E$ i/ O& x continuous[id] = false;
# z+ O/ W4 A( }: t8 b# A- O" N: a) O/ x" u
}5 j) \: c+ K- p. P5 G8 Z/ @
, J9 x1 ?5 S, q+ l
function StartTimers()
# }7 [1 q0 g+ \! u& I \0 Z1 c8 J& L5 N ~ M
{ //set up an initial set of timers to start the shimmering effect8 V3 w: p+ J6 [- s6 G0 V) l. b4 X' N
3 @3 p( x! I5 t& ?- _
for(id=0; id<numLinks; id++)5 n! L0 T4 y: r
) _7 b2 d- h4 l! V! x: t4 ] {
/ J& B8 E- k& u( S% d, j" g5 G7 q5 m' X+ X* ^
t=setTimeout('startFade(' + id + ')', id*100);
8 z" j$ L6 B; P* O' U, E* u. P
}
, w/ D- E6 @0 J/ `. a- w0 n
4 u Q4 V Z& M. }}
4 |4 P$ @( C E# C2 `7 \/ B" a, v' R+ U; t0 K
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
) d1 j9 x, ~" t9 o) l/ J
1 _) w, |0 K% z- Q9 kinitLinks('#FF0000', 6, '#FFCC77');" L( f$ e% b( X0 ]9 k. _
2 @! K" E( N7 `% R! k D- C& F) g//-->. F1 ]& X1 @2 H4 v
( N: u- i7 [; j' c</script>( m/ Z: H% K0 ]* e: f; I B) ]
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名:58元
4 ^) E: v+ I& d$ V</a>
2 G8 U x) |! }; b h<br>% r6 X4 m) [; H/ d% l
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名:110元</a>
+ w0 a0 A6 h6 w8 {" ]! s<br>, b, U$ j K6 B
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>, Q3 w ^# h3 J5 R1 h. C# d
<br> 8 c1 w2 F2 v- G
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
. ?' d1 T1 j. y* E- ?5 Q' G2 \3 Z<br>* n& D8 Y3 Q& S" U; g) g7 X* {
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>& ]& J- \# S/ N/ w
<br>/ R, K3 `! o2 i
<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>$ c& G6 ^) ?. ?2 ^9 Q3 ?
<script language="javascript" type="text/javascript">
8 `1 F. l( X4 X<!--; m; ]/ o- X" O2 k
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
# X }. E( C; p$ m* ?' K. C//-->3 L: i% M- K _ i
</script> |
|