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

|
网页之文字的循环闪动特效
<script language="javascript" type="text/javascript">
y/ o4 R7 _- B" I2 i<!--
. |( U" u' G" H2 S$ t8 W// convert a single digit (0 - 16) into hex0 L6 M: n4 [; U/ O7 e
function enHex(aDigit)( R \1 p5 w2 M7 I+ ^
{
6 U: f! a/ c4 I$ G/ U return("0123456789ABCDEF".substring(aDigit, aDigit+1))8 S P" j) e" Z2 [2 `# g* w2 |9 ~
}& |5 q( x" F( A; {4 ]% q& G- e4 ?
// convert a hex digit into decimal0 Z6 l: G( `; c3 k3 E
function deHex(aDigit)
+ l4 J" L" k; y1 ]0 U7 u8 X{6 i! P- Q& a* h6 ^( ^1 Q
return("0123456789ABCDEF".indexOf(aDigit))
) w* I. u1 ?2 p# j8 \}
. A( D. X( r' T7 r/ G9 n u# u3 |( |8 q! M) i
// Convert a 24bit number to hex
4 t w* X4 }1 d4 r0 Cfunction toHex(n)
2 }: h$ } m* r% n! _. G4 [ l6 R{9 s4 g% p9 V: i/ U; }
return (enHex((0xf00000 & n) >> 20) +* M. h+ x2 X1 o( ?7 m4 N; O
enHex((0x0f0000 & n) >> 16) +
* F; A. f2 s" S/ l5 `$ E* C enHex((0x00f000 & n) >> 12) +& X' A' L2 x, a9 S' j [
enHex((0x000f00 & n) >> 8) +# \0 d5 C; f! N$ ]8 o* e) A9 v, n
enHex((0x0000f0 & n) >> 4) +
( B2 K# i+ s0 h1 L/ { enHex((0x00000f & n) >> 0))
0 i2 G s8 t) u d# S}1 j" b" u( P+ m
// Convert a six character hex to decimal5 W8 `! S$ L: t3 X4 w' G, D p
function toDecimal(hexNum)
* }/ K' P: `! l6 M) e4 y0 C; F# Q{
. U4 i% q7 t- |$ H$ w, M var tmp = ""+hexNum.toUpperCase()
# V1 ^; O7 g$ X while (tmp.length < 6) tmp = "0"+tmp. V* J% f- V) {2 s) Q* E& H9 O" z
return ((deHex(tmp.substring(0,1)) << 20) +$ i) v. E6 Y0 {" s, Q2 Q. {
(deHex(tmp.substring(1,2)) << 16) + , j, K9 C! b! x( W% Y2 `% `7 q
(deHex(tmp.substring(2,3)) << 12) +4 [; t% b* z1 ~ F- y/ l; c
(deHex(tmp.substring(3,4)) << 8) +8 Q3 @- Z, n! ]* X Y A
(deHex(tmp.substring(4,5)) << 4) +
" E# z- n H0 L x (deHex(tmp.substring(5,6))))
~. Z3 w% K M! x9 L}
/ c( ]7 w( x E6 |///////////////////Shimmering Links/////////////////////& f) T6 y* R, n
//global variables
" N* W, |- f0 ~3 i2 Rvar hoverColour5 H( \' e2 u/ {. [
var numLinks;
: @5 w6 |& F: S A" Bvar rate;
, ~3 \3 m9 u! p$ ^9 W( W# kvar numFadeLevels;
, L6 x2 B. u4 n" I. Ovar bgR;2 L. h I8 U7 }0 }
var bgG;
- d4 n- z3 A& q+ V5 ?4 V# svar bgB;
^: s9 H% R( C" ?8 f) qvar currR;
9 V' V. D6 |3 M7 W) t& Qvar currG;; M7 D E1 Y5 x. j+ X- n% W
var currB;
5 f/ j* i, ^5 B6 xvar count;
8 Q6 E) e `2 V* \6 zvar fadeOut;
) Y! f3 t, s( o Jvar continuous;) v1 O' p, s- w( F" X8 D
var newColour;/ Q$ }9 n* Z1 b4 f0 ?) w! ?
var tID;1 o4 y( f' W2 s- c1 Q/ h) K, h2 |
var redInterval;
" f* X* d2 Q8 y% @& P. ?. pvar greenInterval;
" Q7 C# m% G5 |( m$ b) U) Ovar blueInterval;8 U& E3 {+ D' D% Z( ]8 M
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour); M' _" H8 e1 e1 y
{1 Y. G9 u6 t/ }1 K6 B+ ~) |# F
hoverColour = mouseOverColour;7 {+ k7 Y& [( H& C( Y; f& T7 P
numLinks = numberOfLinks;
1 m% w* r5 ?# u/ R rate = 1;
. I3 o3 U2 Q3 w1 p; b0 N* b6 e% q numFadeLevels = 30; v7 E3 S/ F- `- A9 k
function initArray(theArray, length, val)
$ `1 g4 f6 e1 P" D3 U$ P, ?. _ {
/ i0 o$ Q7 W) V5 f for(i=0;i<length;i++)0 _ `& T8 H! @4 r
{
3 b$ L4 o# A. D/ r$ R9 m theArray = val;: A( w& |- k/ h5 B& d- @
}
& i9 [- ?1 c) Y* w }) X3 a7 j1 u% D. T
bgR = '0000' + fadeOutColour.substring(1,3)) g! L0 O# C3 j0 \' b- v8 f+ K2 ^" i
bgG = '0000' + fadeOutColour.substring(3,5)2 P( m# G9 k7 y, C
bgB = '0000' + fadeOutColour.substring(5,7)# u- a% P" | Z
currR = new Array(numLinks);& Y; _$ r2 h |
currG = new Array(numLinks);
3 S1 f: V4 H) x$ z- l currB = new Array(numLinks);
6 N+ j% M, ?% g' a count = new Array(numLinks);
1 K- o; K: a" u, u fadeOut = new Array(numLinks);
8 }' ?6 F4 B) H continuous = new Array(numLinks);6 _6 a# C( s$ _, `8 O* ?
newColour = new Array(numLinks);4 [6 `1 S6 @/ u4 P6 }8 k
tID = new Array(numLinks);
, T; n- M |/ W. q, W+ R3 v redInterval = toDecimal(bgR) / numFadeLevels;
0 Y3 c5 K# O6 ^8 L9 D1 t6 s greenInterval = toDecimal(bgG) / numFadeLevels;# u# O; m( k% y4 d
blueInterval = toDecimal(bgB) / numFadeLevels;& l9 l$ B/ E, v2 P( L# b; C( J
initArray(currR,numLinks,0);
4 N' a/ v @- |" g# x4 I initArray(currG,numLinks,0);% E4 W! Z# k8 I. v: r6 _% P1 ]
initArray(currB,numLinks,0);
) Q \4 O7 a; Q0 T initArray(count,numLinks,0); S7 A, ~0 ?" F" Q
initArray(fadeOut,numLinks,true);, P3 n% T% w6 k1 b$ x. i8 x1 W
initArray(continuous,numLinks,true);
' |0 b) ^: D9 z2 [ J9 R& z}
4 q5 P# ~% c, |% wfunction startFade(id)
; l3 T2 O7 ~" J8 Q{2 e$ ]' Z1 ^$ Q/ B8 o' H- G( t7 \* T
if(fadeOut[id] == true)
7 q$ x2 A# s: _ { /*move colour towards background colour (increment)*/
! K& g6 U! A: H) L* W' w% U* R currR[id] += redInterval;
. E4 | H/ ^; e: P( R9 P( w currG[id] += greenInterval;( j9 x8 U) J1 Q; D1 ` U+ l' k
currB[id] += blueInterval;
: Y: S s b2 N* [4 k; d4 S' [- m newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
+ k$ `5 a& M3 j. y$ ?# C7 b1 \ if(++count[id] == numFadeLevels)
. ^+ ~2 ?7 T# M2 E3 i {
- ?7 {2 q9 ?) G4 Z. {4 @ fadeOut[id] = false;7 Y. P( S* n, _+ a- R" G' g
}0 P/ }' W( u1 h$ q$ {
}8 i! F; g+ B$ `" l+ P" c
else: a% I- t5 z- g
{
5 A, C& R$ y% a' W9 w+ e currR[id] -= redInterval;# t0 k: b5 b" D2 v, Q! u
* [3 a! ]2 x" o8 f$ ]
currG[id] -= greenInterval;
7 P' i; j$ L7 C3 B3 U1 c, |/ x" ?2 [4 M. j# C, N
currB[id] -= blueInterval;+ j1 Q) n" u$ O
6 }$ D, T6 O" W( ~
newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);% c: W' b0 G& p2 T4 N
1 _( ?9 o. C" b/ S1 j8 } if(--count[id] == 0)* x" N& [. i7 h5 N% z' w
$ z/ n* `$ b/ w) S3 ^ {
1 X9 Y6 \. K( }3 z: J. k5 |) j; \' d0 H) g0 Q
fadeOut[id] = true;
& G3 D% ~0 @# n D
7 f# [% j3 p4 F8 R* E9 |) k# t }7 _5 z9 q4 L7 D2 p
1 q7 {/ h0 c+ R; Z }; C& ]7 n2 T" Q7 s7 Z1 m
9 v2 X, R$ }, x7 B! Y' M if(continuous[id] == true)' H: T) R B" c# r9 o
. I& z) e! r8 @6 C {
6 ~5 {/ e7 b: i; C" G1 Q( n2 i. b9 {, |# v o
document.getElementById(id).style.color = newColour[id];
" g/ `- Q; U+ l
/ l! u; @4 u2 U' p8 | }
- q4 \* B8 F' M& l" d( H* ~' z" j4 O6 \# `3 y& h
else
( r0 A; k% Q8 C1 k& K$ a4 N( ?2 A
" {0 l& p v, _1 N) A! ~& e {. n& d- H8 W4 l- I8 |
1 A3 \0 F6 a: b/ O- J) C* T* I, o
document.getElementById(id).style.color = hoverColour;4 e% W% n3 T0 P$ Y' j2 B9 ^1 p' T) ~
; r1 |. B& U0 r" A( S
}* g! M. o1 F l6 l- W
1 t$ t( Q1 K( [( k clearTimeout(tID[id]);
9 ~ Y' T6 ?' i; T# n
0 ?8 o; f7 [2 q' f/ | tID[id]=setTimeout('startFade(' + id + ')', rate);
5 ^* z- L: w8 {" ^! B6 L, _- `) x. x+ ~2 @2 _" R
}
* u! N& ~$ Z6 x' w [* ~
) C5 i- Q# p' ]function continueFade(id); |6 m/ m# |9 E
2 z# i7 a' _, z3 w9 M' M{8 D8 h; t- u; t1 Y3 a% @& O2 l6 Q$ j
B4 m" Y% P' b! d# O0 m6 i
continuous[id] = true;0 e! x5 r# z" M5 x$ @
( i( d$ `5 p* D: f' H6 c& s' I: t: m
}. x! a" h" r9 y/ ~; L( Q U
4 q; J. W; B+ G+ U, afunction stopFade(id)& x# A$ i; T, M6 U0 Q
. ]3 C. P) |. x. b) X4 @3 J. D% U- Y- o
{
& x0 s7 [& S( w% A, s, h; f: d5 y/ S5 T ~) s
continuous[id] = false;# d7 z( R6 V# I9 F, m) Z4 q$ W
4 }( b$ E. Z. k( G: E5 m}
& ?0 Z9 J" d |. i) s; C) ]1 }) t9 s; v8 J* R' R0 B/ ]8 X& k# G
function StartTimers()
" D7 ?8 u' H6 }/ Z# B! y& o" Y1 P2 i6 o* C! H, L8 M" [ R
{ //set up an initial set of timers to start the shimmering effect
' j( w$ n; n s/ ~* Z+ Q
: `+ x5 u6 ` f9 A1 u for(id=0; id<numLinks; id++)1 E3 g2 k$ v# o- t% a2 L+ \
1 h0 ]# j, p* O% r) z0 q/ e* P# n
{( ~4 K, p2 [5 ~: A
4 Z3 e" s6 x; z/ R
t=setTimeout('startFade(' + id + ')', id*100);' E0 V" Y9 S! ]1 }3 u3 L% a
& `0 Z9 Q3 q* _/ y9 ]5 w( d
}" F1 e6 p. X$ a6 n4 V
( N1 G! Z0 O4 ?+ ~9 Q2 P
}
( ~; U7 Q' R( b2 s0 a! v
0 O( ~7 x6 H* [0 g" w//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')" R, C# F* d; L% z+ Y/ I" _
" v9 Z7 d" N1 k1 [3 g+ P: H) B
initLinks('#FF0000', 6, '#FFCC77');& s6 H7 Q6 z M. H9 f2 I) i1 s
6 L' @$ K# b' d( q//-->: J* N! W) ~& G; e8 X4 t
e3 G. w, \7 [' d9 I8 G# \+ ^</script>
* ^/ W8 B' S( b* N<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名:58元' O- [: h4 k# C9 [- m8 ?
</a>) |+ Q' J7 X) J J, X4 O5 }$ s! z
<br># l& |: M4 s7 y6 T
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名:110元</a>' P) I4 I" K. [9 q4 G
<br>2 C$ I5 s9 Q# l0 n8 ? Q1 l
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
+ _. F8 c6 P' @) V<br>
2 _/ ^' z) i% F; n/ A<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>3 {, `" }5 C, i! A- s7 p* X
<br>
# x' k" k! W& b/ M8 {5 v) w<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
t7 l- `! d& C/ O: W1 P* x; E5 d<br>
( e& d7 p1 [0 W; }<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>& ?: u. ?2 F2 {( E$ n8 h
<script language="javascript" type="text/javascript">
2 z4 g* |8 v3 K% s" s<!--# w3 R* f4 S, ~! o% }% g8 \% U% l1 H
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
. J* L y; k0 j3 Z//-->
- e) W: N/ |8 Y; @0 k</script> |
|