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

|
网页之文字的循环闪动特效
<script language="javascript" type="text/javascript">
. l4 e/ @% g8 q/ |( c/ r$ C6 u2 F<!--
3 j/ p$ X0 l; f: n* q. n// convert a single digit (0 - 16) into hex% t, {- Q2 ]- o3 d
function enHex(aDigit)
2 x' i# u, I7 @/ K( v' k{
$ j5 U$ H) V7 m- ]6 W+ t. B return("0123456789ABCDEF".substring(aDigit, aDigit+1))0 T3 h9 I8 w6 j' G7 b$ p! q1 F* E
}5 J" h2 N( T Y4 r, `6 J5 n
// convert a hex digit into decimal
5 l; _* u/ s* }* ~function deHex(aDigit)7 i* |3 D$ V$ g4 `8 w7 n2 r- o) a
{
0 u6 i9 ]$ f' B( c b1 |9 T return("0123456789ABCDEF".indexOf(aDigit))
0 S5 D# f8 t$ h! l+ }: b! Z}7 P1 U! V# D2 s4 O9 k& ~/ [) |7 t
3 K* x/ t7 G6 Q$ q! S6 P// Convert a 24bit number to hex
, u w/ B/ n( y1 ]function toHex(n)4 z/ [5 j9 I$ z& P ?$ S
{/ _# O5 ]4 Q0 _
return (enHex((0xf00000 & n) >> 20) +4 Q. T0 c6 A+ Z& B2 U9 K5 d
enHex((0x0f0000 & n) >> 16) +8 M& ^6 D- g, u a* M8 A+ `! s' U
enHex((0x00f000 & n) >> 12) +" Q8 o+ \( U" ?, e1 A3 Q
enHex((0x000f00 & n) >> 8) +6 j0 R. u" V0 P
enHex((0x0000f0 & n) >> 4) +
" s* A) ^- D& |: }& @) Q. ^' m, M enHex((0x00000f & n) >> 0))+ f* V$ e, U; d# Z
}4 N+ c9 m: z6 F9 s4 D' \
// Convert a six character hex to decimal
& l9 l: j, s+ g: t1 T& [0 zfunction toDecimal(hexNum)4 m2 K! X% t/ G, f$ E- U
{# W% K; b2 T5 |8 N* M
var tmp = ""+hexNum.toUpperCase()
- T2 A( [( P0 |/ z while (tmp.length < 6) tmp = "0"+tmp
- K$ }, ?: L; _ return ((deHex(tmp.substring(0,1)) << 20) +6 }7 C% c3 `+ V1 K
(deHex(tmp.substring(1,2)) << 16) +
; k6 y! F- u" y4 f& Y4 ]- o (deHex(tmp.substring(2,3)) << 12) +& u ?+ g: D1 L8 p
(deHex(tmp.substring(3,4)) << 8) +
& N& @( W3 |0 y# C. Z1 V" K (deHex(tmp.substring(4,5)) << 4) +
, x: H5 d V1 ?0 m3 P& t S (deHex(tmp.substring(5,6))))( }9 T& v3 d$ L
}$ C5 L8 B8 G) J
///////////////////Shimmering Links/////////////////////
: l- q% F+ i; g) L//global variables
0 t/ ~; {7 L% x+ U/ F) nvar hoverColour
7 j/ V/ l$ ?- i' evar numLinks;
) C' w9 ~/ k# F4 j6 ~var rate;
: W7 C. @0 D& P. V j9 ivar numFadeLevels;# T( w1 n+ r5 F
var bgR;/ t* f i7 Z4 `$ G$ v, |
var bgG;9 l- u2 J k4 w! p9 c
var bgB;/ T% D0 z, r* {5 L
var currR;2 t7 F8 G1 R$ K/ L2 z4 i$ i+ h
var currG;
9 C! k" v; F2 Gvar currB;
5 s0 J* f$ ^/ f4 O8 |9 Xvar count;4 N" _, R/ |, `! S% U4 t! p! l/ F
var fadeOut;
, h- [+ S' Y6 hvar continuous;+ y5 }, J" w; y6 C/ J
var newColour;
' }- E) n2 e, |) E1 D$ L0 avar tID;
& V9 I: m# b4 u3 h. B. u! \var redInterval;; Y( k7 E6 |# D, W& g
var greenInterval;
& w& C0 E M/ ]4 D# C( C, W2 Avar blueInterval; m7 r7 g! z# x
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)* K4 C- s3 x0 }6 D7 }/ Y
{
/ d& z/ g& w9 e hoverColour = mouseOverColour;
% q0 Y( ?7 r+ O) Z numLinks = numberOfLinks;
) u8 ?+ R- q' \7 s4 k0 n1 r rate = 1;
& u. T: W& D+ F# { numFadeLevels = 30;# m& u8 ]: Z" H4 k1 O, M: X
function initArray(theArray, length, val)
6 {. v1 X. ]* g* w$ {; _ b {
0 U" k" X. Z- j2 j/ h; c for(i=0;i<length;i++)
D0 k+ y7 a) Z9 ]. t {
1 }) s6 z5 T6 J- x. T theArray = val;
" m& c+ S' `* N( J! p2 @ }* v4 W- E' [' ^# ^ W& W2 j P
}
" ]- f# @$ v2 D1 B" F) b: G bgR = '0000' + fadeOutColour.substring(1,3)
% ~2 E: A6 I. d5 q8 n bgG = '0000' + fadeOutColour.substring(3,5)
7 e# |' m7 S" f& q1 E bgB = '0000' + fadeOutColour.substring(5,7)
# ]* F3 T' T1 V! |8 Y, j currR = new Array(numLinks);, W; Y+ }0 I; q K
currG = new Array(numLinks);
3 f; B+ D* a6 `8 Z% N, z# ]1 `, y currB = new Array(numLinks);
/ s8 |$ b7 F2 J+ G count = new Array(numLinks);
3 }9 p3 }: o$ m4 H, l0 S fadeOut = new Array(numLinks);
w3 @* ~+ h, P9 B) e; _! r continuous = new Array(numLinks);2 q% a S; l' \8 n8 G( [7 Z
newColour = new Array(numLinks);; J& E6 z% _0 `% @
tID = new Array(numLinks);) j5 y" d8 T% @% ~( u
redInterval = toDecimal(bgR) / numFadeLevels;
' p8 y8 |5 c6 H; h, o2 D' f greenInterval = toDecimal(bgG) / numFadeLevels;
- s7 n G6 P: A) C! _ blueInterval = toDecimal(bgB) / numFadeLevels;5 U1 _& |7 m; B4 [3 r
initArray(currR,numLinks,0);
- A8 Z, O7 p1 p initArray(currG,numLinks,0);" o5 {# x! @" a9 D* @2 N
initArray(currB,numLinks,0);
* c# ?7 K( r5 @9 a0 k5 [ initArray(count,numLinks,0);
8 v8 Z$ z a2 q. f initArray(fadeOut,numLinks,true);
1 L- T J8 u D* K+ w. D* W1 ? initArray(continuous,numLinks,true);* O; Z) X4 f3 ^3 F7 Y. `2 r
}
; R. E9 e8 O0 y" cfunction startFade(id)
0 o2 j1 E' L" u! G{
' b. z! G% {; b$ W3 L" F8 F if(fadeOut[id] == true). f, l+ M$ H# ]0 b
{ /*move colour towards background colour (increment)*/) @) R" l# ]( @, L! v& v: \
currR[id] += redInterval;0 D+ `- `* s0 v0 B" Z
currG[id] += greenInterval;& U3 k$ W( @) q# J- A
currB[id] += blueInterval;
% c) I5 b7 B6 n& ?. a$ a1 h2 f' r newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
8 {' g2 R7 ^' q. y( i7 y if(++count[id] == numFadeLevels)
8 e2 H% z+ A. k \* [ {
9 A o4 f" t* W6 b/ D( a2 H, O$ j/ R fadeOut[id] = false;+ g+ G' C7 x$ C$ p
}+ b- c5 s3 \* ? y |
}( [% p3 U' q/ J$ P* ?- ^, L
else* ]# i3 y# W* c5 r# n& [, y8 I; \/ p
{
9 f% ?" w7 ]4 m; l/ n& U; G currR[id] -= redInterval;
$ X4 `& ]% p1 S* q
_" T8 E/ Q$ u0 D' ~* j currG[id] -= greenInterval;
& r1 {: I$ k0 X- h. e# g: i
2 ~% h9 ~# F9 k currB[id] -= blueInterval;
' X% y# G5 U6 D6 [. L6 z' R" X: A- c* n) P6 s) U& @ f/ E
newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
8 v* ]) q$ {/ Y4 u- `. K5 H3 I, v+ ]1 Y: _# `" m3 B7 B- x1 A3 d% b
if(--count[id] == 0)
( O4 q6 ?$ G5 t' \- e- d8 D* w! e8 ] X* h" N4 |
{
' b5 {; I; K) U
1 C5 ?: ?9 f" C0 b fadeOut[id] = true;: N1 e) r$ z- {+ w) E/ h" k4 y
+ }* A/ x* X: l, s0 U d3 t
}
4 V" E+ A2 o2 }1 c6 F
! x( b/ A1 d: p3 e/ B2 i! c1 n }; r+ E0 L; z" J( A+ q
; b- |) w6 ^! _* S r
if(continuous[id] == true)4 U7 D' K) B/ m
9 m# S8 i4 a7 h: B9 c: `3 b( z
{1 f$ @8 s4 d! L8 s
y' o0 e8 Y9 i
document.getElementById(id).style.color = newColour[id]; 9 g# Z* O' x0 S% |+ T
7 o3 C+ k5 I) C9 T# A5 a
}
( v8 O- _/ z5 }3 Y2 J* _& M0 }) d# C, Q0 b
else
& @/ l! a+ C, [1 S; W7 `1 j
6 n( f2 w7 ? N A8 _; G, H {: u) a" K- y: x: ~# x) t" J
" \) I1 w1 s* M/ |) A5 p
document.getElementById(id).style.color = hoverColour;# a l4 H6 S9 V5 L; L7 @. M
" t5 s4 ^9 z. Y
}
3 A& d6 g5 ~ n6 x8 y- b
. \* s4 Y9 `0 T0 o) H5 Z+ Y N8 K( l clearTimeout(tID[id]);: ]( R& w6 F+ V7 W2 q p: i
6 D) P0 d- F; V5 k8 m tID[id]=setTimeout('startFade(' + id + ')', rate);( V2 C% _7 M$ U
; a4 o7 `8 l1 X0 u! D3 O4 L
}: ?! Y' ~# h4 J/ F8 ^
1 K' P1 j! K- n ?5 r4 U* r
function continueFade(id)
_& y! i$ Q( h- w/ a7 S% J, H. C0 P. |& O) R
{
. U; p. o) y* u; t: l: t) X0 o2 W" }1 `! D- q6 [- r+ e+ B
continuous[id] = true;6 i% H7 u% n b y. u2 T4 }
" l4 k8 j2 }( w. n" A6 Z0 c
}
( A0 Z4 I3 P; }
6 Z/ M$ C* p' x6 Y/ Efunction stopFade(id)! H3 I3 O- p+ M
5 a* D6 j. R5 _1 |
{
/ a/ N J9 {- R; K2 ^( k
: j4 T1 b9 I" U* e continuous[id] = false;
2 L1 Z# S4 T4 {3 _
7 N: k, @) a; w}
0 A- \* Q" ?' M7 Z6 c/ C& P# \2 a6 o6 }1 W( ?! f k" ]4 b( u
function StartTimers()
' }4 X" l- ` P- c) X4 Z; G" |2 |% h4 k$ H1 e
{ //set up an initial set of timers to start the shimmering effect
+ Z6 ]) G# F2 c. O! C x
! [+ i0 ?! [7 P5 C) \1 @8 X; O+ w. o# B for(id=0; id<numLinks; id++)
# ^4 y8 E8 T/ Z+ a* V4 F1 m, x5 e2 O# x& ]
{- N; x: V* y; a p( o
2 z0 ~8 C6 A6 C* w" V2 S7 w e t=setTimeout('startFade(' + id + ')', id*100);
+ h: b( ?, q. z1 D# y/ O
* z& u' \* | V* v6 G% | }( y, q/ n( @# @0 ?! @. y3 c
' L( \0 W6 s; |, N; N' T* y! c
}& ]# e9 o9 E9 F4 b8 u* y
& \! O( G$ I7 ? J/ l6 x& c6 m
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
- c/ v7 ^( d! ^# h6 x2 r2 {3 ~
7 g& h( d. e8 R' i5 ?initLinks('#FF0000', 6, '#FFCC77');; ^& }& W# s5 J! v7 `, \" W' u
( G% U. u/ P+ n/ d5 F2 W//-->
% u& m$ J4 H! n( L, i5 F. @, S4 X% b
</script>2 q. M* ?9 L5 g6 Z1 R
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名:58元
7 M7 G }6 W- `; g; c" o8 j- m</a>
# Y% B3 J* t: A' F2 s<br>
1 L/ k! z s5 ^5 J! D<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名:110元</a>! S/ n$ Q& X! X0 h
<br>6 P2 t8 E0 P0 Y7 M
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
' i+ s. {0 p8 I( K# x0 @6 B<br> 0 O: } \3 v* X3 l, t
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
# U0 M3 o! D8 g" j0 h9 z<br>$ Y6 g* r! }9 Z% \6 a& b/ j
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a># ]! m+ J& ?7 i! {; s# C7 P
<br>
2 N3 T# E$ a% @7 o<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>
0 y+ P# H4 t4 F s<script language="javascript" type="text/javascript">
C# k$ i/ x- s6 Y<!--2 L9 \: Q& Z2 L7 v
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
+ w' P; M* I+ I$ e; w//-->, E* I& Z/ O7 A
</script> |
|