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

|
网页之文字的循环闪动特效
<script language="javascript" type="text/javascript">6 m5 Q" x' n" {. T+ E" L8 C
<!--2 a; L) Y* w6 }2 L; W) L
// convert a single digit (0 - 16) into hex7 R1 g% e3 g0 i0 v/ {8 K
function enHex(aDigit)4 I1 ^# i, S% \0 b v
{ F+ e1 ?# k Y9 s/ Y K6 y
return("0123456789ABCDEF".substring(aDigit, aDigit+1))
; {4 u. [* l% |' _}7 R' T# S8 G _
// convert a hex digit into decimal
; f2 w# b/ v8 J; Cfunction deHex(aDigit)5 G1 u$ \- b: x
{
& C3 k4 D; n* ^, V! {& v return("0123456789ABCDEF".indexOf(aDigit))
7 W8 s3 ~7 @* @% z a$ _6 |}
0 J4 J! U6 `+ y# J. j5 @( q7 Q2 A- ]
// Convert a 24bit number to hex, }3 K2 i) V4 c7 b/ d; T# R6 i
function toHex(n)9 |$ U. S. A4 Z5 M* g$ G7 |4 ?
{
& l) M: H# b9 J6 I n, ]6 M return (enHex((0xf00000 & n) >> 20) +
o m0 Z9 Y2 O: z+ T0 k( x& } enHex((0x0f0000 & n) >> 16) +, N- q1 o5 b0 D# y$ A5 s
enHex((0x00f000 & n) >> 12) +- \* H" g/ @, Y3 z0 d
enHex((0x000f00 & n) >> 8) +
7 X; y& D, d8 _, j5 @6 S4 {4 n enHex((0x0000f0 & n) >> 4) +
. r" e H% W2 { enHex((0x00000f & n) >> 0))# t, V8 i3 ]' x o2 k' j9 y: k
}9 ^3 z4 D/ u$ a0 ~
// Convert a six character hex to decimal
* X) ]8 k4 ?# ]3 O' T% mfunction toDecimal(hexNum)* ]. c( L# J0 C( \
{
, ~0 H. ^( ]1 V1 b3 b, |! ~- @ var tmp = ""+hexNum.toUpperCase()
4 A c: N8 \* P2 Q# U+ ~8 T while (tmp.length < 6) tmp = "0"+tmp" }: ?) I1 |, ^: n
return ((deHex(tmp.substring(0,1)) << 20) +
" d4 w% E/ o4 T, b8 P+ J( N (deHex(tmp.substring(1,2)) << 16) + ( V( R( T( U, R
(deHex(tmp.substring(2,3)) << 12) +
1 p N4 L( u) [& P- R* K5 t (deHex(tmp.substring(3,4)) << 8) +1 R$ d( \, K& y5 @6 b& D/ M
(deHex(tmp.substring(4,5)) << 4) +9 _9 e) K+ B9 }# d# _+ G
(deHex(tmp.substring(5,6))))6 d% w( S' L1 ^3 S6 i7 c5 x
}
: j) {4 p7 T7 O///////////////////Shimmering Links/////////////////////4 H8 d5 i+ A5 F7 M% L0 U% ^
//global variables
1 ~ v# K6 a4 I2 i* f. Yvar hoverColour- O' b, J3 a: r9 L* a; {3 D
var numLinks;
- M: p. m I# S5 S' D, B: T* gvar rate;
% H0 [& S! X' |6 q4 U" g# H8 Dvar numFadeLevels;
7 _. X% t$ M% |7 s8 S# u+ Qvar bgR;8 B: G1 u2 H4 ]5 v
var bgG;( n# b7 b3 G* N. S2 c
var bgB;
! N0 h+ i' v! x6 C2 evar currR;
- `' l @1 w" O( E# g) Avar currG;0 T/ c* {; m7 o2 N" f4 V
var currB;
# T" e$ F8 O$ i. H0 ?* wvar count;
5 r7 F: _3 a8 |1 ~# Q$ |7 V# dvar fadeOut;+ L: ^+ A$ b0 @) ?
var continuous;( d( v( g. Q8 m" u; w k
var newColour;5 F& Q, t! w" c: y' q9 t
var tID;
8 j( o8 ]: ]$ u7 z; tvar redInterval;
' E. ^. X$ l) e1 Rvar greenInterval;$ {* _; d1 T h& o; A# K. B9 B) f
var blueInterval;
4 S, ?! U1 B4 c+ ufunction initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
1 j$ [6 w4 }/ {, \ G{
, W6 x* f9 U$ [ hoverColour = mouseOverColour;- a" j3 \8 s4 ]( `+ B
numLinks = numberOfLinks;
3 Z% ^; V) o. F9 U rate = 1;, x6 X& ?% {# f
numFadeLevels = 30;
1 J2 d! f8 N4 i; _1 v" M function initArray(theArray, length, val)) j! ]2 d& [$ d# u6 F7 p0 B5 c& w
{$ D8 N8 a* A& O/ ~
for(i=0;i<length;i++)
8 H: f* ?' A1 u' t! G {4 q8 k: C% R. L8 x
theArray = val;
! s' p- l2 E* D3 e# S. v }! g3 \) B8 ~5 w' G e. G" y+ v
}
/ ?; h6 s6 ^+ M1 ^; i5 j bgR = '0000' + fadeOutColour.substring(1,3)
+ T0 K) L- _) M' T bgG = '0000' + fadeOutColour.substring(3,5)
8 ^7 B0 U/ }! y8 ]0 e, y* ^+ V; F bgB = '0000' + fadeOutColour.substring(5,7)' G2 Z3 M& z! Q7 w, x
currR = new Array(numLinks);# u, X6 B# R* N* R$ [% s, {) b
currG = new Array(numLinks);
" P. E) a( e y4 s currB = new Array(numLinks);
I" F, j" ]& R0 O count = new Array(numLinks);
& B; R$ E! a/ z8 b7 h0 { fadeOut = new Array(numLinks); T1 S% ^& e5 S+ t( I# ^: A& M1 R
continuous = new Array(numLinks);
R6 J* [+ l3 I- x! C newColour = new Array(numLinks);4 f3 D( i, f; S& N7 D3 m
tID = new Array(numLinks);
3 D7 K2 ]# Y3 K2 d% U redInterval = toDecimal(bgR) / numFadeLevels;
* A% C! T& ^* ]! J" | greenInterval = toDecimal(bgG) / numFadeLevels;
) |3 V2 A$ B$ J+ L3 C blueInterval = toDecimal(bgB) / numFadeLevels;
/ _/ j: J6 l2 A; F" m! [# U3 K& V initArray(currR,numLinks,0);3 ~( k9 `$ u, w6 D' S' O
initArray(currG,numLinks,0);
! X6 }/ {0 p9 v/ L initArray(currB,numLinks,0);
, T- _; h4 Q8 O( H' p4 B* ~( O initArray(count,numLinks,0);. j4 C" M/ I+ v) b
initArray(fadeOut,numLinks,true);
/ O4 y( p r* N: N1 [4 k) `7 J initArray(continuous,numLinks,true);! A# J/ D# g5 e; i/ s5 e- B
} / p# H) p/ R0 x+ k" Q: O e
function startFade(id)
- r" S/ A; w6 ?7 O4 |% z" [, C{6 b& M) V9 r( _. g/ ^
if(fadeOut[id] == true)
4 G1 p/ `4 P" p+ B3 X3 w& m, _* r* E { /*move colour towards background colour (increment)*/! X* N# F) L/ j( ^5 o+ {9 w J3 E+ m
currR[id] += redInterval;; e9 ?& P8 Y8 W) F z- I* y
currG[id] += greenInterval;' {; r" W4 G& w3 J
currB[id] += blueInterval;
5 H0 s- ~2 g& S) U% p h5 r newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);/ |5 `7 V- X9 e2 D
if(++count[id] == numFadeLevels)0 b4 Q/ r* ?7 r& f4 S$ P
{
( ~) h- N7 p2 M$ m2 k. O fadeOut[id] = false;( U B- J2 L" C, [; P/ u/ m5 v& _0 f+ v
}) }8 x6 _3 X+ @* [
}
) V, u; _/ U! j( {* H: [# Y else: Q7 y* w( X0 c; ^, p6 q
{0 j- B3 K [0 q
currR[id] -= redInterval;' |1 V7 B' E2 H+ B C$ R( f! Z
$ ?# l; e" W: F* N
currG[id] -= greenInterval;
! J( f: }2 ]4 e- `8 u% m
8 F- w+ Y6 g- n. l" Z currB[id] -= blueInterval;# |; M' c$ O: C( C# s# f/ i
/ T% e. {' h$ t7 O newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
' c; H# w" M4 f# ]& _. Y' m" L6 X/ j Y: ?' \" G0 K
if(--count[id] == 0)
8 n# L$ j# F* e. f! t J6 l) b' W- i
/ Y1 K, n7 l8 i8 D9 e' Z$ u {/ f& ~7 V% V( t) O! N T
$ P# j' R/ A& `( o) T* x' |
fadeOut[id] = true;
% O' b, X2 Q- {. w% ^, b* |5 h+ Y! ?$ c2 k$ c) b
}+ M$ R8 e! J; k h$ I: |/ w$ C
7 p( x! a/ M6 I& J
}5 @- j& H% C$ {/ `5 u) K& @, m
+ [ M) U0 v3 J: D0 X
if(continuous[id] == true)
$ m8 m- }3 O v) x
8 p5 l- O, B0 m4 ?$ L9 B {( O5 ]; O' M* r! }. u% U( p1 L
* O y; p! O1 W; E document.getElementById(id).style.color = newColour[id];
' o2 d3 c* C; r4 Z3 X- S$ ^9 b, t$ _2 p
}
7 u9 V& j2 i' J/ h( @# j2 ]& v! [
7 C" Y6 s. l# b6 M else3 u0 J2 Y2 P) A, K# ?0 i) u
! C* D) [( ?5 T$ G' n {2 F G" \. Z: u
. _1 U/ h6 y! P# M
document.getElementById(id).style.color = hoverColour;
: T0 }, l& H3 ?( t+ A/ ?, r, m9 n% ]% S7 U8 H- g7 C# ^
}! {* r* n2 l: T2 W W. G4 s
3 k1 Z8 N3 c) z1 \* t+ `
clearTimeout(tID[id]); k; o8 o! L5 i" ?% p4 f A
, V" R' M* E, M0 h! ^+ J1 V6 _* h( V& { tID[id]=setTimeout('startFade(' + id + ')', rate);
- x# L( O/ m% q z8 L% H8 p! ]- `
( L, ~- C1 H" p9 J, P1 C( s' H& M! d}
* ` x' ]& \6 t( A
7 c7 y8 F- ~7 E) _- ~+ Qfunction continueFade(id)$ g) f, o9 {: b* V# i/ ?8 U8 I
. l1 n; {- e7 B; G3 s" A+ d
{
, M8 K# B# f- R \0 W, F
6 ]+ E' ?1 Y$ s continuous[id] = true;8 x4 v9 G6 |; ^
' ~/ b x: }8 X; }9 T: T
}! m2 V1 b1 p, L- r/ w; F
: |% x5 `. B5 ]; |, bfunction stopFade(id)
; ^9 p# [) |$ Y R" \0 R6 I; P% s) R7 X( z5 `3 o2 v o
{
! n( M$ r1 W) g) ?# P: M9 p7 U, Q6 T, D1 ]
continuous[id] = false; D" A& A$ e! q2 t
1 v1 V j9 E& N( a; X3 U8 [; N1 Q}
% t( {4 u& d2 s
! ` V+ q- l% ]& k X; U- Hfunction StartTimers()& B9 }2 R5 T M, U7 n
% P3 Z4 s6 X" J% N+ d
{ //set up an initial set of timers to start the shimmering effect
2 b* W" r0 G% j8 h3 }7 c
% v# d% q# k! e! a" Y8 [" Y- f7 u# Z for(id=0; id<numLinks; id++)" D" y) l/ X; n$ i. e+ t
( v* [6 L9 D( A& @) G {
5 B8 l- j) h8 `; f" c1 W; w! `& ^
t=setTimeout('startFade(' + id + ')', id*100);
7 ], @4 `+ k3 N6 k: H+ K* G
$ ^0 C( s, _5 S6 c2 K }' u, \: o- v$ q! o: ~& T/ s- i
r/ [3 Y0 K6 B4 q+ j4 V6 Z
}
! P6 |$ J: A+ m8 W. K8 ^( `% t+ r7 d! i/ @$ j- y
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
! I, d5 i0 f( t6 E8 u
$ Y. P9 a/ y. ?: V: N# a: EinitLinks('#FF0000', 6, '#FFCC77');* I) `3 W. _: J, S
: Z0 t! K# {& b z' W2 n; H//-->/ [& n6 \" u" ~7 a
6 y% H$ S, T' P0 R) s7 Y: ?</script>' B1 f+ ]: o/ l
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名:58元3 O. V/ `% T( X, d& O
</a>
, K0 T- N& q |4 @<br>. M- r5 }5 \/ ?: a0 c! ^
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名:110元</a>
' r* t* O6 d- J% z<br>
# Y. s0 ?- h) L. l" B7 X9 k: e<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
: J% ]9 ]( b' L4 h+ V" U, V<br> 4 K( ?' d: `* F, a' l. D
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
1 P# B. Q1 E3 p- u8 Y5 L<br>; a( \- D: {# i4 p
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
( N1 ~/ X' s# ]) j5 |0 d1 f<br>
9 a) p! ?9 n1 G% S( M<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>; {: d6 x" ~- n7 q" K* Z, ]
<script language="javascript" type="text/javascript">2 {, g0 \7 T: T' q
<!--
4 L2 W# L. L8 I8 k7 HsetTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
9 c5 X- ^ N" L//-->
# f0 _6 _% a# w- R& U* g</script> |
|