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

|
网页之文字的循环闪动特效
<script language="javascript" type="text/javascript">
) ?) B' \; m9 ]" `. U, r1 A* N<!--; e) Q$ r1 @8 A( F) |6 b
// convert a single digit (0 - 16) into hex
9 {6 ~2 g& s- _* ~& p0 ^5 Q* [function enHex(aDigit)+ e. Q# R& j j* d. t+ A$ r7 L9 j
{) _. P8 v8 x& ~
return("0123456789ABCDEF".substring(aDigit, aDigit+1))
' u' ?' K' x& F0 \5 Z}/ B5 w& o9 v3 x# D. H
// convert a hex digit into decimal- }2 E) ?8 F w: K) x2 y% B% A
function deHex(aDigit)4 y" b: Y' {/ s" x. W4 b# T" j$ o
{8 ?& |' d; Y: o4 T5 M& S! [4 v& J
return("0123456789ABCDEF".indexOf(aDigit))
* f5 m U0 }) F' D+ C) o! b1 d6 W}- s# I4 c- b3 I7 G
* B; |7 X4 Y9 G! g3 C3 e// Convert a 24bit number to hex# e# V8 O5 p) W# \
function toHex(n)
2 H+ F+ [- X2 _{8 ?/ X3 @0 x. I6 g
return (enHex((0xf00000 & n) >> 20) +
1 [1 Z. T* L: }+ ?" F5 K enHex((0x0f0000 & n) >> 16) +* O; F4 }6 N7 X. d& y% c( I9 ?' {
enHex((0x00f000 & n) >> 12) +3 a7 r( d K; B0 x- R
enHex((0x000f00 & n) >> 8) + ?8 S1 W3 p: K& |' ?0 P
enHex((0x0000f0 & n) >> 4) +
9 Z& N9 F# d! Q enHex((0x00000f & n) >> 0))! @2 S; j0 d- Y5 t. p
}
( w+ H( n: ^* ?* I( t5 z+ X6 R) V- G; e// Convert a six character hex to decimal1 u! x& y# d7 E+ t1 M2 E! X8 G" b
function toDecimal(hexNum)
) ]- d$ [- e9 K7 V% v" J1 D; K( ^{, q6 @, k" y& f, i k
var tmp = ""+hexNum.toUpperCase(). @. B- o& Q6 r* B- @+ i& w
while (tmp.length < 6) tmp = "0"+tmp
W6 u! F; t: T. ^7 F+ ^- b. e return ((deHex(tmp.substring(0,1)) << 20) +
6 \) B! M0 q# z) ^ (deHex(tmp.substring(1,2)) << 16) + * c$ R; s( S# [
(deHex(tmp.substring(2,3)) << 12) +
& F8 c6 s: A$ d5 l# o% [ (deHex(tmp.substring(3,4)) << 8) +
$ e9 a1 y/ e6 }) |+ u! e) b: g (deHex(tmp.substring(4,5)) << 4) +% j/ b# i$ M! z, i7 J- V5 `
(deHex(tmp.substring(5,6)))): G0 c- Z& _" E2 S. i B* U- {
}
+ {0 M- r6 D: V4 ^, T) _///////////////////Shimmering Links/////////////////////: Z* Z5 l0 |6 q, P. V+ Q
//global variables
) o5 I, w6 r. c2 gvar hoverColour& k. b+ O$ X& P+ i- s; E3 H$ k
var numLinks;
6 M% G* ~/ ^: pvar rate;* W: C% M# X5 c7 w* @% X
var numFadeLevels;( Y" ~$ U- S. p& Y8 w1 @
var bgR;& u% z) h1 e H$ \
var bgG;5 b8 S2 \) Q; _
var bgB;" ]5 I, L8 q8 _, R: O
var currR;; t6 D3 T# J- x1 ?) x
var currG;
" C) D- u9 A& T6 x ^/ Evar currB;1 |9 ~& k( Y; o3 X8 f8 M
var count;/ c! `1 `) ^' E2 |8 T- W* o
var fadeOut;- v% E) Z; m0 ~+ p1 v! k* G+ U
var continuous;
$ R9 F+ f8 u* b! ^' O! gvar newColour;' O# s! X) K- X( V8 E
var tID;
8 H+ m5 ^4 P2 {% }# d; j, h/ B! Tvar redInterval;
4 M+ B1 Q8 l2 H- h9 @; z) Cvar greenInterval;+ _* @) o/ g, g
var blueInterval;% c* b; t$ j9 x& h- j
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)9 |& O! \* x+ ~% ]. l
{6 P* q N: u+ i6 D
hoverColour = mouseOverColour;$ W+ ?- R4 Y& C# T
numLinks = numberOfLinks;
- D9 a, N( T$ i/ V }. O) _, p& \ rate = 1;
+ A t% n' [5 h" d numFadeLevels = 30;
7 K* j4 E; h6 V# Y4 @$ H function initArray(theArray, length, val); e% |& ?' `" |4 u2 {4 [
{
m5 l) A5 h9 c- c for(i=0;i<length;i++)& ~- A7 K0 d! {- k
{2 f4 v2 b# ]% ]! N* x! Y l
theArray = val;
, `' d3 |6 g) A K }! X' m' h% e5 F1 P* i+ j
}3 ^6 g* j" t" w& t, A4 T, Q8 m, x
bgR = '0000' + fadeOutColour.substring(1,3)
5 H' f% s( o7 F8 r7 ^' E; m0 g bgG = '0000' + fadeOutColour.substring(3,5)
' E& W0 e) ~) _- `7 J3 r bgB = '0000' + fadeOutColour.substring(5,7)
3 w7 E8 H3 U, T currR = new Array(numLinks);; ]( M. Q, ]3 k3 q" }
currG = new Array(numLinks);
9 J. ~8 y S; ~* L R- f/ f. K currB = new Array(numLinks);" I( R+ L J( A8 q
count = new Array(numLinks);
$ u$ e% x4 u6 M fadeOut = new Array(numLinks);0 H$ L% X }' @3 m" D$ M
continuous = new Array(numLinks);
3 l0 X( K1 T% S' H8 r, g$ r2 j0 R newColour = new Array(numLinks);3 Y: l, W4 m, H/ S1 E+ L! e1 b
tID = new Array(numLinks);0 P0 T8 E3 e2 Y5 Y
redInterval = toDecimal(bgR) / numFadeLevels;
: m2 o. J2 P0 o greenInterval = toDecimal(bgG) / numFadeLevels;: `+ y# b( T4 N7 f G2 h
blueInterval = toDecimal(bgB) / numFadeLevels;
0 E& A0 X4 D3 d4 } G) s* G initArray(currR,numLinks,0);% W! I% \ g3 `4 p
initArray(currG,numLinks,0);; a. |2 }; f1 u% Z
initArray(currB,numLinks,0);& i" w" j$ s+ }+ R" i- N
initArray(count,numLinks,0);; |. I& T2 r7 d) }" R* G" Q
initArray(fadeOut,numLinks,true);9 h. R x9 e9 k3 P/ S- k
initArray(continuous,numLinks,true);
4 k0 w1 K. @/ j5 U6 |: c}
) O+ ?- F9 K- d6 n* R* X- N x; Q- w, Efunction startFade(id)) ?( V) r3 S/ ^5 D5 [% F
{
/ B! X( R- h- }% W r5 N; E4 w7 X, O: E if(fadeOut[id] == true)
' n8 W4 ]% w B: u/ S# a; u { /*move colour towards background colour (increment)*/# M X1 |: R4 d3 X: X, x
currR[id] += redInterval;# C0 x4 ?1 R, u% q
currG[id] += greenInterval;
" j. m1 D, q" [# @ } currB[id] += blueInterval;: G4 F, s* H# r3 ?1 L# ^. U5 z
newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);% Q0 y# f3 Y- K% G( `
if(++count[id] == numFadeLevels)) Y* G& [1 |! Y { [. {
{# h6 A4 }$ r5 s' j5 o8 {: o
fadeOut[id] = false;
+ I1 g" d/ a* S; R }% o9 L- q: x* H3 @- Z r5 V+ F2 e) o
}
+ X+ Y8 h7 ^0 Q+ t" s& w else
% G+ M+ X9 L" z& r( o {
0 C2 K1 x( Q8 A7 v" _; N) N currR[id] -= redInterval;0 O ?+ K$ q. D" P( d- _0 T
d2 J: q4 `3 E* f9 q5 O) W currG[id] -= greenInterval;& t3 O o' ]2 i$ L
- e7 k! T3 Y9 M. S; \5 ~
currB[id] -= blueInterval;7 G" a$ q1 j0 }: F5 n$ x
& I5 W7 ^1 n2 }2 ~7 P( r newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);1 W! ?6 k4 g8 o/ A7 y
( G( M3 F4 k" F5 L6 h if(--count[id] == 0)
0 M2 E8 G# b3 _ z8 @% `
& ]. T' x: Q# }' T) G {
4 _! k/ I x9 C) s$ ^" q0 u$ l. c; h& x' u5 O. V
fadeOut[id] = true;5 d3 E' F2 g4 F+ j
# g# h- i$ h$ m
}
0 \: M) ^9 y( K/ [' e4 p. z2 N0 S& z+ X
}7 J: i% s. ^& d l$ W
; J, Q1 X( ~- A, J6 {% d if(continuous[id] == true)* o( r3 K6 h' A, d% P
9 S1 ~4 {1 l: W {1 [0 K6 m! ~# O& q- e9 a& p1 i9 F
6 [7 h% H5 t; ^" p2 Q1 e' v
document.getElementById(id).style.color = newColour[id]; x% g* A' C# R! y' v ?
0 l* C8 n! U' w5 E% [ }5 ^3 ~/ {6 W9 \+ J9 O
; T1 d4 t& n# Q3 l9 C' Z7 Q4 Y else7 Q) h/ R! D5 y. X
' C( K8 k$ b4 N* v' s8 S/ g$ [
{
J; C+ t# Q% a0 f3 J4 {0 C0 g5 ^4 }! Y( f# ~
document.getElementById(id).style.color = hoverColour;( Y7 B L7 E* N! c
9 |" x* _! I4 N( c! x' [ }0 ?% M2 R9 M9 A6 V
' O9 n7 @8 \: E clearTimeout(tID[id]);8 |/ a7 n5 d/ D% P+ V
+ n: X# J, c# z% S
tID[id]=setTimeout('startFade(' + id + ')', rate);
6 N! g! |& v0 z' \
3 k: o! [+ A! q; I6 B}/ w* v# R+ p9 A) {- j" @
; w5 N6 G/ M. c6 a1 A/ M9 ofunction continueFade(id)# L5 i, c, M0 H5 |
# E9 T- }- A" ]2 [" E) D7 ?
{
) S' N, s6 w4 O" i- y" d( i: i2 e& h4 z; F P* x( p3 `9 a& i
continuous[id] = true;2 G) n& O# A( f
! n; F& k" R0 B7 _2 ~# A/ n}
0 {8 e8 R# A8 d g
* C H$ R# K# Q$ Ufunction stopFade(id)6 F% a( e7 f* W z& |
5 v+ o: d8 f5 g% Z0 n8 h) P{7 X0 Y( A% R K. A& E1 p
3 [) ?) p( k8 ? o, V continuous[id] = false;" S& v* \* M6 K5 Z& R# b: D
2 M5 l) q7 g( y# e& c* K}
: y/ h9 q8 r) ^) }4 r: x) ^% i8 \, m S& D& u- R
function StartTimers()
, |, g" t. y. j0 l& M# I
; [8 k# U9 |+ ?' b" J( M{ //set up an initial set of timers to start the shimmering effect- r7 \4 v. B- a. _! z( A
4 I6 [8 \4 w& ] K6 j" V( s/ |$ y$ X
for(id=0; id<numLinks; id++)* I( U. o8 P" p" H. J( L4 t6 {
3 c2 z' I4 i7 F' N6 V8 B# ^ {
4 j6 B5 x0 j" D) @1 @9 h% R; A2 S9 Y, G3 @- \% s8 D3 ?2 `2 T
t=setTimeout('startFade(' + id + ')', id*100);& N) L- B/ z2 e6 |+ d
# |: v6 N$ e& ?) m1 Y& N
}
1 Z6 [+ m& O) M/ f2 \' n4 Q+ m: c9 o# x8 n" l0 _
}
$ q9 q8 L% h9 Y& m# L" G' |) e6 K. D
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
, o2 ^6 y" W3 C, T$ |: b! S) ?! L, ^( w! Q
initLinks('#FF0000', 6, '#FFCC77');
5 c+ F; a0 R" {1 Y$ L6 \+ e3 D% y$ o9 }
//-->
% M# y0 J9 c2 o) {( ]( E" x* N8 q: R P# _0 b" S6 S @
</script>% a% [* A( t+ i7 C3 r$ n. S
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名:58元
" X% ], P* z8 t/ C</a>
8 S% L% l$ j6 F( d! P: N/ f<br>7 t8 n) d' q# O% z
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名:110元</a>5 g: U! e/ N3 T
<br>
" Q1 b' X/ O1 X2 y8 m<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>) U0 {/ i. N. o1 \
<br>
/ p' j% P0 c& s' |<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>( m" j; w; ?% A6 m
<br>
+ g% v1 `9 a/ A<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>( c: M. R* h8 P b- {5 o
<br>9 I; \3 A8 P: D
<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>
- S+ F/ D: z+ [+ R ~<script language="javascript" type="text/javascript"> }) P- u" s/ O+ Q1 Z) q! p
<!--1 i, D$ H& Y3 S7 ]. @/ L
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering5 G5 s) Z8 l1 }
//-->
8 \ _" K0 n: ^( A, ]</script> |
|