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

|
网页之文字的循环闪动特效
<script language="javascript" type="text/javascript">
# K; n) p6 @6 s6 \<!--
! a9 `/ u( e% V! H, U; e ]9 \// convert a single digit (0 - 16) into hex1 i: c) H, U" [# B
function enHex(aDigit)- b) Q6 z/ s: G$ J8 ?8 y2 ?! d
{
5 u) Y1 y7 @5 C0 e return("0123456789ABCDEF".substring(aDigit, aDigit+1))4 o1 x6 f7 u; O" _1 V6 E+ v9 y
}1 F. b2 M* @7 f& L7 z
// convert a hex digit into decimal
: T( N2 |6 o# C% e: nfunction deHex(aDigit)6 G' ?. c: \$ f8 P; n% l
{
' a6 p" P; M9 U8 A; C return("0123456789ABCDEF".indexOf(aDigit))- c- B- s6 w* v( U5 D5 v7 C* V
}
# H% T6 M9 o8 X8 m: ^) ]6 m" S2 H2 ?
// Convert a 24bit number to hex
5 D+ |! s9 V1 A" C) E" \, Sfunction toHex(n)4 V7 k( g9 m4 w2 k o& R1 E
{
+ e) D4 x7 k( z8 p# X* K4 e return (enHex((0xf00000 & n) >> 20) +( p l/ Z; k1 P6 I2 |
enHex((0x0f0000 & n) >> 16) +
# _/ q! N7 o" Z* l# n7 v2 Z enHex((0x00f000 & n) >> 12) +/ O7 e9 {- ]: _/ v2 C- G* g% b8 h4 F
enHex((0x000f00 & n) >> 8) +
$ t" T% f2 w6 X0 V4 v- ~2 M/ ] enHex((0x0000f0 & n) >> 4) +. d! f0 W& Y: l5 j; i" d4 J
enHex((0x00000f & n) >> 0))+ O" R& r- `0 ^3 t1 a
}
6 J- \ j: t- v e: ]6 T// Convert a six character hex to decimal) }" {. G9 C! }* ~/ [, K/ X
function toDecimal(hexNum)3 a2 S* o; Y# d. O# Y/ e' a
{, U [- r `3 x9 N" ?/ b
var tmp = ""+hexNum.toUpperCase()
, v6 `4 q& `* I( z. c while (tmp.length < 6) tmp = "0"+tmp
4 u: g9 o& l f. E return ((deHex(tmp.substring(0,1)) << 20) +
9 b" {/ V6 L' R2 v0 c9 S* ? (deHex(tmp.substring(1,2)) << 16) +
1 ?/ V' @" N/ c6 g* R (deHex(tmp.substring(2,3)) << 12) +
( J$ U8 ?6 o5 j, y5 B7 L (deHex(tmp.substring(3,4)) << 8) +, v% h; E% a7 f; P$ U: Z! t+ I
(deHex(tmp.substring(4,5)) << 4) +4 l, `' q# @6 J* g, k b2 F
(deHex(tmp.substring(5,6))))
+ x0 [' x }* q3 i9 A, x}, G5 S4 T( i$ k% n* O. ^+ \. `: Y! e
///////////////////Shimmering Links/////////////////////
* \2 c8 D' l& U3 S5 l* m//global variables
4 G9 O) U8 }8 j e! D" Kvar hoverColour
6 E" T+ o' ]4 y& O9 Z8 jvar numLinks;2 p- k7 v; X Y5 p0 O2 r; s
var rate;: y0 K- R2 N6 R$ h+ V
var numFadeLevels;& \/ T: }, V. z- A
var bgR;
$ J- I4 T- |% Ivar bgG;
9 T& R U' U' M7 N* Nvar bgB;
" w8 A+ K F& p" U dvar currR;
' w8 {6 t& x! D# n) @var currG;- D( L* m8 m# k3 ^( f d8 |+ H$ _2 S
var currB;! |2 a, u: }* \0 b8 y6 o8 [
var count; s- X. M& b) V$ Z
var fadeOut;0 a; d! W7 X7 r$ m0 b- j
var continuous;: \( H3 i4 T/ V/ K+ n* K0 c4 d
var newColour;' c0 @5 Z4 h- N) w% ?: S/ W U
var tID;
( J; d7 x; L# @+ @' nvar redInterval;
0 N% t3 r6 x/ x+ kvar greenInterval;" }# ], Q: m* f$ ~- b
var blueInterval;: W' q1 i0 U0 M1 L' M
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)0 C) V5 ^1 M* B% m4 S
{- `( e r6 ^+ d+ [" V2 l3 r' r
hoverColour = mouseOverColour;( D+ b- n% B+ z- h6 ` d/ l
numLinks = numberOfLinks;# ?5 T o' Q* w
rate = 1;+ q" G' \7 c7 }
numFadeLevels = 30;' l8 y7 E* e9 R* N& y
function initArray(theArray, length, val)
O2 `( V+ }9 ~$ y- c. H {) K% J3 w. C4 p8 N
for(i=0;i<length;i++)3 v- e# X: ?" \# j" G5 k
{ R. h# @# U# ~
theArray = val;
E) N0 o0 x& s {$ `, I! ?1 A }5 e! p" q+ |4 H4 E( X0 I+ B y; ]
}( v- ~. x" N, E. Y7 U
bgR = '0000' + fadeOutColour.substring(1,3)7 h" [) V% T/ r3 U7 t) @4 u
bgG = '0000' + fadeOutColour.substring(3,5)
/ w6 @3 b0 ?' [9 W2 ` bgB = '0000' + fadeOutColour.substring(5,7)# z- F( P% r& F8 i8 M
currR = new Array(numLinks);* e+ ^* D. _0 x& P8 s+ o5 ^
currG = new Array(numLinks);% ?( O. e U; Z3 x% w
currB = new Array(numLinks);
5 q2 L* s/ i4 e count = new Array(numLinks);
" _. H* I1 a5 M0 \! A$ r1 b8 I fadeOut = new Array(numLinks);
" M5 }3 S9 [' | continuous = new Array(numLinks);' M* X7 `* V- M7 `7 t/ u
newColour = new Array(numLinks);: E5 D1 V! _8 O# q
tID = new Array(numLinks);
$ R% J9 N, y; b4 O6 W* e' T$ u. T redInterval = toDecimal(bgR) / numFadeLevels;+ {' y2 @$ f0 b4 B
greenInterval = toDecimal(bgG) / numFadeLevels;
1 h" u7 q7 N1 P blueInterval = toDecimal(bgB) / numFadeLevels;
* H! U8 I( K5 M6 k0 q initArray(currR,numLinks,0);1 ?2 V/ ^# r0 |* s6 b r
initArray(currG,numLinks,0);2 o% G6 G- W" n1 O
initArray(currB,numLinks,0); }6 X7 n- g6 {0 P4 \* [; P
initArray(count,numLinks,0);! U, r2 X( q+ w- C C2 Z6 V+ s' J
initArray(fadeOut,numLinks,true);
0 h& N! E8 S- x$ V$ y( P: \3 _ initArray(continuous,numLinks,true);2 J, Y, }; Y3 z6 S5 J$ G; b4 X6 n
} $ p& v0 Q- l n8 C8 ~
function startFade(id)
! [ Y! _( o0 v( j2 e5 P+ u( \9 s{; q/ Q. }* G1 i0 ]" `
if(fadeOut[id] == true)
2 v) W. L/ [# ? { /*move colour towards background colour (increment)*/
$ ~% B0 {8 r3 ~# e5 y b, Z5 w) I currR[id] += redInterval;8 G2 X) W# w' c7 z* l
currG[id] += greenInterval;2 s' N8 Y, w) M5 K: M
currB[id] += blueInterval;
, i% Z/ ~; ]% L: Z newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
$ X. H5 d1 u$ P* _9 g6 V9 {( G if(++count[id] == numFadeLevels)/ W( Y, I* x, O$ Z
{
; @" |) w, {- R% J! o fadeOut[id] = false;
) x2 ]5 @& k: p0 O* L2 X1 H } V8 f- z$ y9 H/ V7 V4 {, V) A* `1 {
}
; j! h7 y. M* W" l0 M else
, l* j7 l4 Z% D) M2 q! N {
8 U8 z$ n0 P% C$ O0 ?3 } currR[id] -= redInterval;9 x/ r! m1 k7 N4 m
( Y" B5 K4 b. r; s2 B* u5 t0 ]* N5 \ currG[id] -= greenInterval;! \- r! M2 S* L$ k" X2 ^8 E. `
+ k4 R8 B# h+ K
currB[id] -= blueInterval;$ R+ }1 \# _% W1 |3 w6 N) a
* f8 Y& g R$ c7 R6 x newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);5 W* E+ a- v' L+ K
$ j! u: Q+ Z+ M3 ^- N; B6 O
if(--count[id] == 0)) j) M0 [: W' Q4 z/ e) D
6 Q1 K/ [1 n& J1 N! x
{
3 k! H. b% [" O8 f' F
2 E& ?: {* u. i! }- Q. V6 g fadeOut[id] = true;& i' b' |! a( `4 D
: B6 s1 ?8 m6 B i1 h8 G+ l }. v0 T- X0 R7 e1 s4 U
' J/ c. v# l# w }: Y2 e7 I: E' F& u; X0 x A1 k* i
" E5 T+ f0 h, Y: L3 @) Y
if(continuous[id] == true)
8 ]7 C+ M# G3 R8 K8 E2 ]3 d. Z( _$ d- G8 ]% x S2 @
{
! ^6 q: V. d# F
) w% ]% N* s, I7 J3 Z; I document.getElementById(id).style.color = newColour[id]; 9 t$ O! ]' u- r J& ^
, d1 [4 t0 u) a/ s# i( U K) F8 w
}
$ r, S3 E. h( X" y4 X$ X0 B/ Q9 L, ?+ b0 K! T5 K4 D# s
else
v0 Y3 t v& k0 j1 J( H* I9 j
# D* g2 K; h$ s- E8 g9 g( a0 d( |' C9 V. \ {2 s3 H- N/ C: z/ j
2 N v2 A5 T0 Q/ f# T* N5 H document.getElementById(id).style.color = hoverColour;5 D$ Q% d2 d& P( P- ^
+ S2 ~0 K) ]$ W; Z6 v0 x, j7 R: X1 T
}
% y6 f, R& m3 y, z& L1 q' W8 {7 Q4 k. P' o ~8 o" b- S
clearTimeout(tID[id]);
2 d% H1 M/ Q2 R/ o N0 l- s; u( t9 P: j" W ^
tID[id]=setTimeout('startFade(' + id + ')', rate);5 B) }3 J( _6 i: J
6 R4 v5 S& J7 ~' x) W}/ m- T G0 m7 L8 w! l. i
( S) b+ L6 K3 K/ @+ [. Ffunction continueFade(id)
) z; K' x' I% L0 j8 h3 s# z- h7 ?7 Z1 `# U2 D
{
o7 y# A2 F- @3 b- ?* @ P, H/ l8 Q9 ~
continuous[id] = true;
9 A+ l1 |$ P# w, q0 n5 H
4 e$ N& p( o2 p* O( S0 R}
( V& j2 a0 |0 S8 H
- Z& a8 U" f9 |8 R8 ~7 Sfunction stopFade(id)
$ F, m! D: }! e4 H6 m7 U, X
2 p+ M ~0 T7 j# O" Y{
+ c5 N# h- H) O2 l9 l2 P2 u
) g$ Y# d* N/ O B0 e+ K continuous[id] = false;- K! a& E5 P9 ~' q, z2 ^
7 A. S! R$ B$ u' ^- X}" @% b, o. x6 \; z( E
* m3 b& e+ @& E+ G+ efunction StartTimers()
7 s9 B; w4 l. ]; M1 g. ~) h
/ ~! e7 }% J; `% M$ C{ //set up an initial set of timers to start the shimmering effect/ i4 v4 k; j4 q- d: D/ T2 D- p
6 u; j6 ^& s' c: a
for(id=0; id<numLinks; id++); ^0 O8 ~# m4 K; ?
) |1 r# u% A+ p, u2 ?: D
{
, V" e$ m1 K. v V
1 c/ Q* i2 Y$ p% X- C! h" l t=setTimeout('startFade(' + id + ')', id*100);
7 o5 x- h3 J" ~
4 {# Z0 ? w1 S' B# C/ d) ^2 I/ P }7 F0 l: q* c0 U- s" ^3 c
( m3 g) w" [8 D}
: Y& x0 i* e* O1 h) V: c% B/ r- |$ w! B! D* w7 U$ ?* @, @ G
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')9 e8 O/ a/ l6 K* M
" c; u$ j, V5 S/ t
initLinks('#FF0000', 6, '#FFCC77');. _' i, {, u" l4 C- J7 M! g: F& k; y1 \2 G
8 |$ c5 p3 t3 p. ]% a$ C( r
//-->
: r; l4 R9 W x5 c6 z, m( F+ ?0 z) e. R. J) m5 K* q, C" {
</script>) I2 K9 h' P" G8 R# P7 i: t' b# H( X& U
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名:58元
4 w2 V m8 @! Y# k1 K |</a>: Q( y* c1 `) d/ F- Y% D( E- P5 t
<br>2 y: l8 z# i2 N4 J! K+ b
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名:110元</a>
0 p# \8 s$ s8 M<br>
: z( L, b9 i2 n8 W: Q6 @$ n# L<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>8 @' P( @2 D$ ^& U' \$ Z' r) K
<br> $ f4 v+ n% T0 y8 M
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>' C: U+ e. d1 o% l0 U4 _' }
<br>
! S$ t7 g, W" S H& q( o<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
' V* e, g, b7 ^" x4 K<br>
' x$ l# ]$ P" h! q<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>: {& z6 H; D9 W5 R. G4 T" A1 v% X
<script language="javascript" type="text/javascript">/ q, C) `$ w" w! X; u
<!--
9 I- R ~6 E# ?& q3 E6 a: m( gsetTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering2 Y+ p& y8 J) a- D2 l# y
//-->6 _( I$ V6 B9 c2 c7 W, u
</script> |
|