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

|
网页之文字的循环闪动特效
<script language="javascript" type="text/javascript">
+ g$ a" V% T$ ~3 U% h g4 R6 G9 F<!--
P8 k2 }3 c9 S7 E" u3 |5 N// convert a single digit (0 - 16) into hex4 D6 E& j# j# Z5 A. D C* ~7 ~
function enHex(aDigit). K. D! s2 X+ \, o P1 V
{
. A( J, U7 s5 S; h) s1 }/ ] return("0123456789ABCDEF".substring(aDigit, aDigit+1))& O$ a, L% u9 P3 H! y
}
! e1 e/ R" x# h7 T# g; {// convert a hex digit into decimal+ m" O: j: W. }% C/ j; }& V
function deHex(aDigit)& t" r& w4 C+ a, q
{
5 ?/ i' e T! v* o0 t% J; M return("0123456789ABCDEF".indexOf(aDigit))
; D8 r3 N0 S: q}2 c: h j k( z
0 ]* B$ L7 @6 T2 u- P* `# t$ r
// Convert a 24bit number to hex& A; j) G I6 i/ C8 X: Z2 m, h9 I
function toHex(n)
( h; J9 O% _& z& @0 ~. u# |9 G{
2 P$ C, H6 A+ N a return (enHex((0xf00000 & n) >> 20) +
5 ^$ N5 R, r2 N; x4 S2 N: N enHex((0x0f0000 & n) >> 16) +
- Q7 F7 S _: g3 p( I' d8 X enHex((0x00f000 & n) >> 12) +
8 V1 _. ]3 [4 g5 U enHex((0x000f00 & n) >> 8) +8 x5 g) Q2 k' v9 D( e3 E2 T
enHex((0x0000f0 & n) >> 4) +
8 G" G3 @ V. @* L enHex((0x00000f & n) >> 0)), M [" ^" C& X" i5 X
}& I1 M4 w- |5 f
// Convert a six character hex to decimal
7 i: m$ v: c2 R- M; K6 |8 Wfunction toDecimal(hexNum)
. E! p/ `& Q7 S{
3 j/ ]) M0 V3 y1 x1 Y var tmp = ""+hexNum.toUpperCase()1 ~9 o& e }( l P/ V% B! L
while (tmp.length < 6) tmp = "0"+tmp
8 c* q: O* ]' z# j2 M+ r1 e return ((deHex(tmp.substring(0,1)) << 20) +1 N. X0 J3 M3 s+ S( C+ h
(deHex(tmp.substring(1,2)) << 16) + 2 N/ f6 ?( i, U% m- X" s1 C
(deHex(tmp.substring(2,3)) << 12) +$ }8 b/ P3 I) A& Q( O; w2 L
(deHex(tmp.substring(3,4)) << 8) +
* r" z' c5 z! T N8 O3 W3 q, K (deHex(tmp.substring(4,5)) << 4) +
) h$ v8 u; C4 u& o (deHex(tmp.substring(5,6)))) u* o" E( l; L0 P
}
8 g. }8 l+ w5 {9 }///////////////////Shimmering Links/////////////////////
! _# f- k: r3 a3 c' @6 m//global variables
3 b) l8 q: z7 O* I# r0 _var hoverColour
% Z# l- t& Q+ h& J Zvar numLinks; O( `5 _9 z/ ^0 G/ [2 S& J' h
var rate;* P! e# U( R' u9 A
var numFadeLevels;
8 c7 V9 L/ e6 S, G7 L `var bgR;
: e: b' v$ @- w2 Z# M8 p3 Cvar bgG;: Z$ {5 T n8 p- z' x7 ^, {: q9 \
var bgB; J$ x7 V8 `4 I5 ]! y; Y1 D
var currR;8 _0 z, }' p" T% ^! ]+ W
var currG;# M7 v' _2 ]. r# x, A" \& i. I2 s
var currB;( r( q- y6 F% s+ z+ d
var count;
, A9 S- f( V9 @1 s9 G$ |* Vvar fadeOut;
6 x0 h* c# c3 ?7 I+ Yvar continuous;6 D+ Z# h( I( L( _
var newColour;( _; m( p+ Q/ ]) O
var tID;
' w2 w% O3 n) P' k, w hvar redInterval;$ w6 g( B) k' D: G) r9 T+ ~; K; p
var greenInterval;
+ t/ J. `5 _+ a0 p( \+ lvar blueInterval;; R# `0 x4 u2 o2 Y
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour); \: F: x+ r+ h z; a
{
3 ^. ~0 a2 @" H& V1 j) H2 p hoverColour = mouseOverColour;2 o# R) O+ l! z
numLinks = numberOfLinks;
- g: `' G9 { y7 D0 B C rate = 1;! a4 F0 k5 e4 Y+ I7 E: e
numFadeLevels = 30;
. w) {6 @4 Q, e2 a1 U function initArray(theArray, length, val). x; {- }! C9 s: L# M9 c3 h* e
{7 i$ B! I# C1 o$ k m- _" N
for(i=0;i<length;i++)) p$ r* u# r: L( x
{$ g1 c9 ? {. Q5 T U9 @. p
theArray = val;% {: G; f2 ^4 H4 _7 I
}
9 f4 v* e9 ^8 Q% _- P }
4 M# ?: O) H+ V! Y3 F5 I% x+ j$ P3 N bgR = '0000' + fadeOutColour.substring(1,3)" ?2 J& l9 j; O9 l0 O" Z. l
bgG = '0000' + fadeOutColour.substring(3,5)4 }% E0 U% E) S
bgB = '0000' + fadeOutColour.substring(5,7)
# \: C, U: H2 m& ^8 X currR = new Array(numLinks);
x. }% j# I/ c9 n8 B1 X* m! ] currG = new Array(numLinks);
5 I) d" D+ J! ]4 r5 P currB = new Array(numLinks);
1 u2 r: \% m& a1 [ count = new Array(numLinks);
( |, P. a! r. R fadeOut = new Array(numLinks);, j n, L" k/ q% R+ |4 k, F
continuous = new Array(numLinks);
) ?0 W: k8 c! u) | _ newColour = new Array(numLinks);2 P9 x5 K& l4 s
tID = new Array(numLinks);
, r' {5 p0 [9 a redInterval = toDecimal(bgR) / numFadeLevels;
) n4 m, _4 J7 G" N/ w. m greenInterval = toDecimal(bgG) / numFadeLevels;" k# R, ]5 l9 W5 U5 R( a
blueInterval = toDecimal(bgB) / numFadeLevels;9 R1 M5 O* W: z2 L, W$ o9 q
initArray(currR,numLinks,0);7 Q7 j6 L: w5 I3 v2 D. I
initArray(currG,numLinks,0);7 R* q! J$ G0 a" ?" l
initArray(currB,numLinks,0);
& ?9 o: s2 Q. f initArray(count,numLinks,0);2 ]2 f$ p) M4 ~( e& D5 h
initArray(fadeOut,numLinks,true);
1 Y2 e2 M+ x0 {! i& P initArray(continuous,numLinks,true);
' }$ G& |7 b, m2 F0 R} . K5 \- i) H1 M6 S% @$ N, u
function startFade(id)! q0 a5 u; t) S5 \2 V9 B
{4 g! m4 B9 [6 \
if(fadeOut[id] == true)
& l2 ?9 a# z& v { /*move colour towards background colour (increment)*/$ k% d" d! j8 ]- u) p: ]! f
currR[id] += redInterval;, r8 G2 f1 A6 g$ U
currG[id] += greenInterval;* J1 l1 B) S0 R2 @/ i$ j
currB[id] += blueInterval;+ Z6 o5 b: ^# D5 D. x2 z* W) @
newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
7 x. m m" e, Z" y3 b if(++count[id] == numFadeLevels)
7 I6 ?; V* D8 J( {$ d& {/ S {
, ]& I9 h6 g( }& D: v& o fadeOut[id] = false;
( ?% Z5 } F& K2 z( ?. F) F }
/ h9 C% y9 p* } }
Y4 N5 a" C* U, C# S else
" G2 Z. i' q0 Y {; V8 L( y( w: S$ e# p. `
currR[id] -= redInterval;
) H* _* d4 _: o7 B1 b- t/ R3 R& H- c1 j7 C8 F# U2 A
currG[id] -= greenInterval;
& `* Y+ X) p4 f$ o1 ^: w- ?
/ h( x; ?6 T' t$ D9 a+ { currB[id] -= blueInterval;: r4 ]- w7 q/ Q& T
/ ~, m" L3 S- P) A- [4 W newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);, r1 u2 t: c8 `" A& `' Y
a8 a2 B& r* q$ K _9 J% y if(--count[id] == 0)
B% A' E; l# l7 I8 X' r) Y; Z- m0 S3 V/ n
{4 x$ ?6 o0 f+ ~* F) u$ Z: c
) l. T5 Z7 _2 E3 z& g2 w fadeOut[id] = true;* l0 Q- F5 s. f2 g4 i/ U1 J
0 l+ b$ D3 \+ {; F" [, Y' P }
" ]3 D# S, N* G q, b0 r0 y5 R0 C" O& U$ ?! b
}) v; I1 T' l- l3 j7 O
/ I' }! Z" d( T if(continuous[id] == true)0 ? Z4 d4 ^' i# O
) G; V5 M+ C% @9 W {
9 ?3 A% Q ^+ F7 p: f) h/ F" y9 d6 h2 a
document.getElementById(id).style.color = newColour[id]; ! }* X6 x% ]: m' ?
: m. F, b8 G* R, s/ m8 [ }
$ _7 q6 q- q- q) h! s
& F6 c3 g9 |7 d% n7 t4 U, G# C else
( H3 T* L7 |& x- A* a, P+ s
9 d2 {, ^/ T0 T {
" `: x9 h% J4 A5 C+ ^( e/ O3 R
, E1 F! T1 }4 `1 E0 {! T6 b' J document.getElementById(id).style.color = hoverColour;
) y) l6 A6 j# n
0 U l5 ]5 j% c }
' U' r, @* |8 _/ V h
8 _% d) G# j/ `1 e4 i clearTimeout(tID[id]);* Z K# ]. h5 H
3 }. D) K B- R: ?0 ^( I
tID[id]=setTimeout('startFade(' + id + ')', rate);5 k& u% Z3 S" R9 F' s8 }+ G
. M" s+ w. w7 {1 |# U}" s2 `7 l7 G4 N# j+ H2 z: L$ ?" m
: O2 p: A) v9 C2 }function continueFade(id)/ J2 H T! ~1 g) l
" U2 `1 B J7 W" e+ s! e
{+ w8 A; X. q! z- U Q8 U; _% G+ P
3 j/ y! l0 g/ ^4 K continuous[id] = true;$ C1 W7 w {5 I9 I J
; [# K( ?& o' P" v8 p}
1 d( K; G) ^, W' O, s6 Z! A0 y2 y' m9 |8 I7 F
function stopFade(id)
& q+ M) L; r9 ~8 F" v6 b* ^7 c
9 y( b& I2 l9 t7 ^( ^6 J" h& n- v9 M% D{
* c; w5 v5 A1 B! W8 \) e7 G6 \$ y6 p& g/ v$ Y
continuous[id] = false;9 G/ p& d/ v3 R; I0 ~
7 v" X$ a7 F& w N* M7 h! u" L
}5 u4 g0 g) C! q. ^8 u- g
6 `5 C$ i( H0 ^$ u& y( i {* x2 ?
function StartTimers(), ]* y6 m. @+ k$ [
3 E7 J4 M+ E4 j/ ]/ ^1 N
{ //set up an initial set of timers to start the shimmering effect ?" f/ z# y. O8 \6 v: |
( {$ i) }, p: J7 P; U) m, E4 _ for(id=0; id<numLinks; id++)# \: l \3 n) w+ V* y
5 G9 E9 m' N0 P* u {' ~+ ?1 o6 J) A
- g2 H6 w$ q: v6 ]0 ~( @
t=setTimeout('startFade(' + id + ')', id*100);: [/ v" [2 w! }. U
* d$ f& R0 y, `4 c0 Q6 c' D' u1 @ }* @5 U7 k0 T' A6 c& y
8 Q: V& F% p( Y6 A7 x7 s}5 H4 d2 p, l& |- H$ O6 g. `. T9 Z
' w+ b( t- Q) G. p1 j, Z1 p6 K+ [% o
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour'): {2 o% ~, g/ _
4 S( s/ c0 E( t4 i
initLinks('#FF0000', 6, '#FFCC77');
% N) ?. J& j! G# I( A' t1 E r2 e, l8 I
//-->+ \. G$ j( m" d1 ^1 r
, O& S/ K! |# Z P6 h: }
</script>
5 O* h7 n( p9 E, F+ |, t, P1 i<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名:58元
9 o5 [( X. X2 G4 k</a>
6 D2 p& c; D- t6 S. A" ^. U<br>; ^/ O' B* y. ?
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名:110元</a>
, M9 x! D. e2 d- V( x<br>
, t0 q% a' d* U$ s<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
, t U) P5 u% l$ G" u<br> + L2 X. ~; |: u+ T, a8 ]
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>+ a5 L; l1 N6 s& H. j
<br>' \" v1 V Z+ Z3 s9 |
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
3 S* {- O' k0 |# k; F+ S7 E<br>
& Z! Z0 J u2 N- i( _* l7 l<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>; C+ j( D, {5 L( w6 j- [) y
<script language="javascript" type="text/javascript">+ |5 a: @2 d: B5 O
<!--
! k/ K4 Z. m) W2 i- e. XsetTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering1 q6 T. R/ i, b# ?3 O; W5 L7 O3 \
//-->
2 q) \ ^2 g* H X" \1 G. r</script> |
|