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

|
网页之文字的循环闪动特效
<script language="javascript" type="text/javascript">+ u- v3 H8 K y+ _# s- k" r! N& \
<!--
) J3 | a' R! i: z+ j3 j& o// convert a single digit (0 - 16) into hex% }0 q f7 r! ^+ L
function enHex(aDigit)
& L& w1 E/ m5 R{9 h l4 d9 M- j" \0 o0 X0 F
return("0123456789ABCDEF".substring(aDigit, aDigit+1))
! F: F0 m* ~. n( m- E; w}
$ X) b4 O# c: r: R2 J// convert a hex digit into decimal
8 F/ U0 O% Z- `+ o/ o. h2 }* X- Rfunction deHex(aDigit)
: M! j- A/ P" B{$ m3 z% L% I# A' f. J+ P' c, l2 ]1 F
return("0123456789ABCDEF".indexOf(aDigit))5 H# D% s m9 g( G
}, \1 \' V7 Z/ g8 g6 O6 w$ R
# f) M2 O7 t8 E: u2 A% L
// Convert a 24bit number to hex
% K* i r; p& @( s6 T* Cfunction toHex(n). a3 z$ u$ \* |- a8 }' b' J5 T# H
{
8 k3 T: J. U/ H' K p return (enHex((0xf00000 & n) >> 20) +4 X% v0 Y' b; E5 P, H) m$ C. q
enHex((0x0f0000 & n) >> 16) +
B, F* V9 V& f: a enHex((0x00f000 & n) >> 12) +. Y1 J* Q3 C$ K" v
enHex((0x000f00 & n) >> 8) +# ]" ]* r0 `8 K6 b/ r
enHex((0x0000f0 & n) >> 4) + B) o- y# ^: i8 f; |' M) E
enHex((0x00000f & n) >> 0))
. X( K' a5 C4 c% M# k g}" d' j1 w' R) O. p8 Z0 @) B8 t
// Convert a six character hex to decimal
5 d- F5 J0 j# S# u* t. D; efunction toDecimal(hexNum)+ t. }9 |$ Y1 x" s, ]0 P
{
( Z- \7 C% e: s var tmp = ""+hexNum.toUpperCase(): H3 y* I, D& T3 s4 I! a! C
while (tmp.length < 6) tmp = "0"+tmp) \6 A9 @2 L, b7 O- _
return ((deHex(tmp.substring(0,1)) << 20) +
- {& X8 E1 J6 x7 |3 U (deHex(tmp.substring(1,2)) << 16) +
2 s3 s4 |3 p+ A (deHex(tmp.substring(2,3)) << 12) +$ x9 G$ o" H, ?* |. T0 H. k
(deHex(tmp.substring(3,4)) << 8) +; G& [" V0 t! X% k$ N
(deHex(tmp.substring(4,5)) << 4) + O' D1 ]& B, n0 ~) F" S
(deHex(tmp.substring(5,6))))9 M. i1 k2 ?4 ?+ s+ i# W
}
5 \; E: |# k8 O* a4 I! c/ Z///////////////////Shimmering Links/////////////////////* k r6 {/ N U9 h z! ]3 @
//global variables+ Q+ \6 Z2 B% H5 x O9 t( E
var hoverColour4 F( I# C9 y9 [2 m
var numLinks;
* P& |; x" W% X7 M- e) q& V& dvar rate;
8 j* X' @* R: C4 c8 T U( T: @* kvar numFadeLevels;
+ u" h {) Z: z! q0 Ivar bgR;
4 J5 H5 B5 J. r# s2 {% |# Kvar bgG;7 k! T e" y2 n$ E, I* s
var bgB;. G3 u8 K; ? \/ o
var currR;: H' t, o9 u+ X: H6 d9 X( h
var currG;# @$ n1 ]* M, g% K% T% s, g
var currB;! b2 @0 M y" K5 ~- e% `
var count;6 ~( d7 z( w( A: y, J, s- m
var fadeOut;
1 ?; n% b* u' ^. w" B/ Ovar continuous;/ C1 ^* U' u3 ]8 e y
var newColour;
( L0 S1 X# {7 ^: Cvar tID;5 I7 [' [0 G0 `: ^/ s: l
var redInterval;
) t ], U4 F2 o7 ^8 ]/ ], xvar greenInterval;
# S, H e" u5 F$ gvar blueInterval;
* L# v8 y0 a5 {1 e( [/ Afunction initLinks(mouseOverColour, numberOfLinks, fadeOutColour)% J% B/ x. T$ D) I( _. X
{
# L8 t( a/ L. W hoverColour = mouseOverColour; Z+ E6 r6 k- N% M
numLinks = numberOfLinks;* q. J$ a/ l) d/ C6 I: V0 g
rate = 1;9 t* |# ^6 d! X5 v0 ^+ X \8 P
numFadeLevels = 30;- U- o4 m, D, `1 D: z' G
function initArray(theArray, length, val)+ D; X, w4 y& m3 ?
{9 e$ A4 i/ _3 Y& W. B
for(i=0;i<length;i++)
6 Z' s+ ]" }" d: b4 ]9 q3 ? {
6 {5 ?8 o: v% u! B7 b theArray = val;
" x- {$ l! \ d. C, K1 c+ [* _0 S }1 u( R+ U# c7 C2 o! y2 N
}/ ^9 @# d; V4 ?7 L: P9 x) O+ e
bgR = '0000' + fadeOutColour.substring(1,3)
" |+ u4 ^+ c0 W8 H bgG = '0000' + fadeOutColour.substring(3,5)
- _9 Y* O( i5 s9 x5 a; d bgB = '0000' + fadeOutColour.substring(5,7)7 h9 Y" k9 X1 E/ R% a
currR = new Array(numLinks);
# ^ H/ ]$ I( W/ D; c currG = new Array(numLinks);2 v$ n, h! R! F1 U3 C3 s
currB = new Array(numLinks);6 _7 l3 m1 B j2 K
count = new Array(numLinks);
) z$ v/ h+ a! q( k& O- l" C2 F) D fadeOut = new Array(numLinks);
5 k- N, ~' o, J( h; a7 W3 |/ ]7 J continuous = new Array(numLinks);
3 H& |7 k( J% Q6 {2 y newColour = new Array(numLinks);
5 v4 u, u" N2 w/ X% W) i tID = new Array(numLinks);8 B5 a# U3 \% S7 m# ^
redInterval = toDecimal(bgR) / numFadeLevels;" B3 ?8 q9 r- y" e+ ]4 b
greenInterval = toDecimal(bgG) / numFadeLevels;
% e5 l% D' J" T' n3 g* s7 P blueInterval = toDecimal(bgB) / numFadeLevels;7 d9 x2 Z- e6 I. j, u' J" C7 R
initArray(currR,numLinks,0);
: Q. d1 z5 B( @; h& b+ f initArray(currG,numLinks,0);2 a$ w) W; H' {
initArray(currB,numLinks,0);
2 u! ^) k4 c( R initArray(count,numLinks,0);
" X3 X w; Y& v6 _, @ initArray(fadeOut,numLinks,true);
+ {. b6 }' U, O \ initArray(continuous,numLinks,true);
+ V/ o' O% i/ ]) }( @9 Y} % \+ [9 E. ]7 b; P/ H* q
function startFade(id)
5 T1 G4 ?; O/ j$ ~- D{
$ |9 s* |) F3 R! ?# D if(fadeOut[id] == true)1 Q2 \/ N- B$ [2 ^
{ /*move colour towards background colour (increment)*/; y% W7 D& j4 ?0 k; g
currR[id] += redInterval;
~" ?# [! H& ?/ w: Y currG[id] += greenInterval;* K0 d" H7 U! ~2 `
currB[id] += blueInterval;
4 g9 D" l" @/ d+ z( Y: @ newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
2 p* H& F' E& h; |2 B2 w if(++count[id] == numFadeLevels)
3 o% Y' Y* Q7 F# J' m9 d {0 U; X7 P( n" [9 U: z) L7 e8 d
fadeOut[id] = false;
/ j1 K: i2 w4 E }: k& v9 U: c- F# ?6 V! ]' b' }
}+ v& I \. f' o1 P& S
else
g, \, j) g' t {
" ?+ R" d1 \: `: c currR[id] -= redInterval;2 l+ d7 q5 J$ r! B" s
) j% U1 M- m/ v% [3 s0 D$ {
currG[id] -= greenInterval;
) U* h/ o& R4 Y0 D+ C& \+ c/ q# i* ^0 X w" M) i6 I+ ?6 {" {" s% N
currB[id] -= blueInterval;
' b. L% a3 ]3 {, ^" N4 _
: w D1 g% t* C! W! c6 H newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
8 C6 ?( E, K5 d( q. n
, ^* F& d2 ]6 c! U( k) z if(--count[id] == 0)
8 U1 t3 K: ]0 R9 X
" d# _& l* n+ y {
# {: E5 \% M0 g6 y, h" P, g7 \8 J- c/ F; O
fadeOut[id] = true;
' F# y* F ~2 X6 }$ b8 B8 @( P# {1 Z
}, b/ T# B, Y' x- }4 L! C
1 K' o6 L# M: @6 d- h' r& p }
* \9 I+ E S+ j! ^
$ F4 I. B( e- a if(continuous[id] == true)* ]. E: K: L h" ^8 R
/ ?3 A+ c) g5 s+ x$ C S2 v1 o {# B! g+ N: N- \' [6 p6 M! f8 u% x
6 C1 u# z/ g6 R. g* W: @ document.getElementById(id).style.color = newColour[id]; 3 T, [9 `. H# U2 K
4 C" g" Y+ J% q% @1 s* [
}
% r$ Q0 }7 U( S* `$ C7 R; p* n8 y8 T' w9 |& Q: j! {# D& }
else
% I0 p2 U0 f7 ]0 K$ B# t m
) n" M6 @' f* |! [. I5 q8 | {) N. N; z2 K- k- j* w9 [; z* G
4 L$ F' [2 s" G
document.getElementById(id).style.color = hoverColour;
1 s2 f0 g) W) @' B) x/ W' B$ h$ H7 }& L% y8 [2 r9 ]$ Q
}& h6 y4 `, n, C Z* y
, k6 [+ \/ Z' M6 S
clearTimeout(tID[id]);3 j+ W# n' Y/ ^2 J
3 z# [$ ^8 T2 w5 ?2 V+ e. b tID[id]=setTimeout('startFade(' + id + ')', rate);0 E9 t* V$ D% `; t; S6 e
) e" U9 ?" G0 e) v2 P3 V
}
5 X# V$ J: v& Z4 `& _. D, r' k
3 _# |" }3 o/ ?* V4 v9 @1 }function continueFade(id)
$ k9 G8 ^1 c0 K8 d& ?' u8 m
8 h* i+ M+ v% X9 I' _{
2 h% U+ v0 b; S! @+ q7 ^+ l1 P3 G
& l7 x/ {2 h+ l! U; f2 f continuous[id] = true;
8 H% p% ?8 P" C8 e, q; U* T5 C+ x5 u! v
}
& f6 ? R p" V
5 C8 n5 T/ r4 }. S; R6 B1 t! O* ]function stopFade(id)
$ K; X* ?/ E, m+ @/ X+ Q8 E9 z# L' }- d
{
( F1 f( H: ?3 ~/ h' L2 M3 r8 A) ?- J' w0 Q( g9 O9 y2 y
continuous[id] = false;% \& K5 C! S+ u! U6 [5 v+ B" u$ c
- N# L$ n0 p7 z' E$ l
}
+ `6 D H* \. e% T" j$ b# o9 h: G6 U. w: r }8 j& A* h) E. }
function StartTimers()
% o1 l7 t( f9 b- J4 q8 a
9 b2 F' V- K' C4 x2 J/ t{ //set up an initial set of timers to start the shimmering effect
& {! z0 r+ i) B) }
. C8 o @- n9 {# i% ~5 S+ o! n for(id=0; id<numLinks; id++)$ L# f2 R$ o: ?5 `) x
; s. ?9 q$ H! W G( y) ] {
- G+ e5 ^+ C- C K' \4 Q) L' a( A/ I) G2 V/ i
t=setTimeout('startFade(' + id + ')', id*100);
' O8 W5 Y/ J( |( W' a
. g# r, W' {" L* l }
8 u7 I" k- {1 Z i. i- Z7 n
4 I7 J$ s& A4 z5 Q; e5 \! \}
. |0 T4 q2 Y7 F2 c1 V/ `! }2 i3 m! w U( J; q, J4 i- d
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
& y* j. L$ j! h. D0 l5 U4 Q; U6 o+ l/ u: O, {9 I v c: r- @, n
initLinks('#FF0000', 6, '#FFCC77');
1 f8 p) C5 O4 c. |
' M# f8 p9 `9 p- i% u0 @6 e3 ]! b//-->) v' `9 g6 e& i, m! B
8 m6 ^5 [. O8 T
</script>3 V# x9 m: P, @+ B* w& M
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名:58元# o6 W7 I( I; b' B& Y s, h: R
</a>
4 Q& t# L7 v7 U+ B<br>
1 q+ L% ^7 i; Q9 h' U5 A<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名:110元</a> J2 X# {( B. X9 s+ q8 j1 `
<br>
$ L) c( }7 R1 D<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
" D/ h& I9 m0 F8 j5 p8 a: M<br> # F9 _3 H& E0 C2 u7 w- |+ f
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>; \2 n( b! b E) u
<br>
4 A7 O$ Q' [8 [+ x0 v; ~, t<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>, x. u1 P- _/ c) j8 B4 B
<br>4 ^4 O% O: t1 K" s- S+ I
<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>
: [( r9 ^% [. w5 X4 t3 C, D* Q$ Y<script language="javascript" type="text/javascript">$ S" b; |. F5 }6 ]( L
<!--
8 D# b% ?7 m: J* qsetTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering+ x3 w' q/ ]$ H2 q4 L4 _& g
//-->! y* y. J) ] L0 {. n7 e" x
</script> |
|