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

|
网页之文字的循环闪动特效
<script language="javascript" type="text/javascript">
6 G+ t# c9 k' `<!--
, j2 h. Q( T9 m, u, R& h// convert a single digit (0 - 16) into hex. M# F# r# _- `' {7 X( O
function enHex(aDigit)# k- k, e. i) L; ?" E( N
{
; n% j) e: p: L return("0123456789ABCDEF".substring(aDigit, aDigit+1))! N# B& U: [+ p u& E X
}
" E" @3 W- G% V3 n// convert a hex digit into decimal" C1 F) l6 p( [0 k
function deHex(aDigit)
" k- y2 t6 U4 G2 b% C( h6 V{
b2 ?- x, S1 [: A' V/ @, W return("0123456789ABCDEF".indexOf(aDigit)); r) E* e0 `4 Q! k
}
+ R2 z! r- z ?2 M2 v6 f
5 b3 g* m% X% ]. H/ M// Convert a 24bit number to hex/ E7 @9 L0 _: i. s
function toHex(n)
6 T% A9 ]! z8 V- S) Q{
3 P/ K6 n8 ` i7 E% D return (enHex((0xf00000 & n) >> 20) +
( a9 j6 k% ~. q% ?* X1 D, U enHex((0x0f0000 & n) >> 16) +9 ] m7 \7 l& d: }! }
enHex((0x00f000 & n) >> 12) +
$ {6 r- R+ e% O. v0 K* @& ?+ t enHex((0x000f00 & n) >> 8) +
8 P: i8 c1 I W0 x enHex((0x0000f0 & n) >> 4) +
$ _' [; k) ?5 w d' ? enHex((0x00000f & n) >> 0))/ f: a; @( J1 H/ T+ T0 s) z
}9 G9 s& ^/ |& e7 N4 e6 h
// Convert a six character hex to decimal4 J6 {9 F- p- y
function toDecimal(hexNum)' U6 _/ G4 x! R# T0 e6 a
{* i6 U* a4 b( a8 Z5 }
var tmp = ""+hexNum.toUpperCase()4 u4 [4 }' d+ z& V% }) o! }
while (tmp.length < 6) tmp = "0"+tmp& R/ ~# s1 R) b( I. j8 i2 e2 B
return ((deHex(tmp.substring(0,1)) << 20) +8 O6 }/ S: J6 b% g' c" I- _4 \
(deHex(tmp.substring(1,2)) << 16) + / w# ~4 s) [8 |3 q0 e7 M3 Z2 f
(deHex(tmp.substring(2,3)) << 12) +
% y% r4 n m' F( q" B0 W (deHex(tmp.substring(3,4)) << 8) +
2 v( B' _$ E. }, g (deHex(tmp.substring(4,5)) << 4) +2 y: n5 m( S' D( j9 g# P
(deHex(tmp.substring(5,6))))/ k% W$ ?0 }1 d% l( R3 o
}
! T' {+ X4 Q; S5 Y///////////////////Shimmering Links/////////////////////
7 v& V* F$ Q; s//global variables4 S- Y: x+ R3 Z& L7 \; D
var hoverColour3 n- Q" Z/ b, `# ~3 H; ?8 C
var numLinks;
& c6 s! H+ s8 y1 `, ~+ m* b4 mvar rate;
& N" x$ Q% g: h* `6 o' uvar numFadeLevels;% t& d: T2 A1 d+ C; F
var bgR;
/ f! Q! n. i \! X3 s: j2 Kvar bgG;/ w" o4 b/ a+ k. H
var bgB;' } V2 n' L3 B% _
var currR;" X! p. l s( B
var currG;: A) c2 p( A* b W3 l$ S
var currB;7 T( S7 J( w3 Q/ z' B" c1 l
var count;3 i/ f6 f5 I- t, Y" I0 v
var fadeOut;
! M: @, k( }6 n) V8 avar continuous;" j G- S' I. ]
var newColour;
0 X. c6 Y j$ I( d3 z. p* Wvar tID;
. L) s' V. V: w. ~9 G) vvar redInterval;5 g* P% K/ \8 z- _6 f! F# Z7 |
var greenInterval;3 r5 y* [1 i5 v" {: R+ |4 f" j
var blueInterval;4 }5 u1 x, u' v8 D) U( L/ f
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)3 n5 S& r1 M3 [
{6 i' D/ o2 r( T
hoverColour = mouseOverColour;$ H4 k9 D& T) F; o* R, I/ F4 D" p
numLinks = numberOfLinks;. i |3 q: |5 p) p; C8 p: g
rate = 1;" m: N/ g- @ b8 U: b$ C( @
numFadeLevels = 30;
$ s5 Y3 x1 O! ?$ ] function initArray(theArray, length, val)
! C& ?0 J6 K! }5 t' V6 @( q {
5 R. b: l$ ?8 l4 x' z, u for(i=0;i<length;i++)9 P% [% W/ E7 J/ U. {. o
{
: U+ n, L+ z T4 Q% ` theArray = val;
) L3 n& y# n- o }& w; v$ b* Q6 v
}
' |2 g6 e6 i3 j! z- `/ r bgR = '0000' + fadeOutColour.substring(1,3)# V2 t6 A \. `* D7 L
bgG = '0000' + fadeOutColour.substring(3,5); H" x: s1 S, Q8 T# a) z7 D2 `
bgB = '0000' + fadeOutColour.substring(5,7)
{$ H7 a7 b# h8 ?9 v currR = new Array(numLinks);3 b: ^! B8 R1 G9 g$ Q$ R1 R, f
currG = new Array(numLinks);5 N, g2 \2 b9 r6 ?* E
currB = new Array(numLinks);; ~# r, N) a- |
count = new Array(numLinks);
6 N8 ~% M/ x% P fadeOut = new Array(numLinks);
x& S; k) ], H4 k continuous = new Array(numLinks);
6 |) i: @' o7 p4 \2 | newColour = new Array(numLinks);7 m2 t: l/ v( J9 z& Z1 S8 \
tID = new Array(numLinks);
& }1 I5 a. i! d: |: s redInterval = toDecimal(bgR) / numFadeLevels;
! m4 l6 n [. U- Z# W greenInterval = toDecimal(bgG) / numFadeLevels;
3 H9 A! k/ w" z, `3 ^' l* b blueInterval = toDecimal(bgB) / numFadeLevels;' o1 j* Q# c v3 y2 S. v
initArray(currR,numLinks,0);2 j1 s% J, _+ L- E
initArray(currG,numLinks,0);
J& T3 x( o6 @$ x% M initArray(currB,numLinks,0);
& W' ], [: ^7 T7 Z6 E initArray(count,numLinks,0);
e* E7 N5 c/ q6 | initArray(fadeOut,numLinks,true);
3 H D9 N9 R& A V) D initArray(continuous,numLinks,true);
$ l3 V; F8 U C; y" [, `} 1 |5 l( o& G- C, W- J
function startFade(id)* ]3 @! L, y G+ m
{$ x- f) a C6 b0 B" M
if(fadeOut[id] == true)$ E. k: U1 G! D1 x) k# P, v
{ /*move colour towards background colour (increment)*/- N# T8 w/ U; P2 O7 H+ L
currR[id] += redInterval;
5 k: g3 V3 u5 \. n E& j% O5 l currG[id] += greenInterval;
+ ~% _% q3 H* w+ _/ @$ } currB[id] += blueInterval;" L- E9 u, G4 j( _* O1 v
newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
" { N# }" }7 C9 W- ? if(++count[id] == numFadeLevels)5 O8 Q3 e u8 L; _8 l, z5 [# {7 { G
{
7 \ c" w: e7 Y w/ T; W3 X, M/ L fadeOut[id] = false;
# s8 F9 ~9 h( V; K/ S" n# \6 L }
) w" ^- U5 g* w, v" t* y' j }
# G7 b# B0 s/ g) R/ @8 n( @ else
$ j" p9 |. r# c' q* @; x$ P) B {
8 \2 l/ U# h9 g! _0 v" {8 U currR[id] -= redInterval;
$ U; S, [5 M* P
6 t7 J& m% W; }4 Y currG[id] -= greenInterval;7 U, v* \4 G+ t5 B
$ x5 B# h* r. \9 E
currB[id] -= blueInterval;# h0 z; V8 `$ Q4 T9 s! [5 K1 W# H
" m: I. T' {- [ newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);8 q6 U& k7 R$ P& ]5 L$ ~, u. {+ W
/ o4 [+ J1 F1 a2 V3 {
if(--count[id] == 0)
! }: y! h' _, z+ m+ p& w8 M0 C: s1 }* L4 x5 d3 {+ U
{
: I/ }$ l! o! O
8 {: l0 j; o" q3 ~( J$ ` fadeOut[id] = true;
% b& v: m5 C* T8 R Z' Q) ?! ^. [: X* q+ M* e
}$ B9 O: Y; }' q) b
4 @5 E: m2 G( w& Q }& `: q8 h2 l% R* p! z, R
$ `$ n2 O! ?+ E. a/ Q* g) `% x if(continuous[id] == true)& G. D7 z: O. D
7 i4 I; c# F. \- B) b: G$ g {
5 s$ W2 l! C5 c+ e% A( L0 K( e0 w2 l$ H/ C
document.getElementById(id).style.color = newColour[id]; " S7 C0 l" P- E4 t p, K, m4 G" d
5 U9 P. m' [- ]/ ~/ `5 _8 l$ c
}7 O) a1 t( w' ?9 M
8 j6 Y/ ?: J3 y" H/ M6 A else
& [& D+ ~% \4 X0 [7 S8 L
$ y$ o' _1 u( |& [# y7 l0 O {
! }$ }9 C: C, L$ V
) Z' d C n) l! |8 h& K4 N document.getElementById(id).style.color = hoverColour;
5 e0 r5 X5 b0 s
2 x) k7 |( V. `* n& u; L Z* P. N }
. b6 X% u1 z# @( j7 m: _, _; q1 C% [6 j: J- p2 D
clearTimeout(tID[id]);
% @2 {( J1 x K6 B! T# }2 S5 d0 j4 E+ q' t3 \
tID[id]=setTimeout('startFade(' + id + ')', rate);9 r( }" D* h: ^4 {3 _7 g( H+ `
9 p" h% H, G; `! F- m9 s
}& V4 o- ]* F6 d7 q O ~3 i
0 q# M x, u" j) B$ I% O5 l
function continueFade(id)5 ^' d) E" T8 N0 o' N# P; b; k* P
- b3 |9 I j1 u6 x{
. e' H$ [! N( U4 S% F
+ p2 c) @& s3 i `$ Q continuous[id] = true;1 j6 H3 E' P* T& ~3 b- q
8 E1 u1 P2 d& c: P' A}0 [/ S1 r, {# \. p# R7 _3 N
7 d+ k. t; w- b8 @3 ]. X& sfunction stopFade(id)/ [/ U$ E9 p5 k: p
+ E+ t9 U" h8 U/ j{. x# f, t0 b3 W o3 o
0 m" | P [, e$ ?) F/ I continuous[id] = false;0 o4 r+ x; N8 g" c% D: N6 U+ y9 `
# M# a" h/ e: y0 Q0 Y
}
* |, u3 G0 L, A/ p
0 ^% _9 ~. \1 P+ pfunction StartTimers()
$ ~3 `3 L/ y# `- S3 ?& Z+ C: h$ R+ u8 W# ^4 _
{ //set up an initial set of timers to start the shimmering effect
" S. L5 n# r4 C) X2 W! ~) Z. }% J0 f; M
( [- U; i3 r5 X3 [, d for(id=0; id<numLinks; id++)
$ w* b# @1 q0 i$ p- w% m1 b3 h
, u. @" R( `* l4 V& _# N$ t {6 `4 Z' O6 c- [
" X' L# g7 k) l! L4 R
t=setTimeout('startFade(' + id + ')', id*100);8 ]# w6 H3 K* a7 w. A* k8 r G8 g
" P, g! `, o- T. n$ [- K" j
}
6 _" |2 d+ W! g6 }1 U6 Q
0 x5 W4 U; a: H, C+ s. k0 L/ {! S}
2 v+ P; R; } @$ U* U' \( Z
/ o% o7 m1 m# Q* E6 F//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
; F N: p, c- x+ a* L# q0 F7 k7 }0 ~
initLinks('#FF0000', 6, '#FFCC77');" ~5 N4 L3 A8 q8 j) [2 Q% M, y
n3 M9 S& Z3 x9 P: o- M//-->
# z& x' j# e- w8 n [. X; l! ]& Z4 i$ C9 X) u
</script>
/ L7 l4 P2 y A1 x% K I6 d1 p; J<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名:58元. n t$ m( g5 M# {. j0 }" c
</a>
$ m8 G4 I- N3 ]; H. J9 p<br>1 c* y" f9 W2 Q: e$ d" O- H
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名:110元</a>$ y: F: r: I# O9 S) f
<br>
) v% N3 ~2 P% Y% `8 i0 e<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
8 Y" h& F3 G$ \0 g- E ?<br>
) T& l# R! i K o<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a># t* X3 r- n$ c2 h9 O# z
<br>4 r% e# ^/ P8 Y9 _; K2 h% Z' ?* w
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>9 J! j3 d9 r7 N N% M
<br>
# u( _. [5 }) }5 ` a<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>
# f8 }; f. L9 n* N) K* n8 U5 v<script language="javascript" type="text/javascript">+ W) ?) s- ]. O. C
<!--
" |9 j* v( I5 L( X$ ksetTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering" D; y# g+ y6 F) ]
//-->6 z! `$ h7 t+ s8 b# _2 {* P9 M6 E
</script> |
|