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

|
网页之文字的循环闪动特效
<script language="javascript" type="text/javascript">9 A9 H% a' G" R5 X- Z* @
<!--, p% z% R4 X) j0 _, L' [
// convert a single digit (0 - 16) into hex% Q# h6 K8 t+ L6 Z: p
function enHex(aDigit)
; w6 e4 ?7 ^$ G, D{
; U( u& b1 e# M& Y. h return("0123456789ABCDEF".substring(aDigit, aDigit+1))
9 n# E3 P/ u" R}
+ n& ~+ p( M" g: Q// convert a hex digit into decimal7 A% L) o7 V9 U4 D
function deHex(aDigit)" y; S( E3 C1 V0 C7 o2 O5 V
{
! _* g% M4 @# q return("0123456789ABCDEF".indexOf(aDigit))
: Y' \8 Q1 r$ r& z}* k9 @- G6 b6 D: V# t* f( j2 z* O
% |4 m8 i+ U- [9 \6 h// Convert a 24bit number to hex9 p2 n; s% S8 Z, h$ l Q
function toHex(n), n \& t) j# x1 E3 ?3 V
{
?) t: W- @" ^' l) m% [8 h return (enHex((0xf00000 & n) >> 20) +' Q Y! q8 j* s4 }% i
enHex((0x0f0000 & n) >> 16) +
- W j: h, K1 x8 L1 }# V enHex((0x00f000 & n) >> 12) +
8 }! O3 F/ l0 K enHex((0x000f00 & n) >> 8) +/ T' L( h, Y9 O, |
enHex((0x0000f0 & n) >> 4) +( C6 A. t( B! |/ P
enHex((0x00000f & n) >> 0))) ]2 q7 X$ G. v( I
}
$ [! q" c& u" u4 r$ p) v// Convert a six character hex to decimal$ q* B! U! K) ^4 u/ Z. @
function toDecimal(hexNum)
l- B: u+ F2 T8 c8 @" R{
0 ]' N- S% l& r# f% f var tmp = ""+hexNum.toUpperCase(): ]4 T% W1 Y) T& d
while (tmp.length < 6) tmp = "0"+tmp8 {6 G' u; u2 d5 F6 T
return ((deHex(tmp.substring(0,1)) << 20) +
4 ]- o- J3 e9 o( G$ [ (deHex(tmp.substring(1,2)) << 16) +
6 \7 `7 J: L7 n$ M (deHex(tmp.substring(2,3)) << 12) +
. Q/ k5 [0 Q% v5 ^6 F (deHex(tmp.substring(3,4)) << 8) +- q3 x- ]2 x, O- d1 d
(deHex(tmp.substring(4,5)) << 4) +
, `% X5 u, U. ] (deHex(tmp.substring(5,6))))
. }4 V4 f# F: t! ^}
( Y( y' i0 W& L5 n2 j7 M///////////////////Shimmering Links/////////////////////
$ k" f' D- i2 s2 K//global variables
5 h0 H( R A ~' [! |6 j# ~var hoverColour h4 n' @: n( M- i7 ^7 k6 \: E1 k
var numLinks;8 Q% k1 y' C1 m$ T, K
var rate;6 q1 u) f* L' g3 [% D
var numFadeLevels;% Z, k( p& m" ^3 M0 d. U" M
var bgR;
" x* x! W/ ~5 hvar bgG;+ ?9 @7 N6 V' g
var bgB;
$ |2 @' t( B& z8 C6 m, e& U& R6 ]; Y( rvar currR;
1 B3 D# O: G0 c% S! y! @4 ~/ fvar currG;
7 \) U! {* g3 ^/ a& h& dvar currB;
' i' B6 O3 d4 i; d6 g9 x* Pvar count;
, y$ X4 C5 f5 c4 gvar fadeOut;! A! S: T* X8 H, t# W
var continuous;
& M! F0 h: |% r9 O; J, f$ K# Svar newColour;' U q9 m |* c3 p: I
var tID;
9 @8 B. M: P4 C$ ~var redInterval;: R$ W P& O9 K/ h) `. ^+ A' M
var greenInterval;
! M% z3 p$ T2 Q: N. Y& X) Nvar blueInterval;
% Q+ s ?$ l0 s* Lfunction initLinks(mouseOverColour, numberOfLinks, fadeOutColour)0 t! ~( c$ F7 y3 C+ R/ w1 |6 }
{
; Q" b8 ]1 \. Q) j% Z) @$ N. F hoverColour = mouseOverColour;
( I4 M2 b# ~. q numLinks = numberOfLinks;
C8 d1 B, r% U# B& P+ M6 d rate = 1;
$ y: V) [5 ], D9 u6 i2 r" n' q/ m( ? numFadeLevels = 30;3 D: i& }: f: n% Z9 ]2 r: |, [9 A, V% A; y
function initArray(theArray, length, val)) C$ f9 Y X' U9 I: |
{& ]/ g4 o! v8 w9 c3 k/ ?6 Z3 p! E
for(i=0;i<length;i++) ?7 p+ L: O# j. \+ f5 P2 C
{. `6 A$ b3 H' f
theArray = val;) g" p0 O0 N) j, }! w% ^
}
( B: @$ C: P4 U" s }! } S$ b. X" f
bgR = '0000' + fadeOutColour.substring(1,3)4 r7 G+ t6 N* o" U
bgG = '0000' + fadeOutColour.substring(3,5)9 T- b. A/ @7 x* J# H' `% |$ L
bgB = '0000' + fadeOutColour.substring(5,7) Z% y- l) }: A+ n0 a; l* q
currR = new Array(numLinks);
$ p& K" g/ Y# m m3 y1 E0 f currG = new Array(numLinks);0 b$ `% H- I; _' v1 l
currB = new Array(numLinks); u+ R+ p7 ~- Q1 F3 w! {
count = new Array(numLinks);
; H8 p1 D, b1 s9 N- l! s! x fadeOut = new Array(numLinks);
3 V' c! g7 s: o4 W; V& I continuous = new Array(numLinks);
8 X; f0 y; ?4 H% d' _# X1 r newColour = new Array(numLinks);
' C4 J8 L/ q. _ tID = new Array(numLinks);
1 j+ ^( a* t$ u: t redInterval = toDecimal(bgR) / numFadeLevels;
9 `! x8 k( u/ s1 B& s# p/ O greenInterval = toDecimal(bgG) / numFadeLevels;
" \( h1 V1 O& [! N" |. D" y# {. W blueInterval = toDecimal(bgB) / numFadeLevels;; w3 w: r5 z. K/ { }
initArray(currR,numLinks,0);
0 N8 Q5 T3 g9 S7 O initArray(currG,numLinks,0);( S. Y! \* J b% X5 {
initArray(currB,numLinks,0);
+ Y, n0 H* G, P$ T. K6 g+ b, e initArray(count,numLinks,0);
# K- M( n8 Q/ Y: c7 j initArray(fadeOut,numLinks,true);# H0 n3 c. G. \
initArray(continuous,numLinks,true);
7 F' k3 k3 x! i* ~# w- T& p! A- p} 9 j2 [$ u4 x* i$ t2 w& I/ l/ ]- X
function startFade(id)- \! [% v5 n& I# i! U* g0 h' y
{7 T5 E$ J$ e7 T8 [# _- F4 S1 R
if(fadeOut[id] == true)
; P, ]# w$ P' s+ K { /*move colour towards background colour (increment)*/6 b# t7 q1 h# e0 f: M _ b/ X
currR[id] += redInterval;
6 l; {: [! z* k7 O6 a currG[id] += greenInterval;
2 s: l6 M' k" s# ?- `9 x currB[id] += blueInterval;
7 B$ ]9 z; B# Y, r1 M. E newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
1 {+ f2 q/ w+ V' e if(++count[id] == numFadeLevels)
: G3 ?! s' }1 W, \! r) m {2 Z" m; ~0 \: T0 K
fadeOut[id] = false;* V* ~" G) x1 r$ v U4 f
}+ v9 g5 I3 m. R& |! O
}, q8 x! ^5 I' c4 C W
else' h, c8 c# s& @
{
6 h) ]9 I& ?7 E currR[id] -= redInterval;- V/ A! I9 p; E) Z4 e- `
, }7 c' n& }. J$ S7 {5 g
currG[id] -= greenInterval;5 S0 k! u1 ]- t" _7 u9 _
6 U# ]( k" d. f0 ^, s! b0 K3 S currB[id] -= blueInterval;
6 p7 d# ?" `' L8 T# _6 E: l9 x) @/ j
9 s' o0 L+ S3 B: G @7 @! j ` newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
8 G/ A0 S' J, m: A4 A/ F1 x. \* ^9 r0 u8 q* u- h5 S5 y
if(--count[id] == 0)& ^) Z, q7 ~4 o
1 `6 h* ^5 Q6 V0 I! T0 a$ I2 g4 c1 p
{
7 `7 M* l! }& L1 r# I% z5 _. v
S, m4 S2 W& E0 ?) a7 v9 A fadeOut[id] = true; n* e- S" `7 |$ [. M
/ }) x3 p( g0 ^3 S! U) c* N! M
}
6 S8 q+ R+ I2 {2 J f" m) K/ i2 Z6 _
}
/ ?8 }& d3 }, ]1 ^/ Q
7 I1 j' U$ M* ^7 P" {2 y if(continuous[id] == true)- Q4 z2 z% O4 d1 V* b5 r) J
' A9 ^6 p$ h: Z' Q. o
{
5 o# n3 m5 P6 C5 z- ?
. X- P- X, \, J( m& O* L, | document.getElementById(id).style.color = newColour[id];
/ N# \& m5 q: K! T/ I: q4 C# r* \; e4 V% y8 T# Y, j: `9 F
}$ _1 _6 J' R6 E
6 P. \1 B5 j9 `) p- { else( A$ V. |4 E3 o: x7 y. b1 W6 M0 ~
# T# A* y. d; z) S( ?, o {
: A; @8 X) _/ ~- o8 ~" t% ]* l$ }# \- l
document.getElementById(id).style.color = hoverColour;6 N4 U6 `% q0 D+ J3 ?( ^5 S
8 R* ]" }5 y4 Y+ v) \: f* h0 Z
}
( M2 y7 B3 V6 S: b* s/ Y$ j- b
; b% @7 i' Y3 b% y& c2 z, @3 g clearTimeout(tID[id]);
! K' T3 @8 C0 ^& P1 J9 e$ D; p: Z. h! |) ]7 I2 v- s
tID[id]=setTimeout('startFade(' + id + ')', rate);
( h) c% I# Q% Z( o, M, \3 G: l8 o. ?
}
1 S G- ?, d& I; J9 g& ]! j: m3 b0 i
function continueFade(id)& A# f/ |5 |9 q
% [& ^2 n( t, C: `/ @+ d{& C$ w" O* O, q& s
6 Q: T' ?- r0 q. ]
continuous[id] = true;
" t6 L( S* R# W5 |/ c M! ~4 g# \ ~& u+ Y7 Y4 M5 K
}
+ V4 c7 d2 p1 B i: C7 l
7 c8 o( Y9 o4 w$ W% r4 Bfunction stopFade(id)8 C9 B) q: V. c3 w
* M* `" p% a7 o; O1 d$ t& o( k{- C5 J, V$ Q, y! g$ E8 f
7 k9 l; k) i+ [; {* ^
continuous[id] = false;
8 `& D+ x8 a" t: \) S y' W0 `; o1 @. W2 l) o( f
}
( H6 w+ F2 [3 A& K/ D* x9 b$ L& | n
function StartTimers()
0 x3 J7 e# }% I; S, k2 R" C% L, r- i0 y$ e
{ //set up an initial set of timers to start the shimmering effect( d A- h3 D; E# }% c4 s$ n( u
+ a& B, U) C7 x
for(id=0; id<numLinks; id++)4 Q: ~0 k. l9 |4 J
# X: V$ q4 {) a( J- K& z8 B {$ i$ Z% z* v7 M
7 P T& Q. w7 Z, C: D t=setTimeout('startFade(' + id + ')', id*100);
+ E0 o$ y4 H0 j3 ~0 }
\" Q! |. d( b6 l: X }$ M. J% T, y8 _* j/ c2 W0 T; N6 Z. N
$ o9 B5 {5 m) S. \
}7 j$ z0 [1 S* t [( w) R& _
5 }( c# L/ L: K+ q
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')1 N$ P* ~3 p$ F0 I2 U: x
( x) O! l' R; X$ c
initLinks('#FF0000', 6, '#FFCC77');
% \9 K! Z% l, P w8 `" K( Y8 e$ c% V/ b% p
//-->; l8 ~8 L, w9 w5 v8 j) O
: F$ E4 X. _8 B& t! m3 T; B2 N; G" m
</script>! l: P( J! s( v5 P9 Z( `( f
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名:58元
_2 O" F& m5 {* M</a>
G% y. o2 N- A) @8 v<br>3 S# }. b' u0 W7 q2 A3 R
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名:110元</a>- C/ k9 V: V6 S( r7 `
<br># _4 s8 Y. @8 r! i
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
- }6 U9 q1 h' ^/ @8 S<br>
4 U% b- R1 h" u/ l! B$ u: ^) I2 m<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
( x7 B3 e* Z. r<br>4 h9 ^# \' f* k
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
* B- n/ S/ n$ Z( r<br>7 ~+ a* ^6 e; r
<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>
$ l9 F l; k+ p+ ~) r# X. {; g, b<script language="javascript" type="text/javascript">
! _& A' F' Y( P/ w4 p A4 p$ V7 J<!-- z! H- g/ z" G ] e: z
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering$ h: U& l1 i" ^& x* N! a; x
//-->
2 i2 O$ K! X2 y8 m# }</script> |
|