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

|
网页之文字的循环闪动特效
<script language="javascript" type="text/javascript">8 @' V9 D+ r/ O H/ v1 p
<!--
+ k2 v7 ]5 q& k0 t// convert a single digit (0 - 16) into hex
: x. m" C" v! ` Jfunction enHex(aDigit)
, ]! n& p4 |( K W) W{5 K1 Z h" K6 Q! B5 i: Q
return("0123456789ABCDEF".substring(aDigit, aDigit+1))
) \* |2 \8 |$ }1 Y9 C1 f0 r4 |6 M}7 P8 y* ^) ?& W" L7 p0 V$ @( C, z
// convert a hex digit into decimal
& c2 Y5 L0 _+ x k/ Xfunction deHex(aDigit)
$ ?1 f% l/ d( R3 v- Q$ }{
. E! B' j) \4 b& G' S- O return("0123456789ABCDEF".indexOf(aDigit))
- ~* x& f; j* K0 C+ [4 m}9 L$ o. R4 s2 o c+ \
' D* ?3 n* P1 h2 Z4 `
// Convert a 24bit number to hex
- v4 X/ D$ Q% Nfunction toHex(n)
/ K! N3 w$ c5 V4 t. |{6 d& ` Y6 o& F6 c# p/ D
return (enHex((0xf00000 & n) >> 20) +5 o- F) c+ C7 W" L! L
enHex((0x0f0000 & n) >> 16) +
9 n, `# W4 K/ z- s7 t3 C2 c- q enHex((0x00f000 & n) >> 12) +
4 ^- b! Q) f1 r2 C enHex((0x000f00 & n) >> 8) +
- c7 k! o, u3 R) c! Q enHex((0x0000f0 & n) >> 4) +4 f: R$ Q' s( i3 v
enHex((0x00000f & n) >> 0))
4 f5 f. A6 }! Y. x& ?/ R}) x2 m6 ?- M) [
// Convert a six character hex to decimal
# I4 k' d/ N$ W" i2 ^9 K/ s( o0 J3 o( lfunction toDecimal(hexNum)% N. |7 t! }$ }" f( T
{
; |) Q& g7 {4 Q var tmp = ""+hexNum.toUpperCase()
. w! i: Z5 o* V6 w& s; p# @ while (tmp.length < 6) tmp = "0"+tmp; n( _" C( r. R. ~
return ((deHex(tmp.substring(0,1)) << 20) +' i' i ?' P/ X' Y: ?9 ~9 \1 D
(deHex(tmp.substring(1,2)) << 16) +
- ]' H8 D) {7 f8 J) X! n6 S (deHex(tmp.substring(2,3)) << 12) +9 u [$ N: |( g
(deHex(tmp.substring(3,4)) << 8) +1 u( ]3 E. e- C3 m- t; g4 Q
(deHex(tmp.substring(4,5)) << 4) +& x7 [/ m8 F) G$ s/ m" E. Z
(deHex(tmp.substring(5,6))))
# m# o4 z. ^; Q2 g: ]% w ?" j}1 o" W( H, R6 J3 q u) t2 ~
///////////////////Shimmering Links/////////////////////
9 K3 F4 v2 ~2 S. r, p" n//global variables. S- F6 [2 Z3 i, R/ R3 P2 m
var hoverColour
; O, C9 k) ]6 b0 c" ovar numLinks;) l: ?; h, D Y2 v* U8 `1 y
var rate;
" v8 q& x7 C, r$ \var numFadeLevels;0 \4 M% E! h! f* o- U3 |
var bgR;
' y+ Z7 x3 y; c; i3 ~* z) c5 q5 h) i# uvar bgG;
+ a; ]( b- t3 Y9 `# K; t L" L( `var bgB;
( U+ ?, F2 E& P% `5 a- b yvar currR;
/ `& T3 F$ j+ `% J! Jvar currG;) L8 A4 [6 @6 U7 O3 z
var currB;
5 Q. W/ f6 S9 L) T4 Avar count;
& [$ }6 u7 k$ ~8 [% n2 svar fadeOut;
* U/ |9 m ]4 T3 K& fvar continuous;; h. ^# Q+ Q8 o2 P
var newColour;
% M, V, E9 V# e3 jvar tID;! v9 [0 v/ K/ a; @1 R
var redInterval;% y) x* K, P7 ]/ c4 M2 W
var greenInterval;
$ E4 H. L3 ~8 J4 C1 v" Gvar blueInterval;, ^$ A3 N& P. C1 D1 B
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)0 d4 |4 O; u1 d, E9 k
{
4 |, A( B" A8 q! \ Z hoverColour = mouseOverColour;
' Q0 H: z0 d: a numLinks = numberOfLinks;
0 B: O, N, J/ j: {5 I' e rate = 1;
8 R) V8 X U) \4 l. A# X numFadeLevels = 30;
7 C2 M3 V4 P- f# Q2 d( {: @ function initArray(theArray, length, val)7 E$ y! @0 B0 g0 u4 i, W$ l W
{
3 Q" ^6 z' l' Y( k for(i=0;i<length;i++)2 s& e4 b( b8 C S" |
{ F' T: X/ k* G" W6 Q( T
theArray = val;
, `4 @; N) m1 J }* N1 k7 k. p% ?) f& O
}! P4 W7 I$ O3 s! X( M+ `
bgR = '0000' + fadeOutColour.substring(1,3)
' `$ L3 u4 w, j bgG = '0000' + fadeOutColour.substring(3,5)/ [4 A2 a0 o+ F/ \7 h
bgB = '0000' + fadeOutColour.substring(5,7)
& x. A) l8 C) U8 \3 i currR = new Array(numLinks);
: J9 l) R% [( ?* `% V currG = new Array(numLinks);5 r3 i4 Z: q0 L3 k
currB = new Array(numLinks);
' A1 e# ^# y. o. V2 e3 z; Q count = new Array(numLinks);
+ S: O' ]! n* f fadeOut = new Array(numLinks);( p% }* A0 L" d- N. g
continuous = new Array(numLinks);, s4 Z+ H1 E/ a7 {# w; d
newColour = new Array(numLinks);+ `$ _2 I: O$ }3 G+ ^) s
tID = new Array(numLinks);2 J5 `3 }4 z; J I5 U6 F4 q0 H
redInterval = toDecimal(bgR) / numFadeLevels;
- k# i" Z+ f9 M9 G greenInterval = toDecimal(bgG) / numFadeLevels;7 X9 F6 P* F; X( A2 `
blueInterval = toDecimal(bgB) / numFadeLevels;
4 F% f- j3 ]# E initArray(currR,numLinks,0);
4 k! O* y7 G' Z# I initArray(currG,numLinks,0);6 W: I2 s( v( u7 n9 r( q4 ]
initArray(currB,numLinks,0);
% w5 g& g6 m. O9 x initArray(count,numLinks,0);, ~4 U& b7 G: ~7 W
initArray(fadeOut,numLinks,true);
( x& \# I7 L6 l, }5 U initArray(continuous,numLinks,true);2 Z# V) h, A! v! ]% C9 y" H9 J
} " [3 M0 [/ [) l, u! Z7 K
function startFade(id)7 ]( [9 N( c% \! P
{: J: n4 m* t) f9 ?4 K' Z* b
if(fadeOut[id] == true)7 H, z! D. C3 y
{ /*move colour towards background colour (increment)*/. ?0 z) K% {' M2 Q
currR[id] += redInterval;9 o0 ~4 g% _ ?+ f/ m2 Y# [
currG[id] += greenInterval;
2 n- f: e' o; S" O* r currB[id] += blueInterval;' j1 A4 a- j" x
newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
+ z# Y! i' G; m if(++count[id] == numFadeLevels)
# |, L) o: f, @- J* ^ {, J8 D8 k. i7 L" |' o
fadeOut[id] = false;
/ T U+ c0 |5 V2 J5 C R }1 e* ~/ U c! c
}
4 Z# }2 c- k, ~+ w% [( Y2 i else' d! {7 m9 k8 G1 I/ g
{
: P0 h: w6 W* Z9 Y+ J currR[id] -= redInterval;$ w9 t. S3 a6 r6 d" k
0 P8 v3 L9 p3 \+ g, T3 b currG[id] -= greenInterval;
* W; c+ s4 l* `1 W' { D# j* h$ o4 L" t6 @
currB[id] -= blueInterval;
/ _7 j" `8 K5 o4 H5 P$ o* v; x1 j3 }* C* ]: D4 K
newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);# f$ l7 p) H3 U( @& {$ e
: W" m8 ~& |5 Z3 a2 E- y1 s0 t5 u if(--count[id] == 0)) x4 \- @- o. f- f# z- L7 M
8 @1 B, P0 `5 m
{5 i: ]' t* y* f3 ]/ O3 h7 o
; K& Z# W, K6 P6 S0 H( y fadeOut[id] = true;
7 d2 Z0 s* [6 h; m' y
* J8 e. p2 _/ B0 x6 A }. k& G# K( O- {2 f7 O
4 \' F u# J: Y/ S1 d2 v
}
6 G0 q$ b) K+ L& B$ m Q2 O2 ^7 O
if(continuous[id] == true)9 {! ?4 c. k( o6 \9 z. I
3 g( ~( k6 s% q
{
+ Y1 T' Z# ~$ Z+ r! b% {& x
2 \1 |- `& k7 A/ N; _. H' o4 d1 N document.getElementById(id).style.color = newColour[id];
7 V" _/ H2 Y2 J: ^9 q2 v4 w$ N; q6 C9 f6 G
}
; ^% [) k. \ u1 y9 H1 D% d" n
/ i0 n$ n$ q: U" H7 \0 j else
7 P7 R. n/ T/ R V$ }+ W# N0 I& U, w8 ]2 w
{
+ _& H( Z& I! M" |9 H3 [' s6 M& G9 z& @* d! w
document.getElementById(id).style.color = hoverColour;- U6 D3 b) [: d( D: P# ?7 W' s3 I1 a
" z3 s8 u, `* Z e f }2 B) f+ k; K* f0 T3 J& O
; E" k8 w8 V- F; S6 h( g" a/ [ clearTimeout(tID[id]); ^8 s3 T# a. l! O& N
$ Z) f$ L7 F0 \4 E6 j
tID[id]=setTimeout('startFade(' + id + ')', rate);
% n" Z1 y* y) r: z1 r3 Q$ x2 Q. W3 B! O7 h! f% g, D
}
6 C p+ Z: Z- g% o+ \0 q
- m: Y! @" J) Nfunction continueFade(id)
# T4 Q6 ^2 J% G* Z# r% ?# z+ s1 |& a
{
$ L- }# o5 h, u% |# v
* w Q% Q& n; z: E7 C continuous[id] = true;
+ k2 i4 t0 X# I, ?6 r% P7 [3 {% P2 u% S2 P ^
}$ A0 F* |, W/ }9 n" y
+ R+ [/ E2 b5 E& ?# ?$ w3 X& V- b* ufunction stopFade(id)
+ T- h- w) j7 i r w
( n4 N$ {8 {; q% |6 c! x# o{" P L V8 {( k: l% q+ |9 ^* `
: V! v4 x% R6 v$ @) @
continuous[id] = false;
3 b' w) F: T: \4 V/ W9 E7 A& Q% a9 x5 t6 G) Y
}$ h% M' B; w! @$ P! d0 o0 @$ q+ F
: c3 W; {' G: |$ V9 _) Ffunction StartTimers()+ a$ a; b5 v8 c! u5 D+ f$ y
/ o& @* o6 j- m! R5 }{ //set up an initial set of timers to start the shimmering effect
1 ^, y$ u& }' d8 V0 u9 U! B1 Y+ P6 l; W: ]8 k9 l
for(id=0; id<numLinks; id++)+ T' D6 a; B$ e4 b; t9 ~* n
+ i8 l7 P/ Z& A
{* b& j- V; v# o$ Y# ^2 \ m0 T# M
8 P+ N$ g" Y: y" g+ k: ~% ?7 z0 A
t=setTimeout('startFade(' + id + ')', id*100);
6 w: W9 V) V) \! k" \/ V: d
, o' x( I. y" I0 {! i- } }# d+ R' S; h/ A; r: i8 r$ B) Q
7 w- x$ I1 W y& O9 p
}8 |( X6 J, c8 C) o5 {
' [9 E) K* h4 O$ C% X- d6 U; l( b
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
3 }( p9 X( r. ~. F" B o% m1 W8 H& Q% {9 ?' c$ o, K& e
initLinks('#FF0000', 6, '#FFCC77');
$ i H, G( n( y! c0 _/ a
. Z. h1 H- _4 w# R e//-->
2 @6 H7 R6 ?" ~( {& j+ Y1 c! | J7 i s6 o$ q9 g9 ^
</script>4 {( D- N y$ x6 k6 \% o% m
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名:58元/ D4 s" u" C J7 J. w# p
</a>. i: `& T( G' F: w3 J) w# Z9 N# w( r
<br>8 B( ~& s) ^5 z& b3 r+ d9 ^
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名:110元</a>+ @9 D. z' a% X$ \" S5 n3 ~
<br>
# v* b8 R0 }- L& z/ g2 G. X. H<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>8 }- B* ]" d0 _4 I: p8 A4 G
<br> 2 ^# i6 a* {& k( T. c
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>0 t6 W% J' K. q# Q
<br>
, \: S2 k- U, c1 `; I8 D( R<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
G t$ m6 X, b# M x<br>
% O3 L6 h* W& p4 }" B* M) s* z<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>
3 @* ]' x9 e& j" J& w; f* c3 B<script language="javascript" type="text/javascript">( j. H" P$ L# \. M4 g4 P6 ]% f
<!--5 W% C: g/ W# e, _" ]0 e% ]
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
% M- w# q! a6 |' M9 S//-->
. X) ~# |6 O, b</script> |
|