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

|
网页之文字的循环闪动特效
<script language="javascript" type="text/javascript">
4 a1 D9 F) }- W<!--
4 B( O y1 m- V J0 I// convert a single digit (0 - 16) into hex ?2 s3 M: h+ c& O
function enHex(aDigit)
! [. I: f! e8 N/ A/ J _' Y{
2 S; [; f; ^0 g2 q; C, ? return("0123456789ABCDEF".substring(aDigit, aDigit+1))# U( ?+ z2 T2 w' T& G' g- [
}1 j+ ~# Q" ~+ L; o# E5 {+ c& `
// convert a hex digit into decimal: X& p9 H$ h4 J W; @! p. L; `
function deHex(aDigit)
+ N: e% @- s* h) q- r{
7 F5 {2 _. N, W4 p, g1 q9 S return("0123456789ABCDEF".indexOf(aDigit))
' E( Y6 \! ?1 M8 p! ^: N}9 d* B# p1 ~3 B1 _( i
- F! _5 n, @5 ~8 v" K5 M* H// Convert a 24bit number to hex1 @/ v$ D, G0 e# e8 R2 B
function toHex(n)2 @% B9 H: v0 y+ ~8 F( F0 G8 I
{
. m8 a9 i1 G$ P4 Q. A3 P, z return (enHex((0xf00000 & n) >> 20) +
* @$ K/ n7 l6 K9 n4 @ enHex((0x0f0000 & n) >> 16) +( N- o, a2 W( v1 g
enHex((0x00f000 & n) >> 12) +3 Y# Y$ J/ Y& ^
enHex((0x000f00 & n) >> 8) +1 o3 |. f- p* j# J
enHex((0x0000f0 & n) >> 4) +( K9 n6 v8 m0 {
enHex((0x00000f & n) >> 0))
6 b: W# l) `) n0 l- V& m}5 [* d& i2 `" F1 ?% N9 q
// Convert a six character hex to decimal3 a+ C$ X# t" s; T4 v) ?% H8 }$ {
function toDecimal(hexNum)
+ i- @, r @7 |1 h, B" T{
# [- J1 O& x. d6 F var tmp = ""+hexNum.toUpperCase()
- E( v# O- t) Y5 u- m4 n while (tmp.length < 6) tmp = "0"+tmp. z: q" v* x' j+ ^& E4 U9 h
return ((deHex(tmp.substring(0,1)) << 20) ++ A3 V4 h" u! d( o
(deHex(tmp.substring(1,2)) << 16) +
% ^, u9 s( U% ~3 h/ l5 W (deHex(tmp.substring(2,3)) << 12) +- y3 G0 K9 V) Z" }2 y) `- L
(deHex(tmp.substring(3,4)) << 8) +. H' _ @6 k4 X2 @' \: @0 A, Z
(deHex(tmp.substring(4,5)) << 4) +
. B8 s- H, B$ D4 \8 l0 G (deHex(tmp.substring(5,6))))- q; i# S0 V( z9 f1 J0 A: C
}+ U# Z0 z" t) g, G7 V4 c% Y) C3 z1 t
///////////////////Shimmering Links/////////////////////
; i! ~9 R# V6 r! ]; x% {" r//global variables& D; {( H, o+ w% e0 I* x4 D( v7 A
var hoverColour
( ~* f& i9 E: |8 Vvar numLinks;6 Q% C$ W& h8 q, S: N1 O
var rate;/ j. l9 F' c+ Y1 X8 \/ d
var numFadeLevels;
4 ~9 |" G9 N. Q Vvar bgR;
+ ~& j2 Q/ J* m! F; ]1 M- kvar bgG;
+ T0 Y% V) Q$ y7 }3 |+ n# p tvar bgB;
4 s7 h* { F; }+ n. R, U Zvar currR;
! D) @3 A7 U- zvar currG;' G# \4 f% T& m r* V8 ]( q
var currB;
8 u2 }# T8 [9 G* `) t c+ |& ]3 ?var count;4 m [; Y- M' m4 F
var fadeOut;
! ?0 |) \9 ]- l! L2 r/ N w' r5 P; X: Svar continuous;/ I1 c! Q2 U- i# c* N) M8 {& o
var newColour;
1 H4 E7 e5 G, R3 j$ z' J( o# Hvar tID;
% Y& r1 K) B9 G, B% {3 P `/ ]5 xvar redInterval;
* H) C. t8 x. m! H* H3 H1 Hvar greenInterval;8 h: P1 {4 N) J
var blueInterval;
5 l) M4 ~3 r3 D, w# M6 b1 Pfunction initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
# N1 S1 |( p+ W8 Z1 C{6 ^1 q- I& J* Y
hoverColour = mouseOverColour;
$ ]6 b) }9 h$ j+ u1 n" m4 o( l2 H numLinks = numberOfLinks; L4 A5 C9 ?" u- g2 y" M
rate = 1;
5 [& |" k6 \# h$ C ]9 n numFadeLevels = 30;
; E* u! O) E8 r9 ?1 p function initArray(theArray, length, val)
% J7 v: g& j& }, ^ {+ M5 d3 |/ N: Z
for(i=0;i<length;i++)
( c( j' F( B, \) w' v/ } {
. h& }/ z ~5 t7 H2 h2 }, U+ d theArray = val;
% ?3 ^! l7 P9 x. V t9 | }8 l5 J9 k$ [3 O, j7 X
}1 V- m, L4 S6 ^. `: _
bgR = '0000' + fadeOutColour.substring(1,3)) J& _ S( L w; j; `
bgG = '0000' + fadeOutColour.substring(3,5)/ h3 U, ~" T v
bgB = '0000' + fadeOutColour.substring(5,7)
4 \/ B9 J0 q# w# f5 O, }: W currR = new Array(numLinks);
5 D, ^+ E5 q1 T. _ currG = new Array(numLinks);
. {1 X& ]' x, z4 m. s) L currB = new Array(numLinks);& _, N, g5 b& b; n% L7 a% ]
count = new Array(numLinks);& k" [5 ^! B* S! p7 O) c
fadeOut = new Array(numLinks);6 w6 T* a9 J# Z
continuous = new Array(numLinks);! W m) b" S4 L, F! @
newColour = new Array(numLinks);
& \% @$ a5 |$ C1 q, v! H tID = new Array(numLinks);: ^! x% p/ E2 _& o) ? Y- `
redInterval = toDecimal(bgR) / numFadeLevels;
0 x6 E# c8 z) ~' M8 D& H greenInterval = toDecimal(bgG) / numFadeLevels;
: X- F& V, H7 {7 h! h blueInterval = toDecimal(bgB) / numFadeLevels;
+ }3 D7 ]9 Q% _' v5 k: E( X' N initArray(currR,numLinks,0);% u8 s" g1 e9 a. b" Q; o' ~
initArray(currG,numLinks,0);
. ]" U5 z9 Y& J; X initArray(currB,numLinks,0);# d! o2 y# w1 |" [8 d7 R" P% Z' C
initArray(count,numLinks,0);/ e4 D2 T, f2 I- Q2 a
initArray(fadeOut,numLinks,true);: O2 T: |9 S( Z, p* h0 l( |
initArray(continuous,numLinks,true);
- u) T8 C/ n) H$ k& \7 s}
% h% O( m: s4 n7 |function startFade(id)
4 e9 k& |! X' F{4 A. K$ p' X. o# S# T
if(fadeOut[id] == true)" \$ ~; f7 g/ M) Y5 o' d0 y' d
{ /*move colour towards background colour (increment)*/
2 a4 ^5 }5 L% H0 d/ o8 \ currR[id] += redInterval;
. \7 N9 \) A! @' b* H currG[id] += greenInterval;
* T' z1 O+ P8 x: _4 B3 Q currB[id] += blueInterval;7 M7 [9 X% r' n& {/ O6 ^3 j; A, N
newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
( G. l" b& Z5 b! e- c" e if(++count[id] == numFadeLevels)
1 o4 y+ P9 s, O7 {" e7 R9 y; ~" P/ G e {' [) W0 h5 z1 n/ M& j: T
fadeOut[id] = false;: o9 ]- v6 F* Z
}
! O* `. ]2 t- A. k0 T$ _' e }
5 B5 C% z) g7 I) B else* ]* }* \0 T* d& G6 ~+ K! ]
{ ~8 S& N$ ]5 I, n( z' G
currR[id] -= redInterval;
/ a5 h/ c" f) n# l0 _" W
" j' R& J7 O8 G# x$ \( m0 t currG[id] -= greenInterval;
P7 m8 N5 n1 F- W- t, E/ E' r7 a5 p: J6 o9 u* y
currB[id] -= blueInterval;6 \) }) [5 @# t8 J9 @
) q: I" [* ~7 a' B4 G
newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);; t$ D" \6 p8 v- R* N- B
3 V# Q! |* }0 f& _2 l" y2 u7 J if(--count[id] == 0)/ U; }/ x" y. ^; M/ L$ s
1 H, V3 S# e* l, l% Q {8 |( v/ s( L5 u9 O$ D) T& B+ I
/ i8 N9 Z$ [, @
fadeOut[id] = true;
3 d( V" }4 k- P) y* K, R, M4 L$ g4 C) \
}
6 x9 [4 |, d" u" w3 \! r
0 ?2 J# n5 n! ^/ M" y }' C* u: f) _' ^0 [6 f0 ^3 g
8 z+ O0 W/ Y" U% H6 m
if(continuous[id] == true); |# ]: n8 o; |2 C6 Q
4 X, H: A1 I- s! i- d2 X {
- M$ n# W# U% k
" G+ [. t8 p5 n, X' E document.getElementById(id).style.color = newColour[id]; 6 d$ C. V: x; Z! A: j0 q( i
) s3 V% {2 R% O7 L) \" K }4 O5 J1 \& l( d: m2 ^* j2 x3 p
& o) r8 `0 A' A' q else
# o" B3 u/ \+ S, m" s/ v
; z* x( U2 h0 a; U0 l2 g {" c5 n) Z* g* Z3 l
( \8 f$ P3 Z9 J9 Q _ document.getElementById(id).style.color = hoverColour;6 K: P. n# Q& ~5 n1 [$ P: }) j
( N% R* H9 N! O: h1 l4 z }
# v$ E2 G# S3 ?7 y- n9 y
+ S$ q- v% x* A7 o clearTimeout(tID[id]);
# Y6 U/ V4 Z0 F/ d# K
b) l5 R# G! E3 G tID[id]=setTimeout('startFade(' + id + ')', rate); b' v% Y8 m: @* p
- y# H9 J: S+ D1 _+ q8 v1 y1 `}! h+ n4 s d. c7 n: Z7 A
4 P0 }+ P4 b7 z* P8 D1 L
function continueFade(id)
9 e4 z8 `. O1 `( o& L
- x* r" ~9 Z& M3 \# p3 ]; Z{
/ @. {3 R, _7 }4 d5 x$ C' l- m5 m) a+ R
continuous[id] = true;
1 W3 l' Y% x0 B
: r% C7 H9 g% m- r* C+ ?) l" |# f}
8 [, H# z4 |) e3 u4 _6 ^2 T, L
' ]2 M% m# T* m- ~function stopFade(id)
" G. ]4 {9 b& y6 O& M
* |3 t; B5 t; w3 G{
5 u: b! [0 E; w d% W, `5 d7 R0 H% B
continuous[id] = false;
$ Q# U, L; u0 C' p* o- _- j( }6 t4 Y" c1 b
}
' P& N5 a6 M( L1 m
& f1 W9 P6 j0 ^! K$ ~function StartTimers()
; U3 @4 ^& W! M/ H7 m4 O7 v- t: ^7 |8 b, P9 r2 g5 y! i* U
{ //set up an initial set of timers to start the shimmering effect
% L) B& X- U- I: F" X+ v3 z) c
& f5 ~2 k( C+ D8 j for(id=0; id<numLinks; id++) w) B7 R& X$ R. W: G
. |$ f5 q: o. l4 L
{8 s! m% G) S+ C
+ [6 f& b5 z5 [+ p0 |+ K' r t=setTimeout('startFade(' + id + ')', id*100);& O- z. ]" }9 U0 P3 ?" \ w$ J/ [
6 T: e# M1 ~; d+ u
}! H# J8 s+ w3 q: A
9 I9 @ R: ]' s' T V! k. ~! K}
: Y- L6 S7 E5 _" u0 I; P2 C! `5 F5 u7 O
' I! Q6 }- Z0 D( W8 ]% s1 i//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')- s% @1 y0 m* N2 f6 a/ }
6 ]/ Z3 z- i- ]8 G( z2 uinitLinks('#FF0000', 6, '#FFCC77');
0 A1 @' Q) c, H( c* Z. k& Z5 }3 a! m# p% h) i/ J0 |! C
//-->* V$ \9 [1 r! u# B$ L" C
6 |: U' H+ r2 Z* ~8 P
</script>. b5 \4 X4 A5 {; M! f, K
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名:58元' @: c" c6 B Z6 f7 c& }
</a>
; v& j' E) s) N2 P, {0 `% |# }<br>
P3 w# O& f9 u1 V2 w# S. M. W+ Y<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名:110元</a>
5 h- g* ?0 e5 H+ I. C6 B- `4 G<br>* ?$ a" g7 J7 j6 r
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
% E1 a# e+ }, W4 f. v) F" k8 ~% l<br> v% R& g2 Q* f! u
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
+ i! z/ _2 S5 W# v$ r8 a: ~/ C! {<br>0 p( o: E0 Q' C) S
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
3 f4 N* E( ?8 X7 `/ t- |<br>
; m- w, L% h5 r+ k5 _<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>8 _* S$ i, ]. N0 }% g: w
<script language="javascript" type="text/javascript">
9 n( a, G1 l# n9 d+ W A9 i<!--
: L# Y) |% Y. \* |3 ]4 @/ rsetTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
: }4 {; p: k I9 I: i1 r; S4 S//-->. j; \& S4 k% n7 ~9 [5 @
</script> |
|