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

|
网页之文字的循环闪动特效
<script language="javascript" type="text/javascript">8 a+ _7 i% [# g0 m' g n' G
<!--" F2 |9 I) N- A
// convert a single digit (0 - 16) into hex
9 {0 z7 i. I0 r" t% ufunction enHex(aDigit)
# @; V! h5 [$ C( X& q | \( T- H" n{
7 a, a1 w# s; _) ~9 y* u) L( f+ _' \* e5 x return("0123456789ABCDEF".substring(aDigit, aDigit+1))* ~9 }: e: b% \5 T" y1 k2 z9 J
}2 P! Q& o: b( {: b0 J1 L2 C( k
// convert a hex digit into decimal
' i9 _ \- O$ x0 j8 xfunction deHex(aDigit)
d- B( G5 I, H: n{
7 ]0 q( q+ a3 X1 C6 W return("0123456789ABCDEF".indexOf(aDigit))
- m: b% g5 n$ J& j+ y}
& _, S+ g, ?" \; ], o% A) @
$ s9 J; u; i( e2 l8 [# r// Convert a 24bit number to hex
, B$ ]. p9 E0 ]0 v& q# y8 m- Xfunction toHex(n)
9 ~# c3 T- c3 u: @. D6 |( j9 A{" [# E+ _# c ~, M- `
return (enHex((0xf00000 & n) >> 20) +
1 q- `! ^( e6 q0 U$ X enHex((0x0f0000 & n) >> 16) +4 z! U7 W/ z2 X: [, N& ?
enHex((0x00f000 & n) >> 12) +
8 n8 f2 o' v- X# ^/ J, c; J, ` enHex((0x000f00 & n) >> 8) +
2 p6 b3 ~( G+ z' d; d( R: } enHex((0x0000f0 & n) >> 4) +
1 V3 c+ F) F; @/ c" ^3 W! Y+ e enHex((0x00000f & n) >> 0)), b- H* N$ ?; k |. w
}: X" q- D0 x: m: K" V" Y! z+ q/ p
// Convert a six character hex to decimal
, Z& c: x3 H2 m5 l; }function toDecimal(hexNum)" d( ^0 s0 ^7 P4 O$ ^1 G
{
. y2 n/ g: A8 t. F, i/ o; S, | var tmp = ""+hexNum.toUpperCase()
- i% a( \0 ~& E5 @; {3 C while (tmp.length < 6) tmp = "0"+tmp
! s" R+ P& a( S* r: G9 K return ((deHex(tmp.substring(0,1)) << 20) +
9 X) e: }( k. T4 I/ N (deHex(tmp.substring(1,2)) << 16) + 4 o$ c' X: c* Q- o4 Z/ s8 v0 \
(deHex(tmp.substring(2,3)) << 12) +! n/ h) k) n( N |: [' L% f
(deHex(tmp.substring(3,4)) << 8) +- b" Q" R' v% W( w* O# t0 X
(deHex(tmp.substring(4,5)) << 4) +
$ L4 ^# A$ T( l (deHex(tmp.substring(5,6))))9 G0 L: N+ }3 C8 f
}
6 c* q; ~( ^9 [4 s1 H& ^///////////////////Shimmering Links/////////////////////
& R3 k: |9 c$ O0 L- ]//global variables
& ?' A. \$ p+ e. W7 d. Q/ Tvar hoverColour! V4 D& B" j6 T! i* Z0 u% g# {" u
var numLinks;
7 v5 Q, d+ M5 L; u7 mvar rate;
$ r8 y, |9 }7 \9 W. Y# \ Kvar numFadeLevels;
X( \) q6 R, g, p/ a3 Kvar bgR;2 g/ Y% ^% b/ _$ N% V$ l( m
var bgG;
/ y7 M# \ \7 m) _6 }var bgB;
8 E. C3 |# R- K1 ^3 K; M8 ^" U: evar currR;4 C: r% C/ N2 t
var currG;6 \, u4 D8 [" {+ g3 V
var currB;
4 V z4 h t0 P D$ u$ {: qvar count;5 l5 T S5 ]0 B) ~" g& N
var fadeOut;/ L5 v k8 `2 g: _8 Q/ Z7 a
var continuous;
8 \/ y0 u! G" i) U# a+ v0 `var newColour;
: B1 ~ g' s6 l2 a6 }- avar tID;
( J a, r6 h8 j0 m# D9 ]var redInterval;
. T' N3 S3 b6 Fvar greenInterval;! e$ x6 @. t; f' Q: ~* r! V
var blueInterval;
% K! _; h' p" S8 I6 i1 o8 `function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
m9 Y7 O3 k/ R: K, C! `{0 g" g6 c6 r% h# o% s: m
hoverColour = mouseOverColour;
/ t, k$ m. ]% _) S numLinks = numberOfLinks;" t1 \: i& m# j# ^' \
rate = 1; K8 u( q" G o7 A* R, a. P
numFadeLevels = 30;
) d% C2 r, l* Y# M" K function initArray(theArray, length, val)
: O3 r; z7 i9 T5 | {( V; d, v; G- P) w) J, s! q
for(i=0;i<length;i++)
E# s$ S) N3 H/ R$ Q4 } {7 [6 Y7 M0 T4 L: e- t
theArray = val;
/ I0 i; m5 c( V: ? }& |$ S; b |# ?( F. x2 d8 J
}2 D3 }0 i, ]) D( [
bgR = '0000' + fadeOutColour.substring(1,3)
# }3 n* p3 h# L' r9 y bgG = '0000' + fadeOutColour.substring(3,5)
" K" X8 {# O4 B0 B9 T3 u bgB = '0000' + fadeOutColour.substring(5,7)* K( i7 [/ \+ W( T
currR = new Array(numLinks);
7 U& a' _0 V: d9 y, W7 |7 u currG = new Array(numLinks);
! q d% v) P" T currB = new Array(numLinks);! M5 C7 T8 T/ k9 |# w u
count = new Array(numLinks);! s2 ^6 b$ G, d) I9 ^
fadeOut = new Array(numLinks);
6 u, ?0 ]9 a! p0 o; h: C continuous = new Array(numLinks);# S7 H; d. U$ p
newColour = new Array(numLinks);+ |" L1 s) \# i, w, M z! p1 U( u
tID = new Array(numLinks);
9 _2 C! f* M+ G! Y+ ^! r0 v redInterval = toDecimal(bgR) / numFadeLevels;3 T5 {& m# j& k, J. Y. _ Q0 P
greenInterval = toDecimal(bgG) / numFadeLevels;% T: O3 U9 S P0 `8 t# \
blueInterval = toDecimal(bgB) / numFadeLevels;
" m3 L( x" }8 Z" { initArray(currR,numLinks,0);' x. L% J! W$ K- _" U
initArray(currG,numLinks,0);
' D0 J- `; q) e4 V initArray(currB,numLinks,0);4 k. g+ ^5 d8 A: U# y) U
initArray(count,numLinks,0);
! I4 \/ s" M1 x initArray(fadeOut,numLinks,true);
/ Z# a: y; P$ I8 C+ Q+ M initArray(continuous,numLinks,true);- Q8 E. S9 M B* ]. z u
}
- G' m7 ?* T% H$ T/ T5 yfunction startFade(id)9 S" f7 b' m' o2 o) u
{
4 s0 l6 q0 i* ^2 v if(fadeOut[id] == true)
+ e) B5 _1 p1 Y+ j7 j4 h { /*move colour towards background colour (increment)*/- p1 e6 C! ^/ h
currR[id] += redInterval;
$ [# @! D0 [. i, u currG[id] += greenInterval;; `0 z/ t5 \7 }+ m' V+ P) V
currB[id] += blueInterval;
! h6 D7 r% _1 p5 V* M, V7 y. C6 A | newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);4 I# x7 ~2 u0 {# c0 L9 t- \
if(++count[id] == numFadeLevels)
" f' o4 r9 d( E4 F$ f" a {
) i% c! l- _: {; `: F& D fadeOut[id] = false;
9 r3 B0 d+ x. l) v+ j4 ]; ^ }
' r8 N; |7 J! }1 G' r }
. K1 f* e2 c/ j5 Q: [ else+ J' V9 _& f, n1 x! @1 \1 l) \
{! o1 j2 u- x$ g& M' {. J
currR[id] -= redInterval;# G% r6 l& Q# O/ x# ~
$ J; f4 k7 \/ c1 Q, R currG[id] -= greenInterval;0 j1 J8 b5 E0 S# e+ p
% q; a; w1 N8 I) r6 c currB[id] -= blueInterval;
% G- l. `, g' }4 T! w% Z
/ Q, F, O; Y; H. S! p( | newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);; `! t7 z$ L# {0 {! u
' K2 z' Z3 E2 D, }7 c if(--count[id] == 0)! K8 _9 p3 R- C& \
4 g7 C% U% T) @0 y6 P {1 `8 {# i( y9 O# x, }
( F% V+ J# O5 q! q3 M
fadeOut[id] = true;
0 X* m# {/ P5 K6 [6 {- C$ e- a0 p( S. ~/ i1 `1 L0 B g; ]
}# e Z. @7 H; l3 A
+ S0 A" ?: V9 E* ]; I
}. Q) H+ y$ c/ r) X$ ?$ E
5 O$ [& L, U& \1 H) s if(continuous[id] == true)
7 T+ {7 r+ d2 G: e( z I
3 h$ A( K: a( C- b9 K {$ U% k% k8 }+ X& N& i3 w8 C
0 g; _+ w( [) g1 y/ h1 O
document.getElementById(id).style.color = newColour[id]; ' g- V0 @" a, ]0 Z
`$ J2 A' y n }
4 N+ b4 Y) t' h
) e! p% j3 I: m/ k else
, U+ ~! R) \, v+ @% @; i T- S8 r9 i7 u; z* i n' L
{1 U5 m! y, \8 G
9 y. I1 z# \6 I i3 e
document.getElementById(id).style.color = hoverColour;) C. ?- A4 S$ ]& [
. A0 j3 y% A) D
}0 {" M! G3 c1 V! d9 F
& N! v, B& y5 ?7 A
clearTimeout(tID[id]);2 V9 v7 o- T% j7 w9 O7 D( v
/ G) B# Q) Z3 D! x
tID[id]=setTimeout('startFade(' + id + ')', rate);
0 ^# W- E: E6 D, _
2 e: Y) T6 i6 x% U}9 P. ]4 \# v3 q5 a' s4 }/ F h
" ]% a- h7 O. ]# N3 ]
function continueFade(id)
/ b" C- _$ o$ r! s8 r) y% \$ j) `
K2 O( `, E0 m" B{8 n4 b& F8 n5 p: k( W$ ]# U
2 A7 Y; b* S2 J9 @1 X
continuous[id] = true;
0 ]1 g6 L2 v5 W
# b- o- F G$ r( D: ~ p}& S; D. Y0 {7 Z1 y( s
6 t, W+ d5 J: H O3 Z# }/ d& \function stopFade(id)7 U* S; Y \, z3 l! M2 p
# R: V1 a: x T* y4 O
{; V0 x/ Z' c: m
) {9 K# I. }" c) y; O( A' i5 N
continuous[id] = false;
5 T4 R6 n5 G I$ _/ g$ {8 x( w, I. m0 _0 r# j
}8 v, G* R5 \8 v0 R$ Z
: G* m5 U8 o7 Z/ ^2 O# {
function StartTimers()
n+ X' V/ R% j) t1 t! G* L0 \+ b: L$ U" R
{ //set up an initial set of timers to start the shimmering effect
' M" }+ m6 ]! H9 A. m* n" y4 U( x! x$ {8 ~* s8 u) ]9 d- y: C
for(id=0; id<numLinks; id++)
8 J1 u& {, I9 N7 M9 S8 L) X6 @7 O% Y) `6 b( v2 f8 L- s8 O
{" D3 f& f6 h6 ]- A' b
) |4 I! K8 N# S! t1 L
t=setTimeout('startFade(' + id + ')', id*100);
* b+ @- {4 s/ H! p# L2 i [8 s8 x( |, T
}
: }0 @5 K3 X( b; q, s. Q
2 L# ^6 z- c1 f, G* W}9 {, J$ S1 Y# |2 z# h1 E. ?* {
5 o% ~# ^% ~- |! G2 u4 w
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour'), Y, \( F- N( N* Y6 Y9 U
2 I3 I* D) {( ^# o iinitLinks('#FF0000', 6, '#FFCC77');8 H3 a% Y* l( K5 r4 w
2 V& [. I( j' D/ X5 r: S1 {
//-->) y' j$ b! K0 {, u7 A% v
: M* C4 q; ^8 V. H
</script>
8 s( j- B q2 p& q9 v( q<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名:58元
$ `/ w) R4 K9 N* x* Q" @</a>
2 y# x4 f' Z/ e0 b7 s# |<br># F/ s* u6 R3 M h
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名:110元</a>; T X5 o& w! v8 _4 k
<br>
, S2 E# `2 A2 ^( J3 r0 c' P, w<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
% ]! V. [0 }5 ?9 R1 q<br> $ n7 I3 }7 } M2 v
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
4 O& k* H& ^4 j* }! i<br>) t! g' H4 v9 Y
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
: C+ H, y' G( Z+ I' o! B$ `<br># \+ V7 b% ?% ~; ~6 t
<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>, O4 \. T% y# A
<script language="javascript" type="text/javascript">
( w- x$ z( l( B' e3 d<!--
% P& Q: ^6 W" ?- T# i$ C7 V( Y: PsetTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering4 p. |6 w; N2 K) \/ ~
//-->
, h i% ]/ A6 H* {1 j& P</script> |
|