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

|
网页之文字的循环闪动特效
<script language="javascript" type="text/javascript">
- @. Z4 y- a" |3 _9 b<!--0 G+ H C8 f o9 ^
// convert a single digit (0 - 16) into hex7 q/ N M0 w" Y3 a
function enHex(aDigit)
& `) Y! w1 p! V K* }8 R9 s5 i{
7 E3 _7 V) u$ h0 t0 J return("0123456789ABCDEF".substring(aDigit, aDigit+1))
; Q& V+ Q& ?8 m! X2 M}
/ f% ~3 n O( v9 r* r// convert a hex digit into decimal
1 [+ C$ i! b; Q# Pfunction deHex(aDigit)) E* _, I& }& ~& C& r, n4 q
{
8 P- f& z; x2 g# X0 N7 A E9 t, K return("0123456789ABCDEF".indexOf(aDigit))+ h; x$ ^2 e* X A" y$ h1 ^
}# @/ P! F2 C* {: j4 Z- M9 H
0 M! e. L1 H. o2 J% q* E
// Convert a 24bit number to hex
" K! v: [" f$ V6 X$ x1 X) }function toHex(n)
$ |; `+ S5 E* n" J7 g& n{# C0 v+ X5 W0 @7 ~) Z
return (enHex((0xf00000 & n) >> 20) + k( C- E/ m) T! D& I
enHex((0x0f0000 & n) >> 16) +
$ a# [9 t# r/ M% q" ?4 G, K1 t enHex((0x00f000 & n) >> 12) +" N0 R" C; |: t8 F/ _! s0 K
enHex((0x000f00 & n) >> 8) +
" @. I7 }; {: H! i4 d enHex((0x0000f0 & n) >> 4) +: x! W1 _* a/ ?' H, Q3 s
enHex((0x00000f & n) >> 0))* n( z K1 q- Z# o* q- O$ w
}# s; N3 r& I3 v" S: @& F+ S6 L
// Convert a six character hex to decimal) d+ ~/ M! K9 ~8 m7 l
function toDecimal(hexNum): c$ O# _& i- v3 ~- j0 j
{+ j6 j- N- y( e; M7 V7 s) C+ X
var tmp = ""+hexNum.toUpperCase()
* Q* i" f$ L/ a2 L/ ` while (tmp.length < 6) tmp = "0"+tmp
9 i9 `6 w5 X- j3 U% q$ N# ] return ((deHex(tmp.substring(0,1)) << 20) +* {! h* |9 z( N) s4 m) \9 t" ~2 q
(deHex(tmp.substring(1,2)) << 16) +
/ A/ U$ I; Z8 C6 n! v# Y% X (deHex(tmp.substring(2,3)) << 12) +
. D2 n; {2 U( K. i (deHex(tmp.substring(3,4)) << 8) +
& b8 M& a! u+ I (deHex(tmp.substring(4,5)) << 4) +
, A9 y5 P" y3 x (deHex(tmp.substring(5,6))))
! ?/ n, o$ D5 ^ \/ I2 p! j+ m}
( g' i( X5 N0 o+ c5 T8 ~2 F8 }( L///////////////////Shimmering Links/////////////////////
: z: k; h* N: w1 y2 ?//global variables# w; }5 Z$ l7 E9 h
var hoverColour
0 ]: D# N+ s+ W; gvar numLinks;
* E6 s9 p% P1 g% Tvar rate;
& p+ `$ ^7 u, s9 g7 [var numFadeLevels;7 A: s) c {4 ^% `
var bgR;4 s2 b. X) p( Z1 E
var bgG;
I4 ~/ X% j3 h# Bvar bgB;8 q' M3 k- d9 `
var currR;
~. E/ b$ ^7 E1 R: x tvar currG;
R. l$ b- p. Tvar currB;1 a9 @+ v' C0 j/ X( z Z
var count;, p) j; ^. T4 U+ v5 m8 O
var fadeOut;
0 C/ D/ @' z2 D. `$ { z7 jvar continuous;
( n( u& r) F) g6 ^ m# C3 ^( o0 j2 gvar newColour;1 V% S7 e) w4 A+ I1 S+ s8 i
var tID;6 Z& C+ ^$ {3 D+ X) O
var redInterval;4 T) e& X. g; D
var greenInterval;
$ K- x( w; T. X2 Wvar blueInterval;
( l6 {* c4 i- _/ x+ J4 @/ F$ G: f, afunction initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
+ {7 S) f% C. e+ L; I1 Y{) [( n; h1 c9 y1 e' Q) H9 `5 C
hoverColour = mouseOverColour;
* t8 ]5 y7 k, d9 z9 |$ N numLinks = numberOfLinks;
; {- ]0 ]0 t6 g rate = 1;
- ]# n( o; @# ~9 l" t' ~* V6 b numFadeLevels = 30;
" ~3 _% T2 Y2 E; n! _( X function initArray(theArray, length, val)
; w! x' R$ q4 T { F$ e/ B" }% K, @
for(i=0;i<length;i++)+ [6 f, U' c& \% k+ R% U
{9 s5 d. A8 X6 w ]
theArray = val;; t9 ] j; l" O8 V% Y
}6 l' ?& J- }; i
}
) H+ N {$ e, l bgR = '0000' + fadeOutColour.substring(1,3)+ ~" g$ G }* K S/ V# ~) B8 v
bgG = '0000' + fadeOutColour.substring(3,5)5 H* K) |1 I; K4 o ~ X t: f: K
bgB = '0000' + fadeOutColour.substring(5,7)- P! R+ g: ~$ n$ {
currR = new Array(numLinks);
?, h0 [ K0 Z8 \4 S9 E currG = new Array(numLinks);- o1 \' f6 A& H" B
currB = new Array(numLinks);$ M/ N! H3 B# L: O5 t4 X- k! s- h" l
count = new Array(numLinks);1 K" g, v z7 b) x! x; \
fadeOut = new Array(numLinks);
8 F* r& y7 f& V% X' ] continuous = new Array(numLinks);
' ^( u) }( }% F7 k2 s1 L# D newColour = new Array(numLinks);4 e6 `" B; ^( e' @- Q7 u$ p; n
tID = new Array(numLinks);7 c; C: V+ }$ x" {% D
redInterval = toDecimal(bgR) / numFadeLevels;+ Y ]. s$ g3 G( Z1 A0 y. m
greenInterval = toDecimal(bgG) / numFadeLevels;
- \1 P# L! v) z0 ] blueInterval = toDecimal(bgB) / numFadeLevels;
9 T: }" _- @' n# z& h+ c9 g initArray(currR,numLinks,0);. _' [. b* `) Q' q, D2 [2 [
initArray(currG,numLinks,0);
4 A$ S4 F9 a. q1 U4 |1 K initArray(currB,numLinks,0);& I b9 k3 \/ k5 Q. c' ~) e
initArray(count,numLinks,0);% N2 \2 c$ }, h7 z2 Q/ D/ x) o+ ^6 B
initArray(fadeOut,numLinks,true);
: ^: T5 S$ t* G& m3 H initArray(continuous,numLinks,true);; g; B& u: Q V9 J
} , w2 B5 E( h0 ~
function startFade(id)* R2 o2 u b; z, P. {
{
( R, d3 W. q6 |9 K7 x& d" W6 S if(fadeOut[id] == true)
" a9 x% l1 p x4 g( x6 X/ V { /*move colour towards background colour (increment)*/
, K* B, v8 X' A$ L3 Y' Z currR[id] += redInterval;7 q, A" B1 |7 U
currG[id] += greenInterval;9 |6 z$ Q4 O9 j
currB[id] += blueInterval;
8 @8 y7 x( Z, W2 D; T4 N newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
# A5 h# Z0 j- R1 E if(++count[id] == numFadeLevels)- M5 s) g0 q- @% X. M5 X
{. S( r6 l! F6 T& ]2 B; _0 l
fadeOut[id] = false;
7 i' I3 r% L1 i% q }
" d1 x ~6 W: B& Q! W+ x( i }. D* J# c1 a* n5 U2 X. W9 \) P w2 E
else9 A: G" e4 s! H$ k5 M" h R
{7 {$ f6 h q. [+ A5 l% K* O) v4 ^
currR[id] -= redInterval;
, L' w0 F- d" k. J1 p& U, l( s
* ?+ V @9 g# B currG[id] -= greenInterval;! o U) F1 @0 h- Z$ ^" K, l. n
2 l* Q# L$ T; R/ r8 a7 |
currB[id] -= blueInterval;3 e! i/ I! I% H* s8 @* S3 A
' x. W4 J* O) N# \
newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
8 V! _7 m/ G$ C+ _3 L6 A3 u& n! L; ?# e/ z# O
if(--count[id] == 0)) q0 Q: o$ Y, m2 y
! E# U, m$ z$ B
{2 E( M( i0 R8 [+ L3 }, a! @
" f" d" X" o! m2 O
fadeOut[id] = true;
/ x8 o2 ~* A, q
* g9 P, I' X% u! h3 o6 |) ] u# V }
% d: Q2 w* y5 N5 T/ }
6 y4 a! t8 L; U }; m0 F+ y' H0 R1 A& {! c3 N W
0 z+ @, o A8 l2 F5 [1 a' F. g% a/ M) E t if(continuous[id] == true)1 x- c3 O% P% a, | Q: k
9 K/ s5 \" H$ c! | {
( y* ~$ y9 L5 ~/ h2 o3 X v. K; E! }! J/ k. b
document.getElementById(id).style.color = newColour[id];
) k9 E, ]* p4 Q; }# u2 i3 j' K/ v. Y' O* v% h( p" C+ ?% _3 x3 R3 z' J
}7 B3 l" E" j' E1 U
; i3 Z( W5 @& L7 A2 P% U0 e% e else' s/ h2 G' Z9 g; S% K
9 W6 ?# @; @, X+ P; K+ Y9 F% v6 Z8 v
{
0 B, |; K' U0 ~6 U/ c( ]8 q. T8 `+ Z2 R) {" j8 R/ ^5 N* N3 E3 [
document.getElementById(id).style.color = hoverColour;" D9 g! a1 W, B7 o6 w
( @, {: C; m: h }5 w( E1 ]1 D# c; H5 O6 z% p+ S- ~
5 H+ X* a$ B5 T2 X! D; R clearTimeout(tID[id]);5 N% q s) s7 Q
& d& Z+ n! G1 x9 U0 N: W tID[id]=setTimeout('startFade(' + id + ')', rate);
- w" J; b1 O$ a# X$ }) W
4 _6 ~1 U; C2 N6 }8 |0 C- v! Z}
9 K1 J3 V6 [$ t) h
2 B9 u. Q. h* v0 {function continueFade(id), m5 i. U' P- z4 Y- Q
& n! R& s! N h* T$ _- \
{
7 @" w, Q7 \# [" u
' Y( |/ h: ~* A+ M" e1 I1 [8 i8 a continuous[id] = true;
9 Y. K, m! X) a x
5 r* K2 ]: B6 c* K+ C}- p7 O& ]- Q( w1 V; T) ^9 `7 ?: @
) \. }# T% |* i8 P
function stopFade(id)8 A9 ]& y4 c7 x" G Q9 o- ~
( S. f" D: b% [7 [" U" {9 q1 {* \5 r{
1 ^( {+ I" e5 D6 e1 [6 C# _( G' z. j1 V6 W
continuous[id] = false;
3 l7 @, F+ I! m- Y ^, Y$ _
0 _/ U/ n$ @, C, ^% b% Y. j}
9 T- G3 |5 {& s6 j
8 P# P6 j4 v# V, ?( w8 f, Wfunction StartTimers()
- ?& s1 x; }8 O+ w$ V9 l1 D0 S' U: e3 g6 G. E K+ e% L# D
{ //set up an initial set of timers to start the shimmering effect
; Y) l/ f2 U; C$ t5 K, D0 P: z) G. C2 k0 @! U" y* r
for(id=0; id<numLinks; id++); P1 h S# R0 z7 Y8 |9 v1 i
$ J& h+ l% C# k4 t { c% Y0 u$ a3 |8 T$ V
* q7 d, l0 ]4 v! E% `
t=setTimeout('startFade(' + id + ')', id*100);
. V& j# F. `" |- }; W7 X& L! E, m9 z+ N# Y) w1 p$ U' @
}
/ P8 X \9 V0 y6 _, }) ^) i+ L+ t
) G# |2 z0 R1 E4 |}1 `* e% [1 H8 K4 H5 w
8 u( K, H$ M. z; E3 \
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
+ }6 v7 A3 h5 V. k/ Z% [
3 H G! s. p9 `: k+ k9 yinitLinks('#FF0000', 6, '#FFCC77');3 W, F. l, j/ G+ E5 |9 v
. J4 h. i q3 ^5 m$ s o
//-->7 D% b/ D9 u; S* a- ^
' f4 v) ^) G `5 c/ s$ n0 C
</script>4 _0 h" d3 G/ B+ D' Z
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名:58元9 d9 c3 O& O/ `/ m
</a>
" [+ U( T! K t; z& e; u<br>
q$ f: ]" G6 p2 C$ g! P<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名:110元</a>
$ B' h$ p0 c3 N; o, U. C* g<br>0 z5 \% Q# z* n1 B8 v* r: x( k
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>- I; `' [7 I ~, H( k; l X
<br>
8 [5 l& i5 m5 k5 A5 b2 U<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>8 @& o6 t: x, O8 R6 V5 J/ o
<br>+ ~ o$ S2 E& a" D- \/ g
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
0 U' Q8 C% r; Q7 j<br>
+ a/ D" ^ `+ [- a, F<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>, }- v# n3 E& @- [8 {& S' A
<script language="javascript" type="text/javascript"># j/ O- n1 J; U+ \2 A5 Q0 Y
<!--: E1 ^& J! X9 H2 R& l
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering. t& t) V$ p9 Y/ B0 U& |6 }8 s
//-->& a2 F9 V- m* z+ d
</script> |
|