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

|
网页之文字的循环闪动特效
<script language="javascript" type="text/javascript">
7 e, |* c2 p9 |1 v) h. R X<!--2 m% _- N1 X+ g4 ]7 V+ B
// convert a single digit (0 - 16) into hex
! }! J# y8 U x# {4 nfunction enHex(aDigit)
" Z) o2 S5 T& o1 w, b, {{
' }0 y9 j, M8 ] return("0123456789ABCDEF".substring(aDigit, aDigit+1))
& h3 r* v( @2 W# S. n% w}2 {& W8 U3 {- E# P
// convert a hex digit into decimal2 H# f& o7 ?+ x7 ]- p. ?
function deHex(aDigit)
! A2 ^2 D( ]9 t9 E- Q{0 ?( @2 O( M& G% {/ b
return("0123456789ABCDEF".indexOf(aDigit))
. `! e9 z9 M# F2 |, f; y}
7 O6 I; `& h) a2 ] {: L4 _; J; P. l0 ?( `& y- S: a+ J0 x
// Convert a 24bit number to hex( c8 S! v K- K3 c, r
function toHex(n)
5 U* ]8 d) _3 k. `* S{* H8 p1 n8 }& p1 t9 `
return (enHex((0xf00000 & n) >> 20) +' K( U6 g& r, s$ N. v/ ?3 l( a
enHex((0x0f0000 & n) >> 16) +* @6 {8 T3 t# V, O9 |2 i6 I& p7 }
enHex((0x00f000 & n) >> 12) +! W+ Q) w/ M: k& m& c& v8 B
enHex((0x000f00 & n) >> 8) +
$ b: r: x2 [ I, I8 m enHex((0x0000f0 & n) >> 4) +
7 n' y2 J. \ v* ^" {/ ]% v6 m enHex((0x00000f & n) >> 0))
3 h, R" y2 E+ A5 S+ y* ]/ _: P}
+ W: Y, Z# [; @* c3 K! R// Convert a six character hex to decimal! Q: h4 ]1 k( I; N2 s8 O5 z
function toDecimal(hexNum); p I# P- ?4 `8 l2 o( s! S
{) r i1 x9 S9 t3 L. D
var tmp = ""+hexNum.toUpperCase()8 o8 S0 z9 y" u8 u. B( V
while (tmp.length < 6) tmp = "0"+tmp
. c! p7 o Y+ f9 i% T v/ }0 A$ H return ((deHex(tmp.substring(0,1)) << 20) +
: u- ]3 G) K! J1 O2 ^" H (deHex(tmp.substring(1,2)) << 16) + * u' u! D) n9 ]3 m9 b |* g1 H9 F* T
(deHex(tmp.substring(2,3)) << 12) +7 i, B+ F% h: h. g
(deHex(tmp.substring(3,4)) << 8) +# t) d# \+ M& V0 [" P/ W; ~9 C
(deHex(tmp.substring(4,5)) << 4) +) ~! k% [% _- {( f
(deHex(tmp.substring(5,6))))5 O4 R B) ]: C3 k7 ^& w
}
2 o: c2 y$ u* \3 N$ V///////////////////Shimmering Links/////////////////////
$ @3 P/ W# Y6 S' M5 X& O//global variables( W; J. A) m! G. d! @* R( o# j
var hoverColour4 P9 v! m9 O# l
var numLinks;$ o# q4 K6 i- C2 U- E
var rate;
: ?" @7 h/ o* p# C5 _3 ?var numFadeLevels;1 Y1 G: k0 q9 m6 q: @* n* N
var bgR;
: ~" w7 n- I( k! E, V* Fvar bgG;- s0 `, }5 t2 l
var bgB;/ j( _) G& ~* d$ [% H
var currR;# {2 X0 N j4 r, n; z
var currG;
9 [, o1 Q7 s- g3 ? e$ tvar currB;
3 ~3 G3 w4 i) m4 Z" h4 N: kvar count;2 s! V' ?( X8 m, h/ d! s% o
var fadeOut;
9 H, n# r M" D% T( Hvar continuous;5 F6 g- D' n0 x7 o9 I
var newColour; P4 S. ~3 h5 S
var tID;
. k3 ?$ Z5 u& q" _var redInterval;6 g! m; ^2 F: f0 T
var greenInterval;3 {! H8 N' Z, E5 S+ e; B9 Z2 T
var blueInterval;
1 {3 ^6 K' f" Rfunction initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
$ c! _! h( J% j) E" g2 k2 k{' J4 c5 z6 o, c' O% V
hoverColour = mouseOverColour;0 H3 n3 q6 X# e t! R2 l! K3 b
numLinks = numberOfLinks;8 z% @9 v; G$ O* x& n* `
rate = 1;
; C0 N8 D7 {" t2 b! j numFadeLevels = 30;
+ t+ w. X( n/ ]! t function initArray(theArray, length, val)2 U$ b: b/ J3 y. I4 n
{; H9 U" E0 h ^# C
for(i=0;i<length;i++)
$ W+ k. B4 Y7 I* q- [3 b: B' i {2 G/ Y% \" W/ P! p8 v, ?9 [ @
theArray = val;
& D' P+ d8 m& {8 Z }
: B( T& D1 ]1 Q. g$ {* A' K5 M/ `+ I }) P& k+ a6 ?+ Y. Z3 z
bgR = '0000' + fadeOutColour.substring(1,3). F1 _6 ~& Y r
bgG = '0000' + fadeOutColour.substring(3,5)
5 z. m8 w; r% ?* A9 {$ e bgB = '0000' + fadeOutColour.substring(5,7)0 V, A' q- h) N/ y F8 `9 h
currR = new Array(numLinks);7 Y2 b, J) L: C) T6 {+ h+ V
currG = new Array(numLinks);
) g* g8 i+ v5 y# E# I( F+ c currB = new Array(numLinks);) e- {8 J# l K3 E% y8 M
count = new Array(numLinks);
7 [4 J( x1 X K" D% l% J. ]4 U fadeOut = new Array(numLinks);) p4 p0 u5 k3 I9 F r
continuous = new Array(numLinks);
( x! b4 V& ]. T8 S A! ] newColour = new Array(numLinks);
: G! N& b( y: ]! q! E( L5 {2 f6 b tID = new Array(numLinks);
& ~6 o/ Q$ W: u8 {) }4 k redInterval = toDecimal(bgR) / numFadeLevels;( U! |) m* b2 p" Z
greenInterval = toDecimal(bgG) / numFadeLevels;# t! M G/ J/ Y2 b6 T4 K- ?3 `
blueInterval = toDecimal(bgB) / numFadeLevels;
4 X' c p- ]7 M' |) t, d; z# G4 S7 I initArray(currR,numLinks,0);: x9 h) l2 o" B5 c
initArray(currG,numLinks,0);2 i; h( n% Q# C# J2 b# w
initArray(currB,numLinks,0);
" H- R! k6 h. O: k+ s# ~ initArray(count,numLinks,0);* J s& C$ ?$ K: _& [
initArray(fadeOut,numLinks,true);2 S! i$ d- u6 H
initArray(continuous,numLinks,true);& e/ G2 E4 ^$ u; m
}
9 ]# @# u: O! Q7 _$ f9 w$ Efunction startFade(id)
6 R5 g! s4 m1 \* A{7 i& w4 R# A* \* M% M, H
if(fadeOut[id] == true)1 v* c; Y( [, F8 _$ [
{ /*move colour towards background colour (increment)*/
, Z( G8 d1 g h. u1 |# t% `, y! p currR[id] += redInterval;
8 P9 [' E0 x; [2 M/ Q5 t currG[id] += greenInterval;: l+ A' W$ T& f% i8 y% Q
currB[id] += blueInterval;
. `. g6 M8 h& v6 Z- m& I newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
, N/ T& s* K& N1 ` if(++count[id] == numFadeLevels)
; k' W4 C1 O8 t( @# R& m: ? {3 M2 d" G% M ?: w+ w1 H% w
fadeOut[id] = false;
% p5 F" ~3 K7 }' P9 o }$ i: Y" u5 [: N0 E* b t
}) L3 {/ W9 [5 E: t- p- T
else
$ c/ ]# g% J# q, x; Z1 a+ X6 i9 h) P, D {' z! J" P5 g' l/ ~1 I2 v2 K& c
currR[id] -= redInterval;$ j) \6 d! g: b. u( }# F1 I. O
# Q; a. `: Y9 x. z( z+ ^
currG[id] -= greenInterval;0 {" A! e% w& V6 \( X
4 M* ~8 z u) U* r! l4 Q+ P, S currB[id] -= blueInterval;6 o% I; c' a8 E* e% {
4 p' A6 p d8 `7 \& H$ [7 F5 ^
newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
V5 G& _+ [3 K2 ]* \. l" n `7 B7 q
if(--count[id] == 0)
@, n' Q( e' }: y- e/ t3 Q6 J: E" S6 [
{
# T" D% s2 c; z4 \( D! O
- ]- t- Z- G4 t: e, T7 U fadeOut[id] = true;
' r! D% U. B0 ^4 [7 |% v
" j$ w: L7 U- @ W }) J h: a7 G0 [6 K, u+ P7 ?
! r& t/ ], ^* G! t8 a3 H
}
& r7 G) Y: K+ ]0 R- [; t; E$ h, @6 l. \: }8 A. i% G
if(continuous[id] == true); }" W- p V9 C4 L$ D
: Y8 d) {9 @. y+ o1 g! I
{
& C; |; U) U1 r3 B& l% G B: l" [# |; K9 K) K
document.getElementById(id).style.color = newColour[id];
7 ~% I6 O. l# k* @
( Y* S* S2 Z* I$ y# ?% O( i }
8 s. h2 \) t8 A$ T
6 ^0 F O' e0 ^/ t else& a3 ~7 P( X3 o+ H' i% a+ O4 u, t
2 s" Z+ a0 u7 [) [ {
8 J# ^% m0 g3 Q _* Q2 e% I( y2 N
& N9 w6 C( A7 S' C: d7 X! J4 W document.getElementById(id).style.color = hoverColour;
$ @" D* a$ o9 Q3 i- q0 g& Y/ w, _7 J8 I: ^" k
}
2 I$ C5 ^: G, q
5 g/ b% L; v- K0 y clearTimeout(tID[id]);/ u- d9 H% C& n" W! K
i; v: y2 Z' n- Z8 k' K7 k' h
tID[id]=setTimeout('startFade(' + id + ')', rate);
& L3 x, Z2 J% t# r
- I/ _3 i0 D7 Z}" b, t# N5 V5 G% C5 [
8 H4 |7 \& j: _# \5 _5 ~: ^function continueFade(id)8 w+ U1 y2 N! O, Y& n' K" f
5 V7 Q$ O o2 O* w5 h, H{
3 a! ]* n4 b8 ~- T
+ }. g' r* g$ g- T% D9 Z continuous[id] = true;) ^$ W1 \; q# D4 [7 {/ q5 R3 E8 R1 {, p0 g
) G6 s; n2 c/ y
}
1 X. m4 R; l) E0 q" J2 v3 i
! C/ H9 ~3 ~. A" Bfunction stopFade(id)1 {/ J8 v \" k" \
+ f1 T5 ^' n0 X$ R2 n d- M
{4 P; { b( d7 d6 {, _
+ X7 U! E" G$ }( U# \$ E continuous[id] = false;& v3 X. n/ J0 d0 H, }
& R2 t/ g8 s6 T5 Q( ^3 n& T
}& o+ a( O: S- m
5 F2 V& M' U! R( N0 v: U% ifunction StartTimers(). X) J( D- J% B+ t# p+ f2 e
/ M5 r0 F0 q* M: ~/ e
{ //set up an initial set of timers to start the shimmering effect" l, F% ^5 ?+ q
% X" |0 s; G8 q9 p F# y for(id=0; id<numLinks; id++)! L w7 O" }( p! c- _& i
; N& m. w, _4 T6 A
{/ u0 `9 \, y4 [* k5 _7 [# Y
2 R- ]$ P1 I4 ~) e# Z
t=setTimeout('startFade(' + id + ')', id*100);
5 P% @2 w- d \( f% F& O- K7 R9 F( q5 k% O: C* R' o& I8 J4 a8 m
}
/ c, r8 j9 ?8 D; @
! U1 @. c1 R$ A2 b3 ?0 W}
* d! h2 u( G( Y, K( ?; [" l( T; ^' T9 m
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
" l+ n* C" ] f4 a) ~8 o' r; T; B2 C7 J! `$ @
initLinks('#FF0000', 6, '#FFCC77');" Z( c7 v5 I& p8 a @* }2 x$ b% C
. l5 M$ _# T$ f
//-->
2 [2 N+ Y& L) q
0 s! `" z' i' k3 z* y$ ]</script>! Y) @, t \) {3 g$ c( }+ N2 r- ?3 m% J
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名:58元
% F; R3 W# b8 }6 \6 b</a>* o9 }$ F0 x# S# o z( n2 m3 ]
<br>
' A. F+ v" r5 G<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名:110元</a>
Q h/ `7 p( @4 S1 H+ q<br>7 ]; G" e& p% J
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>1 {+ ]3 H' ~" s: q* D$ V
<br> # t a {. y+ G, Q, D
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
: n$ a" E7 r* n! |7 j, K<br>
; o& B; A# f& J, m; G; }/ ]: h, F<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>, r* `+ Q' Y) v& k
<br>
! h0 z! y7 S( x2 x<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>$ G5 I9 B8 U7 u9 y' @7 t2 u: I- ]
<script language="javascript" type="text/javascript">! C: `: S5 K5 e5 O* H9 W
<!--
: j+ y, g& |5 L) O# y* GsetTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering6 q+ E, Q1 n8 F6 U* X6 s
//-->
$ `2 K) |3 o' v- l3 O% L</script> |
|