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

|
网页之文字的循环闪动特效
<script language="javascript" type="text/javascript">$ T1 _0 O! C. T' F
<!--) f7 R! _* K: W0 ~: f
// convert a single digit (0 - 16) into hex' k0 e6 r4 U5 N% P
function enHex(aDigit)
9 N8 Q. F% y' S2 U. b{9 U9 X) Z) _9 K8 m7 g" Z
return("0123456789ABCDEF".substring(aDigit, aDigit+1))
3 [3 a2 t1 I7 X* S}" R, H5 `8 D a
// convert a hex digit into decimal
+ ^" Y* ?$ T# _5 f( y& z/ ]8 Efunction deHex(aDigit)
& q. n; z& @* c5 b! S3 s1 d" U* V{, F8 P5 U1 R# j" E( s) i
return("0123456789ABCDEF".indexOf(aDigit))$ n$ E* [9 \/ l, H
} y8 O, J" S$ r, B8 [
7 I. I$ @/ ~! D; M& \9 g2 [// Convert a 24bit number to hex
. G* T3 `- Z w' o6 ?; T& efunction toHex(n)+ Z4 }9 M, B' t, k
{
. d }# n7 c: H; N2 M3 |. }8 V return (enHex((0xf00000 & n) >> 20) +8 a( \% J: e( U% P- R
enHex((0x0f0000 & n) >> 16) +
$ I$ U5 g0 |. F. r! ?/ R enHex((0x00f000 & n) >> 12) +: `, v$ a7 X9 N( O* X1 o
enHex((0x000f00 & n) >> 8) +
! G \* P6 u+ C enHex((0x0000f0 & n) >> 4) +
a( U* t! ]0 B9 K; P, p/ ?, j enHex((0x00000f & n) >> 0))$ O# ~# o# l/ c. F
}
* q; ?% W2 z$ o4 c// Convert a six character hex to decimal: s# E1 z1 ~7 k9 s+ _# h* t- p$ f
function toDecimal(hexNum)
- W; g* u3 B) G j$ b8 s% n{
S8 u0 v$ E! r9 L# B" V/ A6 n var tmp = ""+hexNum.toUpperCase()
# s D" ^# q- R n* n2 Z1 t; G while (tmp.length < 6) tmp = "0"+tmp8 g' c5 c! ]* G1 w
return ((deHex(tmp.substring(0,1)) << 20) +
( G. G, n+ T; o (deHex(tmp.substring(1,2)) << 16) +
1 f- C6 G5 [9 [ (deHex(tmp.substring(2,3)) << 12) +
$ x. \6 c) y& H5 g! h7 @ p& r( H (deHex(tmp.substring(3,4)) << 8) +
! M1 [6 S K) h) p9 S, V1 a0 t (deHex(tmp.substring(4,5)) << 4) +
. [5 d# G, _; O9 D! @, q2 R (deHex(tmp.substring(5,6))))
4 U5 c8 r% \0 e0 j* r}8 A: {3 P8 _( N0 f* Z- c
///////////////////Shimmering Links/////////////////////
% o( h. a3 ]6 c6 ~: }- G//global variables
) I9 s: d& ^ U6 A" w, pvar hoverColour' V) d! \; H8 r9 |
var numLinks;
: A, e- C# [7 r) yvar rate;4 N# Q2 |" R$ C x+ X) a
var numFadeLevels;" Z8 Q0 u' S6 H/ Z. k% @
var bgR;
& I: A; S# T/ Pvar bgG;
+ h, E3 b: \ V& Q2 \6 a) \' W3 jvar bgB;
7 }1 Y+ ^( ~6 Tvar currR;
) S, {% S8 k' K" K& h7 g+ Pvar currG;
# Z1 b7 ^9 w! P: B& Svar currB;$ u0 J1 y M5 v; I. g" H1 P2 u
var count;5 n5 c$ A* K3 A# t7 P: J& I! C' V1 [
var fadeOut;
, {. {0 z4 [1 z4 c1 l$ {var continuous;7 R4 _$ I) M) \3 G' g
var newColour;
& h6 }' `, q) i% X8 z- K8 `var tID;) W1 k2 L5 t1 U* N' u, n+ g
var redInterval;7 g1 j; A" \$ i- D' k" [
var greenInterval;
& z K5 L6 x8 w kvar blueInterval;4 B4 S7 M& {3 ?, A
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
d; J( h% q3 R8 @; H' z+ h. |{
- W! t" R" a2 x' Z$ K( D$ @5 ? hoverColour = mouseOverColour;9 V. h/ Q: r8 n4 c( N3 o# K" r
numLinks = numberOfLinks;- s2 l {0 k: s' T1 e& n. f, @ ~
rate = 1;) p2 a9 k9 j+ H; n4 h
numFadeLevels = 30;
& S2 L' v( N0 V# P7 \ function initArray(theArray, length, val)1 \$ d a( x: D& p! W% Q5 k# `' k
{
+ \0 `# Y2 l) z: q8 Y+ _5 M for(i=0;i<length;i++)
# d5 p. ?& E0 X/ ? {* c! Z% N6 s; w: c" ~
theArray = val;1 \- Y! [7 ~; ]
}" y5 C: S& i% C- l
}' D9 g S; p" c4 h
bgR = '0000' + fadeOutColour.substring(1,3)3 s7 _) J. _4 i& W
bgG = '0000' + fadeOutColour.substring(3,5)) ]4 L) f, S1 \; @4 L, J! `, l- f
bgB = '0000' + fadeOutColour.substring(5,7)
* ~( \* ?( P$ I6 c) { currR = new Array(numLinks);! d, \! l% \/ ~
currG = new Array(numLinks);4 s; w/ T5 a! I6 f2 X
currB = new Array(numLinks);' B+ n* ~: q, _2 N- P* [% R5 K/ S
count = new Array(numLinks);) C, J4 ?7 g3 }5 h# f! E r) Y0 K5 T
fadeOut = new Array(numLinks);7 B+ h" s! g% h/ f2 I$ e
continuous = new Array(numLinks);
: \; s! M9 u3 \0 q: p0 B7 c6 t+ l newColour = new Array(numLinks);
. a& C& p+ C, G! Z# ~3 I0 k* Q+ M tID = new Array(numLinks);
' c1 D1 ~* Y$ f* N, ]! y2 F redInterval = toDecimal(bgR) / numFadeLevels;
/ Y- n$ s( m+ |2 q greenInterval = toDecimal(bgG) / numFadeLevels;
! H* J) R" F/ `: o) f+ c- _, b- T% j blueInterval = toDecimal(bgB) / numFadeLevels;# t9 [8 r$ l2 C
initArray(currR,numLinks,0);
9 N9 J: P/ h( F% u initArray(currG,numLinks,0);0 m9 n1 O5 Y2 z& }$ N, ]7 e4 V* G
initArray(currB,numLinks,0);
9 j( ~* D$ G& n% Z8 f initArray(count,numLinks,0);
8 {3 k# f g, ?) k initArray(fadeOut,numLinks,true);
2 J c2 p/ r9 @( V9 Y initArray(continuous,numLinks,true);! W) J$ R/ _/ I7 P: Q! I" e
}
( w* Z$ |6 P2 s. |+ Y' g! Wfunction startFade(id)- H2 e7 p1 c I% v
{* K! Q/ w: j# s( M
if(fadeOut[id] == true)4 I6 g# f# B. N7 L1 G' X$ J+ o: }
{ /*move colour towards background colour (increment)*/
( h1 K1 b, i; J$ d currR[id] += redInterval;
4 F$ ]' H& G8 F) {9 O currG[id] += greenInterval;
# Z v. S U& A1 ?- o' s currB[id] += blueInterval;
: A" q" _) ^" t0 a- e1 { newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
) P3 Y0 W% f0 [ if(++count[id] == numFadeLevels)- L8 P* L, d- T2 p" u3 ]
{) I r" H. o5 r5 E" W) `9 L
fadeOut[id] = false;
6 q2 q4 k. n' B, n }
+ K+ Y. h' ~1 H7 _$ O) ` }1 D# g6 F( E" ?. ?
else3 V. U7 L: O7 B! K- o5 h5 f0 x
{/ B5 s* H6 q5 ~. z8 V h
currR[id] -= redInterval;: y6 v" }3 E* `& q
0 c3 o( ~4 @9 g0 U/ I5 y* P currG[id] -= greenInterval;( Z+ t* x p9 Q& e& G
* C# p$ k; T0 ^% u I
currB[id] -= blueInterval; o+ S) r* e% }: E; N: H3 e( S
0 @2 h/ U @; F& l4 Z' f' i
newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);6 ?9 T) q( i m; J" G
- W, g: J; s" Q2 H/ _
if(--count[id] == 0). U0 s1 m* y- f) w6 u" b
6 V" T3 b- c4 d
{0 k, M: o4 P$ s. u) k
) f$ u# o3 B7 R/ `. c9 b
fadeOut[id] = true;0 E( [' l+ {- m
6 \, S& K& i' y/ E& ]
}( \$ ^# I" _1 X
% _. ?; h# f! ~% A
}% H& W0 D* H) {, f1 V
9 P6 K) r* L! j
if(continuous[id] == true)
4 _3 {7 H) p$ \ f4 M4 T! c; ?5 [4 S$ i# K
{6 P9 H8 P7 @" d3 L8 ^- |% {. Y
$ N- z# S1 v8 L# g& w document.getElementById(id).style.color = newColour[id]; 0 @& o, ]& K; ?! h/ n( m
' g4 M' r( S8 `- w" @% U3 I$ c }
! _; W* `! ?+ h# Q% W" }$ z% n, Y) ^* P" h
else/ A5 F3 j4 a" h0 t
; B& J& z+ _1 }- x2 G* \4 ^( ^
{
. a H# ~! n+ ^2 b8 ` P! a
; R7 O9 s# V: j" M' k" n document.getElementById(id).style.color = hoverColour;+ w7 D# h( \7 @/ R( b
2 n& p/ `+ m- R- W/ U0 o3 @
}! H% a! j1 G5 F9 X) v
: `" J, K. @% v; t8 w! p, Q. v8 ^
clearTimeout(tID[id]);
' H) ] x' C" r9 T, X$ G8 A
1 f% h7 j1 R+ W' d2 ~$ P& c. v tID[id]=setTimeout('startFade(' + id + ')', rate);2 `* `, i$ b2 c
5 T7 E6 T1 v$ D" @# Z6 F}$ S% X, p& f" U8 T+ |7 F
5 z* N' A& e' ^function continueFade(id): v& _. t; h1 b5 T# \
& |5 Q: \' g. i+ L{
1 I* V! Z/ _: K4 V; e
* Z3 x2 C. }1 D! V. Q continuous[id] = true;* E1 ]6 L8 u6 ?8 m' V0 ?
$ P6 W2 z0 a& ]' b! Z9 ~+ N}
4 E8 w& o$ P# g# J# o& B4 b4 R I: t' r) g
function stopFade(id)
1 f- @1 f- J( V7 `% d
+ e2 V3 A1 S- P8 f+ e5 U9 W) E/ X{8 T' P' J: w Q: Y
6 T4 ~% ^! N& Z5 K
continuous[id] = false;
- ]( M2 e% j: Y; h6 f- G! x5 U$ Y7 E9 t- d! M
}
/ \' W8 u0 e* u' T8 s+ l5 U7 h7 a
/ l" K1 Q' M0 g! q) u' q8 v2 hfunction StartTimers()
9 L b- Z; ^$ F9 T) |/ X7 u% r% F
6 c5 x6 k$ j _* n% S{ //set up an initial set of timers to start the shimmering effect
; |- o. o% l/ `7 Q0 [: \: v1 A0 V. `) n- a
for(id=0; id<numLinks; id++)
& e; o1 V2 X, t- e& _; }; C( V& \9 v. _/ e B. D) u
{
7 a: [" j. b+ U0 H. Q% J$ n5 u& e% N) z" b2 ~2 k/ ~0 J
t=setTimeout('startFade(' + id + ')', id*100);: Q* T2 N p0 }+ g$ W6 p8 ~
( K$ Q' d8 {$ }5 P8 ? }' H0 M( F7 @. C' P* h8 U T
1 t: p" R3 Z9 H/ N. r3 F}- k/ N+ Y9 v( c# ~) n
! F7 t5 ~' I0 J5 C2 z) P2 H* s
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
& r9 [. _7 V3 A/ z5 Z7 Z2 G0 o
- P$ d' X. ^( ainitLinks('#FF0000', 6, '#FFCC77');1 K* [; S1 b N
/ R v. Y& Y Z( ]& V+ T+ O
//-->' ^4 k' f8 {6 r* ?% b
8 t% o o2 E2 r. p+ W3 J
</script>
+ e6 X) o9 }3 J; r8 V) f<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名:58元
7 z0 l) l) z2 ~7 k; n8 D0 R# ]</a>
" G6 I+ i/ W- `& b9 k$ k5 J<br>
1 b$ z3 I1 S" v2 L& s<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名:110元</a>1 Q1 I# k2 i+ o3 R/ B A
<br>4 T, b: \: d- o4 u/ o G+ ~
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>9 q1 y W8 F( W' f5 U( d7 O- l
<br> 0 G6 a0 r5 \; V( P+ [) p
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>+ V) ~* Y' S" j+ W) Y# B
<br>
7 Z1 I4 c# d- X( q: ~9 D, t3 T<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
$ z; M9 c' l' ~, N h# d# o<br>
: _. ?% c; f7 h$ _1 n<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>* e5 T2 v) S: f
<script language="javascript" type="text/javascript">
; {( i* p- X" q0 [" p<!--$ w8 T) A- [ Y
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
3 n" R1 | ?# Q0 D3 O5 t* t1 r//-->
+ r/ p# ] }& D3 z' j( h</script> |
|