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

|
网页之文字的循环闪动特效
<script language="javascript" type="text/javascript">! o+ C h4 L/ L6 j: U0 ]
<!--8 X6 X6 H+ a5 P. ^1 B2 ^( V& h
// convert a single digit (0 - 16) into hex* W# R; ^: ?+ q. C) p
function enHex(aDigit)
5 Y j/ u( s; ?; L; ]9 x{. s- C9 W7 w/ S6 ^: y5 r
return("0123456789ABCDEF".substring(aDigit, aDigit+1))" q6 ^. @ q/ g6 F( ^$ l
}' c# s4 `7 b" E! q
// convert a hex digit into decimal6 |$ f, _5 H; |: f; B* R7 P' E, h* v
function deHex(aDigit)
! O/ I$ N/ z% o9 r3 r7 y{4 v1 R# I$ B- o5 h
return("0123456789ABCDEF".indexOf(aDigit))
' Z7 W$ s; Z0 c, `" g& P}
m1 W9 U3 H# e; b* _1 [9 |1 O ~1 L) _5 ]4 ]
// Convert a 24bit number to hex
) v g) w7 ^9 q2 c/ ^" Bfunction toHex(n)
; n5 g. H) s8 l# G+ g{) J3 @/ I7 a& [! d! V5 d
return (enHex((0xf00000 & n) >> 20) +
9 m6 F- B1 ]0 ?" h, P0 @8 A: D enHex((0x0f0000 & n) >> 16) +( ~- k& `& T0 E! B8 B5 A
enHex((0x00f000 & n) >> 12) +) D/ `; R0 q' \* l
enHex((0x000f00 & n) >> 8) +
* E4 ~/ [: G' B9 y enHex((0x0000f0 & n) >> 4) +' K+ A; A a5 T. `+ \$ }
enHex((0x00000f & n) >> 0))9 r. p: N6 ^6 [
}
) p! \% S& j/ l, e+ z) \// Convert a six character hex to decimal* h1 s! y8 N$ U) F
function toDecimal(hexNum)( n1 a6 O k0 n z
{
0 W9 K' W6 i# Z8 m var tmp = ""+hexNum.toUpperCase()5 O8 N T" @9 B2 M( ? L& P9 E1 L
while (tmp.length < 6) tmp = "0"+tmp# U# V% r) x; Q7 i+ q2 S& J
return ((deHex(tmp.substring(0,1)) << 20) +
" d6 e7 L2 ~% I& q: E" ~ (deHex(tmp.substring(1,2)) << 16) +
L9 f: `/ u& U- R( S (deHex(tmp.substring(2,3)) << 12) +; }0 E3 |- L& Q. h$ p2 J. D
(deHex(tmp.substring(3,4)) << 8) +- F% f" k2 |' i6 I7 E' A; \8 V4 b* c
(deHex(tmp.substring(4,5)) << 4) +
0 A( L$ f) n- `4 [ (deHex(tmp.substring(5,6))))
/ \! }& N( e) O7 H}" W! E& Z+ E1 e1 c. c3 @
///////////////////Shimmering Links/////////////////////
: c3 ~, l+ c: A+ l//global variables
9 q! l" \* }& R$ ~var hoverColour5 w# Q$ _! A) {' h) G7 y
var numLinks;; V* T) `" k2 \) d' `. \+ `% b
var rate;# }* K, c+ b9 q0 Q. I" q/ i2 W
var numFadeLevels;1 f) r% r9 w$ S( k/ L# m' d' U
var bgR;: ^( q* _2 S2 U
var bgG;
4 b* }% m9 _! y; c; G3 Yvar bgB;
( k& V* i( ?" r% k. W1 _! O3 ~var currR;) x u# f; D! y6 D" O& x, U
var currG;
6 X+ `% C5 b1 O: C5 s% i5 Zvar currB; W) g) _5 h: ^, O
var count;( R: V; E3 A0 A% U& i8 Q+ e: Q
var fadeOut;
. x6 H) e! d5 [5 \ q* fvar continuous;
1 v0 h3 @. V- [6 g0 ]var newColour;
1 q1 c9 j& M. X8 h1 J- Fvar tID;
+ Q/ U5 Y1 Q2 L4 H2 evar redInterval;2 J) D* f/ Y. k2 `& u$ o
var greenInterval;' ?+ M* ?9 C* u" f2 Y
var blueInterval;1 I/ }5 l; D s7 n) `+ D
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)6 i5 I9 C0 m. ~* z7 @
{
4 a, [. L2 i( C, z! l8 u+ `- S: w hoverColour = mouseOverColour;) ~5 x+ ?/ b+ V" Z) t
numLinks = numberOfLinks;% E/ ^4 d: T) {5 \
rate = 1;
/ O8 p* }& l- L" @8 k0 H numFadeLevels = 30;
& B3 p$ W: j4 A' ^; ? function initArray(theArray, length, val)$ p/ ^3 n+ x1 V" N7 y
{3 {/ h$ `4 D" o9 e1 o
for(i=0;i<length;i++): `- \% U5 K3 X& s4 z
{3 f0 U6 o9 B) {: e0 X0 a* e
theArray = val;
5 k2 F0 v/ H1 j }
/ W6 |7 C3 ^3 d3 F9 ~8 o# Q' D }
& ?! b |. J" D* k$ ?- X bgR = '0000' + fadeOutColour.substring(1,3)
/ y& h1 X8 S5 `% x$ c bgG = '0000' + fadeOutColour.substring(3,5)3 n# N. h+ ]# ] v0 r; T
bgB = '0000' + fadeOutColour.substring(5,7): ?5 i$ Z& h: n" T! W" y. y2 R
currR = new Array(numLinks);2 [0 b" _+ r7 \5 ?
currG = new Array(numLinks);6 M5 }0 x& i. K% @% {
currB = new Array(numLinks);% {, k; S9 E' F# X# ?
count = new Array(numLinks);: Y9 _. Y' M. b3 S5 S( N: z7 Q% J$ y
fadeOut = new Array(numLinks);
6 @0 U3 a; |' w1 w continuous = new Array(numLinks);2 d$ K4 W1 x7 d9 g9 |) {" W8 |
newColour = new Array(numLinks); y0 {0 t; A7 G( w" z9 N' o# {7 }, v
tID = new Array(numLinks);( F5 _+ x+ }8 R3 z4 G" U+ Y n$ [
redInterval = toDecimal(bgR) / numFadeLevels;
( J0 [: E% U2 }5 E# _2 D. u! I greenInterval = toDecimal(bgG) / numFadeLevels;$ \# e) A1 b- n8 m% ^+ ^6 Y
blueInterval = toDecimal(bgB) / numFadeLevels;
" r- W! F+ H) z# @* J7 C initArray(currR,numLinks,0);: U9 H; o. Y0 ]
initArray(currG,numLinks,0);: N {4 D' X5 A6 i$ }9 Y
initArray(currB,numLinks,0);
8 S4 D) _- Z$ ~$ l% V initArray(count,numLinks,0);
0 n' w: n4 E! |# w; Z* R/ f7 P initArray(fadeOut,numLinks,true);
3 {1 v* k& k3 N9 o initArray(continuous,numLinks,true);2 h' V/ }! u8 o( z
}
# l0 V& k% N2 c c6 m$ sfunction startFade(id)
1 H) `, v# S( F |3 b, p. ~{3 J( z# u3 N2 g8 u# U' X. C
if(fadeOut[id] == true)
2 c+ G$ d8 F; G/ m" l0 i { /*move colour towards background colour (increment)*/# |' S' d* k* J+ O
currR[id] += redInterval;, w' R9 T# F$ P e, o
currG[id] += greenInterval;
1 z8 I$ ~2 R: n$ U; R currB[id] += blueInterval;0 Q- n* [' d# ~+ A% d8 n* C
newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
# M) A6 }+ J. i! b' |, D K2 k+ B if(++count[id] == numFadeLevels)
0 R5 g, I' c' H1 ?4 N {. |0 o' y; D- T i9 F
fadeOut[id] = false;: E) b0 E& v- c" _' E8 N
}
2 ?5 i" ^0 g+ _& X }6 y# q& [5 |: V
else
4 ]/ a- T- x0 o' N5 x6 U {
$ x% E4 N9 N3 A) t5 _/ Q5 \$ n3 w currR[id] -= redInterval;; J1 R: R9 L9 Q8 U4 t
+ X5 o0 b% Y+ Q& a- I5 Z! d
currG[id] -= greenInterval;
9 c, X, w$ g* |1 g7 T; i
D% r% z6 V2 d) L) p" J* P currB[id] -= blueInterval;
7 Y3 U6 p, }4 `2 k! f8 `' S
1 a8 X( g, I5 H/ U& Q9 q newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);' M1 k3 L9 j9 b" ?5 }3 @) @5 _8 ?
! X4 d e+ q. S) Z if(--count[id] == 0)
+ L) J: k+ [4 c) X/ P' R3 W; P% p" J5 y) C& k/ N
{1 c$ E# y$ {9 U: p3 b! \4 ?1 E
" n$ |+ ?( Q, [/ h- r( f; \
fadeOut[id] = true;
2 l* H6 d$ P' k/ l+ R* {4 a* a1 J9 x% q/ v8 X. i }
}
, o3 {/ D, I0 ?+ T8 d! G J$ E* [+ g% a5 V2 {( X7 C- W
}3 |) `! g' b% o
* j6 P" {* [: @4 I5 R) _
if(continuous[id] == true), G$ [0 g0 _0 Q; C, P) p
) e# R& J6 E! d ~
{+ ~1 Z7 T4 P* q- t( D( c
! A8 O6 v; f; o6 s
document.getElementById(id).style.color = newColour[id]; ' O" t7 e( g6 O5 Q4 e3 K! q4 R
. j/ o8 s: X& R4 i) e4 X
}
2 v- r! K; @; C4 i# q: S( H1 k4 m: X# B+ }1 n. C! X- h) {; Y! ~; o
else5 f4 k3 H' F! U3 Z; W5 G1 ?! {
4 y# Y, S7 j3 R ? T {
' Q9 B; g3 X2 e; C
5 \ T9 f* o% j2 G3 e0 t4 q$ {$ L document.getElementById(id).style.color = hoverColour;$ g! G" |1 w; |& _9 \! e
9 U+ W+ i! [8 P
}1 J" B6 B; g0 J3 R; b
5 O; B! i5 n s5 ]! m$ z) {8 f
clearTimeout(tID[id]);
9 @8 s8 l+ I- B8 Q4 _- b6 W
* ?; E+ |9 u) |3 K tID[id]=setTimeout('startFade(' + id + ')', rate);
% T9 i) K t- u# t* k1 M; h3 Z6 ^; g) _* u/ F' A$ u9 I8 F/ e. ]
}: t0 f; U/ W( F9 {
3 n' U: Q* {# ifunction continueFade(id)
3 T, l0 x! }5 K8 K
- n! O& } ?2 u2 B# G! ]) w! e+ o1 V{
8 n; X) y( m, `) y1 E
# G4 T W$ C/ |) i& ? continuous[id] = true;
1 j% `* E) t7 p. D5 K; D4 U- F i1 A+ v& \1 t7 Y3 D
}
- z0 Q* `' f; n G# N
8 k* c9 k* z7 ?& Gfunction stopFade(id)
$ M4 S* ?+ x$ v+ k4 G% Z
( U1 r6 z- o/ U% G{1 q: P( o- [$ i" P* P
* ^9 K$ U) Y2 o. O! K6 W9 `! u+ o continuous[id] = false;$ r! M, \8 O2 r+ D4 ]+ u' @
, H- ]1 D* A8 i8 }. V
}
3 v4 i( D; u8 _; A) j/ m# |5 V4 i- d# B. F1 j7 t& @
function StartTimers()
6 n1 K. Q2 V, [% |" i, j
q4 K) i9 [0 A0 D8 i$ X3 B8 S{ //set up an initial set of timers to start the shimmering effect! b4 M- g7 x/ V
_2 V1 c; j) V% w4 f) A% d" W
for(id=0; id<numLinks; id++)3 J* J5 k9 o. h8 d& c5 J8 m+ R) Z
! x( H5 u& p- a/ M, L {' U0 q( Z1 B' I& a% ~( `. i
* h' R) h- P7 N; k4 w t=setTimeout('startFade(' + id + ')', id*100);" x1 `& B( v$ _, H
. h! D `1 V( m
}' d4 G3 s& x8 z; h1 _
7 P3 R# q! I' L% ]0 g
}
0 }, |+ m7 V& E' }" ]/ d- e f V; v* r+ L- m# x4 M
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')/ o3 o7 P6 x3 ~; T v1 L, z
9 p* U9 J8 W! N- ~5 v( @
initLinks('#FF0000', 6, '#FFCC77');! |# `% N/ D/ f- V2 V
, q" P) Z$ Z3 e5 P2 f! G5 _//-->. e6 l) d/ F0 U' q) I$ R7 S
6 Q/ A4 {+ D# F
</script>" }" c j# A0 r) N' p1 D
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名:58元6 Z) E2 E+ A5 M% R, A3 ~6 S
</a>7 |+ q9 ?# H& K" F
<br>+ E. {* S9 D# s' o' M
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名:110元</a>
, _- g$ t3 M; P" i/ t<br>
" s$ a* M6 y- L- X- U. I& i<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
4 j4 N8 H1 ]/ I; X% H<br> 8 ^: n. h2 z* v" p6 x! y( K$ m
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>: u/ |- Q( d6 K& C6 }2 \
<br>) C1 b) [' x8 W% `! z( `
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
, t9 w3 W' y" F, f: x<br>
' y7 g4 I4 O0 g* O& ?% h<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>( @' t1 I6 D x
<script language="javascript" type="text/javascript">6 b$ w. ^% A* j
<!--
; x4 C; A! @" W. i+ P* _setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering* g) m* A6 b7 N: L
//-->
2 M0 a# d& G* t M5 }9 V</script> |
|