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

|
网页之文字的循环闪动特效
<script language="javascript" type="text/javascript">
6 O: O, [ d9 r9 E7 \<!--
& J; z4 ?; J1 ~" G2 @7 v// convert a single digit (0 - 16) into hex0 Q; h: D' \! D) R3 m' ~/ U
function enHex(aDigit). I/ i& u9 S- p
{; }1 |$ v9 t" X' G6 M4 U/ J
return("0123456789ABCDEF".substring(aDigit, aDigit+1))
3 L# q6 o8 p2 N# M4 U' n* Q}
0 h7 Y P; a2 D+ o- k" `( |$ a// convert a hex digit into decimal8 a6 Z8 H8 b2 E3 f# i& `+ K* h9 C! l
function deHex(aDigit)' o' {6 M! y* C1 I! z8 |. l( A
{0 g7 B Q3 q7 Y
return("0123456789ABCDEF".indexOf(aDigit)); N4 |" R& o2 `) [* Z, L) L$ `
}5 u' {( u$ s0 f3 w% \ ]
0 \/ G! k$ R$ l* y# f- ]/ Y" c, f// Convert a 24bit number to hex
5 A: `/ ]& D0 Z: ^$ {function toHex(n)
a# S, r6 z* ]# L{9 j' g c+ l" A+ l& ? ^1 C
return (enHex((0xf00000 & n) >> 20) +/ F1 X9 }2 Q K4 W* ^& M
enHex((0x0f0000 & n) >> 16) +
1 x ^) U1 \9 n: }6 V, D( F5 U% o enHex((0x00f000 & n) >> 12) +
1 p* N, ^2 ^ q8 q7 V enHex((0x000f00 & n) >> 8) +
' F( n2 P8 O9 y) B: ^ enHex((0x0000f0 & n) >> 4) +
8 J9 M0 C$ e, S% X( j/ C) ` enHex((0x00000f & n) >> 0))7 E2 l* n3 H* u9 ^! g% Q: C: f
}
/ e$ M0 g0 y! r// Convert a six character hex to decimal) n" H. u$ b8 x" r0 s' C$ r" w
function toDecimal(hexNum)
+ B1 R: w' O! X0 R6 S2 U! L{8 q; s! r" I. d2 I( [2 b% A( i
var tmp = ""+hexNum.toUpperCase()( a3 u0 B( s: O4 o6 e/ m
while (tmp.length < 6) tmp = "0"+tmp, {# e0 W' f9 _" L2 w6 d- Q; ]% ]
return ((deHex(tmp.substring(0,1)) << 20) +
" E- w& i% _% ]3 s( N$ i" L5 [; f' i. z4 ? (deHex(tmp.substring(1,2)) << 16) + " U7 ~7 [$ a- S4 y* h
(deHex(tmp.substring(2,3)) << 12) +8 X+ g4 s/ u' v5 i
(deHex(tmp.substring(3,4)) << 8) +
- D5 Q f A/ d8 ]8 E1 S (deHex(tmp.substring(4,5)) << 4) +
$ X( x" u5 A/ I4 n0 m (deHex(tmp.substring(5,6))))3 r% D4 i, c/ [2 N1 } x
}1 |* D4 X* Y% ]1 V: S4 | G
///////////////////Shimmering Links/////////////////////
- v5 d* U3 X, d9 B0 ^( J//global variables" y. O1 B2 R/ ~+ z s' ~
var hoverColour4 Z d8 G, K! r. ~
var numLinks;
! L1 H6 {$ b; {" Q: p& C0 b5 Zvar rate;
2 I6 j7 ~, v( p; s5 @5 `var numFadeLevels;7 U2 x T- v1 m* E& P- v) P
var bgR;( I0 A9 @+ p; V9 E! i
var bgG;
$ \. l1 }1 e' I' |: ^- J2 y/ gvar bgB;
6 `2 z3 |8 z, C/ V* w9 A5 Xvar currR; n2 Z2 F$ g" Y. x }4 `* V" N6 B% B: m
var currG;: v: M0 }- p" Q. y2 B, L, J
var currB;
" U5 q: a5 f+ w+ M* Q& |var count;
3 @; ]; y8 J4 ? f; M) ovar fadeOut;
' A2 ~; S+ C0 z$ }* mvar continuous;0 o) t7 m2 a' F
var newColour;
6 w _1 P- `. A. n: Cvar tID;, C# X8 \( A* D, _, k
var redInterval;- D( E0 f9 z1 B* @4 H& [" J% [6 O9 b
var greenInterval;% e8 ~$ u: o4 C5 M1 g2 { m+ M. s+ ?
var blueInterval;
+ E$ o" c& n% ]5 Y3 M$ ]function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
0 U, Y. Q6 u4 g7 r, M5 t j{
" E z9 [! @- n) r' \* S2 U hoverColour = mouseOverColour;
3 }' ^0 D! c5 C; n+ y5 N numLinks = numberOfLinks;
! ^4 H' ?2 n) K: J, o rate = 1;. W. R( u T" y' ?! [$ C2 }
numFadeLevels = 30;) _# k- x4 K$ A1 F/ p8 ~
function initArray(theArray, length, val); U5 V2 ]5 z" N& r: D
{
[, [% G& q% @ for(i=0;i<length;i++)
' D; ^' @. z; ]2 J# p {, ]' `0 u# S) F/ }! @( M, R: l$ g
theArray = val;' p: V" D9 B( S/ p) q0 m% O
}# H" ~! C1 W$ \ o3 _& t% A% t
}
5 K6 @! [5 O" k% n6 n- d+ ]1 I bgR = '0000' + fadeOutColour.substring(1,3)
' S" ]( P6 L" R1 | bgG = '0000' + fadeOutColour.substring(3,5)8 O' @5 |/ T: A4 Q8 h7 N! y9 |
bgB = '0000' + fadeOutColour.substring(5,7)
3 }! r; j% k" @; m1 z7 A" ~; c4 y currR = new Array(numLinks);+ X8 f% |) E3 [" O& F7 e3 h
currG = new Array(numLinks); \, o# ?: B# A" l
currB = new Array(numLinks);
* N% k2 M9 D, X" C1 p7 o1 L1 e count = new Array(numLinks);
/ O7 H1 H+ ~; O fadeOut = new Array(numLinks);
$ A- A8 }- o5 |! ^! p- {, _ continuous = new Array(numLinks);" Z7 d1 b9 N. I v7 V
newColour = new Array(numLinks);, J0 a, m6 x( R, E3 s
tID = new Array(numLinks);8 C. _8 J; U$ a
redInterval = toDecimal(bgR) / numFadeLevels;
( o; ^" \: T* O1 q7 O greenInterval = toDecimal(bgG) / numFadeLevels;6 A* C: L; E" J( @$ U- e# W
blueInterval = toDecimal(bgB) / numFadeLevels;$ i- M. e7 O8 l0 V
initArray(currR,numLinks,0);
, s6 A# F9 [. W+ ]% U5 v( U) [ initArray(currG,numLinks,0);$ ]- [6 e5 I% r2 I
initArray(currB,numLinks,0);
" H& k6 [2 n7 g% {. N initArray(count,numLinks,0);) J+ r) Y& }% d3 t5 B0 O8 r
initArray(fadeOut,numLinks,true);. R. J! @6 _+ B( y2 Z; x
initArray(continuous,numLinks,true);1 q- i$ A2 F) ^( H; R* E1 j
}
8 W& t) U9 ~, t* zfunction startFade(id)
# J: n4 g9 P9 f y{5 V. t! N7 R! n
if(fadeOut[id] == true)5 K8 p- O" H2 p: q) B2 ^# w1 S
{ /*move colour towards background colour (increment)*/9 O/ ] w+ N/ e- ]/ F& ?
currR[id] += redInterval;
; Z0 @& O2 d$ s+ N) P9 v2 `1 K currG[id] += greenInterval;
5 U, j: X) B1 s1 g currB[id] += blueInterval;3 I" r3 e$ k1 M8 _ C* u1 d5 O% `8 u+ F. k
newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);6 }, K) S3 x& E( W' ~' L1 z
if(++count[id] == numFadeLevels)
: Y+ X: a- B. f$ v$ p0 j8 C {
3 }8 _0 |3 |& C7 N fadeOut[id] = false;! Q1 Q; X) i, J6 w: c8 i# i
}
4 w" i& h, r$ A2 F8 q# D- u6 t }# U! [) W( v6 y4 ~2 Q* T$ j# I
else
3 ?8 R% D7 q; E1 {- }' K+ ]2 x! Q; t2 \ {: A2 D. e `. R/ I
currR[id] -= redInterval;3 T( @4 Z6 I" s! u# k' m# p. C" ~
% d: [% b% }" M1 @8 @) p4 p
currG[id] -= greenInterval;5 b+ N+ K: c$ z" A$ \
, K: d# M& ?# V0 N5 N; }) Z2 P& K8 z' j currB[id] -= blueInterval;& {% v7 x* e$ ?6 y5 ?
2 t7 J- O g4 M, a) l5 K' f% G7 M newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);' K- \. E9 b9 L u1 G
. a( d6 N' j3 \8 e if(--count[id] == 0)
& J8 w- U' H4 @$ G5 F) o5 F B. P/ R0 L5 \* \3 M% A2 X: }1 c# B) |6 V
{
* v$ g% o$ q5 H+ \8 a4 k# f9 ~( I a' f3 ]) U
fadeOut[id] = true;
: [- e( L- ?2 L/ }& a' ^3 D3 }$ Z: q+ I7 \7 x! |* s+ N g! R
}
- A6 S+ Z, N9 H Q; W" t5 K1 Q* q& u9 I( C3 \9 g: l
}2 d/ _& o) b& a) W, I1 p
9 h" |. c$ n( z4 M$ o) P if(continuous[id] == true)/ R4 S1 K: L3 H9 R
! e% H0 ~: ]- O! |* o' R {4 r) f6 E' ]+ s1 \, j
! d. f: G4 x) ? M" a
document.getElementById(id).style.color = newColour[id]; , Z: {) H4 g3 f, @; G: V7 n; g
2 n7 ?2 d( e4 G$ A$ l2 n* W# m u
}
. |4 ~! B* i6 l( Y7 {$ E8 y5 ?( @" d9 | c. k5 s
else2 W2 D3 | X( f# e6 ~, b
( t T& B8 n k, t
{% c; l0 p% F7 p% ^! ^
' r0 d0 [' K& q
document.getElementById(id).style.color = hoverColour;- [# |4 ]9 D+ E# V
% S" `) u# j W7 D2 a9 b }7 d" _, i" t2 f. K7 d
8 f2 y: B- C; o& C
clearTimeout(tID[id]);" H. G; K8 \% ]! }# \
6 Z7 @0 g* p& M1 |' {
tID[id]=setTimeout('startFade(' + id + ')', rate);8 ?- u( R w7 I8 {3 p3 b* X& i
: v+ P+ Y- L7 q# }' L! ]' x}% m, i; ?: A" B/ c; `7 G6 ~
# T# W# l# k$ C, ufunction continueFade(id)
5 b$ |# A3 }2 ]- s/ O: ?" ~9 }# S w, l9 Y3 c2 y
{. J0 u1 x( Q8 G" k7 O7 _8 U) H
/ v& L! c; s2 r3 r
continuous[id] = true;& u5 O6 b3 B& g- O
9 P* P" Q% E) [1 ^! C}5 d1 Y: E1 [9 q `) ~# Y
7 S3 ^( ? V$ o
function stopFade(id)+ h* r: F [; m$ `" S9 R4 s
' Z0 b7 |. y. s9 ~( b& ]7 f
{
7 B* ?4 T4 f$ i0 e0 B) u1 ^3 m) v- C# ]
continuous[id] = false;" S. k) I: o$ B5 M" r7 r, p: g( p
& O7 ^) c4 Y2 p: o6 Z; A$ F( r}
* H8 z# T! f0 }- }1 P6 A- B! V1 x; S* I/ l, G; ^, ~4 a) J
function StartTimers()
$ K: ]* O; ^/ |6 |) z, L3 ?( N( z/ [8 r
{ //set up an initial set of timers to start the shimmering effect
! L: L: V" S" L/ E6 u5 a& t" ]& e, N7 o, ^
for(id=0; id<numLinks; id++)5 ~( T" s H$ T
( g7 ?. V3 T- Z5 `7 h+ R
{ M1 y* S1 w. e9 G P
6 Y2 f0 l: C/ b t=setTimeout('startFade(' + id + ')', id*100);
1 Y% H2 K- v( v" P
$ @/ C' q- t- X# k" B }
7 l0 Z o% j9 J, s8 n" H5 J# ?/ R& ?6 K' z% M' X" O4 u" t
}/ J, s6 T# Z6 R, U: P8 p5 ?9 W F
! S) O: z @( s$ ^6 u6 l8 e//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
9 V6 z7 D$ p. S, J$ [ d' ?5 z# W+ W# ]
initLinks('#FF0000', 6, '#FFCC77');" Q) B1 N z1 i+ |8 Z
+ I# {' ^/ f6 J$ l% Q//-->
6 l7 f: d; B7 [/ ^, J
9 |0 f3 \$ _9 u) {- g</script>9 C' \3 |7 i# ?! V* {
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名:58元
* R' C" z6 ~! z( l3 x% Q2 v7 @$ t</a>4 t% X; Y, r2 g& m1 J4 @/ r
<br>7 e' F$ X0 \4 M
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名:110元</a>
- k1 v9 X# M8 N% ], U<br>& e# W' M; S# e: U" U3 K- B5 M
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
' H# }# N1 G& B<br>
6 A5 A8 h. b7 i2 f ~# a Y r<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
$ z/ ?2 D* L- C<br>
" e- m9 z4 R- ~- R9 z1 U6 U<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>4 m$ e- ~2 e: Z$ G
<br>& {6 `* M9 T0 F/ ^ y" i( P
<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>
" N ?) |& D9 ~" {4 w$ d<script language="javascript" type="text/javascript">
$ z7 ?6 T) F( X: V% _( v<!--
) i2 C) y, u) ?8 s# RsetTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
* P% A! h) o! b' L//-->3 \$ I, f7 b* N! H7 l. M8 Z; ^
</script> |
|