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

|
网页之文字的循环闪动特效
<script language="javascript" type="text/javascript">) }1 z% a! F2 {& |' P5 O. L
<!-- I5 ?* }. J8 h
// convert a single digit (0 - 16) into hex6 K+ t1 v' z+ S$ R* \* U8 D M
function enHex(aDigit)
! l/ X! {; b6 q7 f0 y! e: C' K {{' `; X; F* W. {
return("0123456789ABCDEF".substring(aDigit, aDigit+1))9 Z' ?* D8 O8 T/ ~3 J7 z4 Q
}$ K$ n& f' R# p% s
// convert a hex digit into decimal. x! H! A! m, `! Y' a Q# D1 U7 D: r
function deHex(aDigit)
4 f' {1 c. d# ~5 I{' {* t, A' k1 X( D
return("0123456789ABCDEF".indexOf(aDigit))
( ]7 }- B2 z5 ?* `4 e}
& e6 s: U, y' o# g5 Q" m+ N+ A: o' G" |" U; W
// Convert a 24bit number to hex/ G4 p- c6 B; x4 ]' [" a. m
function toHex(n)8 [+ `: ^7 q J: S6 m
{( s6 G6 M+ Q g) o- `) E/ N. i0 ^
return (enHex((0xf00000 & n) >> 20) +& G8 v t" |% {* R9 c" j. V/ l
enHex((0x0f0000 & n) >> 16) +
' s$ N+ `& K' J' e4 I enHex((0x00f000 & n) >> 12) +3 Y% i5 N9 ?9 @2 P
enHex((0x000f00 & n) >> 8) +" Q: k9 [9 B5 @1 E1 M0 K
enHex((0x0000f0 & n) >> 4) +
, p2 n) ?1 z Y4 K$ w enHex((0x00000f & n) >> 0))
1 W6 }* L8 e8 `) H- h% _}* [! f' A' l3 q
// Convert a six character hex to decimal
4 s4 }1 H' i4 [$ ffunction toDecimal(hexNum)1 j8 P( {* B, `7 @+ C0 B) o( g4 Q
{
+ y1 l; p) \* _1 G var tmp = ""+hexNum.toUpperCase()
) f- t% p* Y2 o0 O while (tmp.length < 6) tmp = "0"+tmp
" E7 O# i; G5 u+ ]/ J0 F return ((deHex(tmp.substring(0,1)) << 20) +; u. a9 J6 ?$ p% t+ s! F
(deHex(tmp.substring(1,2)) << 16) +
, c, j1 [; T5 G: ?4 d# m& J2 h (deHex(tmp.substring(2,3)) << 12) +3 Y- V5 M# l6 ?
(deHex(tmp.substring(3,4)) << 8) +- G! I9 ~/ U+ ~) R
(deHex(tmp.substring(4,5)) << 4) +
" \+ t4 K& m- G (deHex(tmp.substring(5,6))))
2 e$ ]5 l) u; v8 u2 {}
3 {. m" M5 e" f/ s) w///////////////////Shimmering Links/////////////////////8 U3 a' x* l+ `# R5 l1 ^% m; u" w
//global variables9 T8 t7 W8 P0 ^( \
var hoverColour
9 T \' [+ B4 d2 T8 r4 X1 s' E( `var numLinks;9 u8 s+ S8 {' U2 @& _
var rate;
5 M5 T% L! S7 D- n" F8 p+ fvar numFadeLevels;9 {. L! Y) [) i/ s6 A; {' Q
var bgR;# q( R Y5 _" O' P; v1 i
var bgG;
4 r! T7 r X* U6 J6 x! v) X, q+ rvar bgB;7 a5 \+ M9 Z% [" Z
var currR;& K0 w$ S, F% w6 @! X! v2 y' t. W
var currG;0 [3 c0 Z; \7 O X0 E: D/ k2 h
var currB;1 o9 n: u w: w3 O9 u
var count;
- ^$ \8 K: }- j/ U* t2 B8 zvar fadeOut;
7 a8 n2 W) U' x- tvar continuous;
- m) ]7 G$ X5 r# ~var newColour;' P1 w7 } G7 A; @; g. D
var tID;; w. d! S3 A; D* L Y
var redInterval;
$ Z3 m4 V- G& d( r3 zvar greenInterval;# o3 q! \9 y, e I1 j
var blueInterval;$ x1 l2 v( O4 o, [% l) }
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)( D' q* H( {! J! Z% X) r/ M* o
{. V3 e" f, Y- F0 T
hoverColour = mouseOverColour;
' ~! b+ Q6 t) d numLinks = numberOfLinks; j+ y+ K- ^9 H2 j; `2 P
rate = 1;
[0 |4 v" v0 ?" X* V# K numFadeLevels = 30;" A( q& a; e" A* k0 X/ v
function initArray(theArray, length, val)
! C3 g* M( e9 x/ g {' h. ?4 b2 n O# l, ]4 f* a7 t
for(i=0;i<length;i++)
) C& O: g I6 I; h {( p. l: U' k7 B. m- K7 s; `
theArray = val;% R3 [8 w- G8 r2 ]9 \
}
5 E( ~4 r0 g6 L8 |) g }, t& A% H4 X" u
bgR = '0000' + fadeOutColour.substring(1,3)6 {5 h+ }' [( C: A3 A& }% B
bgG = '0000' + fadeOutColour.substring(3,5)6 g" H$ t- L- p# p
bgB = '0000' + fadeOutColour.substring(5,7)
( t1 n# p4 x& X8 g5 |; z currR = new Array(numLinks);
" E& _- S. k3 S! l$ w! w8 T currG = new Array(numLinks);2 F r' X E5 ?( I
currB = new Array(numLinks);/ F; S9 C f. ?8 Z0 n; q
count = new Array(numLinks);
/ y( Y3 n1 X; b. Y( w* H& q! M9 u fadeOut = new Array(numLinks);. ?3 a" ^2 W1 y8 J0 X) n
continuous = new Array(numLinks);% `1 f3 J d0 @% `
newColour = new Array(numLinks);% h. z4 w: W2 t1 m5 g1 {
tID = new Array(numLinks);
) H. m n: s! D. t: O redInterval = toDecimal(bgR) / numFadeLevels;
c0 o+ g) N7 r& D# f greenInterval = toDecimal(bgG) / numFadeLevels;
2 |: [% j5 [7 }& C blueInterval = toDecimal(bgB) / numFadeLevels;
8 m) P$ y7 c* A" q0 C/ C; V initArray(currR,numLinks,0);
( a% ]" c% \) n4 e# O, S1 ] initArray(currG,numLinks,0);
( G2 I u5 O* C$ f) E initArray(currB,numLinks,0);* U$ M ~, i: E0 v+ b
initArray(count,numLinks,0);
+ B- g( G6 P0 Q; O( `9 d initArray(fadeOut,numLinks,true);
7 e0 v z. }/ z! L! O1 c initArray(continuous,numLinks,true);
3 n4 l2 u. W- h/ ]8 X0 r}
( U8 f# T0 Q) _, |: S) ufunction startFade(id)
( R0 T/ p0 }) o{. C: X+ u1 O: P7 d% Q. H1 @
if(fadeOut[id] == true)
5 b9 A% B, F' m! \4 r) h# b+ T N { /*move colour towards background colour (increment)*/* N+ h- z f, R9 v# Z
currR[id] += redInterval;
* j- R& `" X; Y/ M' q currG[id] += greenInterval;8 s6 p! F0 [: t3 |. O
currB[id] += blueInterval;
* j) {. X |( w newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
: n* F2 r% t/ U if(++count[id] == numFadeLevels)
) P" x: D; r" ?3 {! b5 T {: j7 n! O* M1 j
fadeOut[id] = false;- [, C8 f% x( m9 `, ^
}
" X0 K* o/ Y* @% Z! n5 F } z( c- {# @ ~& L
else
* m7 h6 Z, e3 D7 i, V x. v {8 U3 @5 Y# j( G
currR[id] -= redInterval;
6 Y; O6 h) o* Z& Q# U
0 O4 D X, N! G$ L) Q currG[id] -= greenInterval;
: J6 B& [* S3 C t6 Y% i& L* y- ~
% @% R7 h$ f% I0 D& O currB[id] -= blueInterval;5 p5 i9 F) G& c3 p3 G$ d
$ ?, m; f% E/ }" q0 Y: x newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
) R- X$ r$ I# [
# C# v# U- A+ ~0 C% x, ` if(--count[id] == 0)
- C; y, R& K3 c/ v5 m3 B/ d& R7 r2 Z6 j0 F' H. K
{7 ^/ @4 C' ~/ G2 o- c. ^
7 o* Z% _& H' O1 \
fadeOut[id] = true;
$ h; P2 h$ w: P) m/ S5 E% c6 K6 \* j9 K$ v! b% H9 t4 z" U4 D% `
}0 d9 l! V4 s6 F9 H
" y) T$ l: G9 L- \& p
}
; G8 B, J* p" {3 |9 g2 k! W4 r% j; ^; ?
if(continuous[id] == true)1 z" {5 L- J7 E, |! V: n( s/ X! H
, U, Z# ]8 Y b4 n6 g! P {4 [% g+ I$ D8 p
# @3 l+ g8 ?* Y% O7 M" F document.getElementById(id).style.color = newColour[id]; , T5 f+ \, f/ `: c/ d: N
1 I$ Z6 b' V7 Z* B! N* t }
* E# M# k/ C: u# ?* Z: w. f
; V% H' g. X( w ^9 m4 D' n( X else- M2 Y# v( ~, ?& s$ B9 z
n. Z0 _9 V% u3 q6 v# h' X
{
* [: { ~( u u! ^. A' {
1 x! L* g2 @; F2 a$ r) ], Z document.getElementById(id).style.color = hoverColour;
' ] A$ I5 F! w% E% u9 A' ]+ @" g8 c' _) ~' K% n
}0 `- [- N: H }4 l$ m; i
" E2 [ ~, d, U9 x9 Q0 A( e) ]3 Y d+ m
clearTimeout(tID[id]);
6 q' O4 v8 F2 {( r
* d3 J% z* q9 @9 z4 e* o/ ` tID[id]=setTimeout('startFade(' + id + ')', rate);; t2 Q( L* ?3 O
, d% @( @ ~6 M% O: ^
}! F$ C/ Y; i( B S! W3 Z0 q/ [
, e7 G9 K5 v- K& ^6 p# Qfunction continueFade(id)
- b9 `% {+ v- b3 }) u8 n c3 t% W5 j% X; } ]( w
{
+ U5 ]& v. I. S5 l1 g2 A
# r5 ^/ @2 Q: U7 {8 E- |; P. Y continuous[id] = true;
& H" m1 o* T! M, |! R( j
! ?3 I( h9 ~7 W2 x}6 a* D0 S* m2 c% p3 {/ [; d
/ W1 \- w1 \& l3 l4 Z5 s. A; ufunction stopFade(id)
& w T1 ~9 }8 y
" j1 z- `2 D) |0 c; j- c/ W{) O- U' H1 Y a m
2 ~5 S% z3 {: R2 K% P
continuous[id] = false;7 f( \0 \( J' [$ e; m' h2 s; [
6 L- j0 @4 |* Q3 I2 M( \/ D
}
4 W0 }4 {- t% }' I
, D4 e0 S8 m' l+ }6 cfunction StartTimers(): @" d* x# O1 H7 E* \
4 s# Q, F+ j) [9 s* k2 G
{ //set up an initial set of timers to start the shimmering effect, U: Y& i. ]' u
2 h6 ?- _3 f! O/ e! l( V for(id=0; id<numLinks; id++) b* S# a5 U4 P U5 `3 b* _
( U0 q5 r$ T T6 Z u* o1 D; U5 V
{
- [8 v' X( y6 B' V8 V5 E6 d4 U; M5 H! h7 x; J9 ]0 g
t=setTimeout('startFade(' + id + ')', id*100);; C2 s0 W2 ]; E
% |6 ?. t3 V0 S" o. c, R+ v }8 g0 h, h. {- P
' Z$ J! h' c3 p- b; B4 f}
8 R6 @0 z7 {# _. }. ?, t4 @0 g* k# B" v) O
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')4 l8 W( w: T. K _. y+ ^2 W' \. [
9 r, y: v. \/ r8 X8 `/ j. D# {1 [initLinks('#FF0000', 6, '#FFCC77');3 _) t7 n, C( r7 T/ v
8 n4 l) t6 |3 w& m$ e
//-->3 t% B3 _6 x6 s+ j
) p6 k9 c* _6 J- b+ a) l</script>
. t c# n% [2 I; S<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名:58元4 c( S& R0 E! {/ V' d
</a>4 z3 n2 N1 |! p3 @% `( h6 i
<br>
- y" E& V3 I4 G0 b2 w% x/ y<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名:110元</a>' u: V- }: W7 y: |. A- B, }( u
<br>
$ y; L+ f$ m6 e5 G! `4 ^<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>& j/ w# w: O7 w1 a* E4 x$ M
<br>
9 y, O6 j5 }8 M1 y<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
. D+ v% \6 _& {/ G<br>! d% y9 {4 Q0 }) e. c3 K" z
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>7 c$ ~) l; Q0 ` z8 n& W
<br>
3 |, f6 K$ C: e0 O- `) G<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>" }3 o' S/ s0 ]1 ^
<script language="javascript" type="text/javascript">
* Q: R' W$ d' ]3 `: i4 u" B0 \" |<!--
( h& l1 N0 H1 ]2 ksetTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
# I& I! S. @; O l- U//-->
) w5 L& ]$ Q* T- w</script> |
|