返回列表 发帖

网页之文字的循环闪动特效

<script language="javascript" type="text/javascript"># ]/ s  |6 ~; r% @0 m& c6 z
<!--2 M+ R( ?: ~" X, b% q) c; i
// convert a single digit (0 - 16) into hex2 ~  F. ^. B$ Y8 V3 t1 G  ?7 @
function enHex(aDigit)4 r' ~5 t+ F& f" J) h0 F: n
{
' n' ?5 N8 N; A% {6 Z    return("0123456789ABCDEF".substring(aDigit, aDigit+1))9 q: S$ a' Z1 ^5 d  C% ~- o
}
1 R3 b) l+ I3 \, R// convert a hex digit into decimal6 v+ W4 o- }/ \, Y! @! |( m. |
function deHex(aDigit), V) ^. a5 H6 g4 X
{* A% }) d% }1 ~2 O% |' _/ o
    return("0123456789ABCDEF".indexOf(aDigit))3 Y( ^; k( `$ _# K0 G
}* k' N/ o9 j, E
9 u! e+ K0 c2 Q  `# f
// Convert a 24bit number to hex
# i  G. {9 i1 Efunction toHex(n)" i1 b  s) F6 _2 \" B3 s3 ]
{
) r* e$ e. R) `! N) P8 K    return (enHex((0xf00000 & n) >> 20) +1 P! m" Q; Z' F+ D5 F, @
            enHex((0x0f0000 & n) >> 16) +
' ~7 M5 r9 X1 B0 E2 M5 `; L6 g            enHex((0x00f000 & n) >> 12) +( o7 c- i) R' U; A
            enHex((0x000f00 & n) >>  8) +
0 o$ s* k5 Y7 T* ~' J4 o            enHex((0x0000f0 & n) >>  4) +
/ \" n- \7 S& y            enHex((0x00000f & n) >>  0)). i5 s' r6 n. M/ E
}
0 A! u5 x1 _: t3 K% q// Convert a six character hex to decimal3 w& B% u! o3 @- U7 _
function toDecimal(hexNum)
+ j( r3 _: o' g' p' k; G4 _{
+ m# \+ g+ P) c0 j           var tmp = ""+hexNum.toUpperCase()
. ^( S0 v( ?( b7 i' F, l6 G    while (tmp.length < 6) tmp = "0"+tmp) Q) ^5 u: \/ Y8 m% E: B" C- m6 s
           return ((deHex(tmp.substring(0,1)) << 20) +
+ d# }6 _6 A0 P5 X                   (deHex(tmp.substring(1,2)) << 16) +
+ h' O8 {+ _" h7 r1 c1 g            (deHex(tmp.substring(2,3)) << 12) +
# u: D+ W  T( ?3 q# V            (deHex(tmp.substring(3,4)) << 8) +
! T7 h" [% ^, f3 T+ }3 |            (deHex(tmp.substring(4,5)) << 4) +8 K8 e+ p9 f* G) M  Q$ s; r( ~
                   (deHex(tmp.substring(5,6))))& W& G2 K# Z7 a8 T% j) V. P
}) N1 g' X; t! x
///////////////////Shimmering Links/////////////////////
2 k# ?# R. R# n//global variables* l* \: r& d' g) G8 h
var hoverColour
/ E9 K! F" L% X+ v& a" Avar numLinks;
- S3 f' `& M5 `! Nvar rate;; p* s$ o7 Q7 U1 k+ P1 L. ^
var numFadeLevels;
% Q5 u, q; ]4 j; V* h8 nvar bgR;7 F5 |6 e. o" M3 L3 q
var bgG;
+ {5 X8 ~- Y+ e/ L6 L; |, r; h4 Vvar bgB;) z9 @" N6 G5 _/ ~
var currR;
# b* q6 i+ U" [$ Fvar currG;
& @; m2 P& U: fvar currB;* b. o# a' d) L8 c0 z
var count;
) N+ ^- D/ h8 v% Y4 N7 zvar fadeOut;
1 t7 o/ x4 J3 O. u3 p, c: `var continuous;8 E- y) x. r% W
var newColour;
0 n7 F) {/ Z' h  P: s: ivar tID;! Y1 g$ `( p6 E6 f7 ~. q
var redInterval;5 Q8 ~3 E" B& a6 T: I9 Z$ J" J
var greenInterval;8 _" p+ S# h0 Q* ~* v& |
var blueInterval;
1 a8 r$ t6 ?$ X' O3 Efunction initLinks(mouseOverColour, numberOfLinks, fadeOutColour)2 i' S$ Y9 ^" u% w& @# y1 |
{: J& y6 v7 ^; j; E
        hoverColour = mouseOverColour;3 d% U1 Y$ k) w- o" c. @/ D5 H# u2 A
        numLinks = numberOfLinks;7 [" G) ], `2 n& [! z5 U
        rate = 1;5 V# i5 _7 f) _
        numFadeLevels = 30;
! O+ d2 D. {/ M7 R, g        function initArray(theArray, length, val)
0 @8 n, r. C( }! V        {
* P3 X' H" @+ N) s& u                for(i=0;i<length;i++)7 F7 G% {+ {4 c# e0 ?
                {
1 z; ]' ]- _4 `2 d' \5 \, P& V  C                        theArray = val;
" ]" u& C2 e$ d7 f                }
8 ^! E3 `2 X5 n+ P# n        }! t7 s3 _) d8 v8 a- O) S, h/ x
        bgR = '0000' + fadeOutColour.substring(1,3)
2 z8 U" W" i9 ]7 P! C7 M2 b        bgG = '0000' + fadeOutColour.substring(3,5)& n, {- F1 a3 Z! q( |; _3 t
        bgB = '0000' + fadeOutColour.substring(5,7)
# Q9 y8 q3 K( J/ t/ W) A7 O5 Q0 I        currR = new Array(numLinks);
5 Z) v- Z. y3 \        currG = new Array(numLinks);1 J/ U; d( d/ g9 c% y" U2 d$ w
        currB = new Array(numLinks);
& S* }1 v. E" [% P        count = new Array(numLinks);/ J4 \" R8 u( Z
        fadeOut = new Array(numLinks);
8 p. Z! B" k! N9 J5 F        continuous = new Array(numLinks);
* v& \% b9 x8 V0 o; p        newColour = new Array(numLinks);  I5 X& r- F+ [. C
        tID = new Array(numLinks);
# n$ ~4 w) A% a0 S9 h& |+ b2 q" I- s        redInterval = toDecimal(bgR) / numFadeLevels;
2 N, z% A8 U9 E5 A/ q( G$ K2 r        greenInterval = toDecimal(bgG) / numFadeLevels;
6 b& \7 A; T3 b+ @' V6 Y) {2 D        blueInterval = toDecimal(bgB) / numFadeLevels;
& X* k9 t9 o; I/ H  {2 r% p        initArray(currR,numLinks,0);: [8 D3 L1 x" d5 F+ B% v
        initArray(currG,numLinks,0);) ~7 P& F, Q  r# L$ q
        initArray(currB,numLinks,0);* K5 A! y" A0 ?' s
        initArray(count,numLinks,0);: A- \0 ~0 S+ {0 t9 z  s1 c
        initArray(fadeOut,numLinks,true);
9 q. k; w) i. L- e" x+ u/ h" I0 ~3 S        initArray(continuous,numLinks,true);2 h' a% g5 U# O8 p* {# X
}        : P; n% |4 u' i4 B* ~4 w7 g
function startFade(id)! o. q) H$ {) m2 R
{6 E+ J6 X% E* p1 B! r) c! D
        if(fadeOut[id] == true)
) P% R7 e* V7 J0 I0 y        { /*move colour towards background colour (increment)*/6 U6 z# x4 O# ~# [+ J
                currR[id] += redInterval;4 O3 b9 O& h( Z/ L5 d
                currG[id] += greenInterval;
8 x* }' f0 I  L$ `$ ]) P% r                currB[id] += blueInterval;  Q- Y4 V% Q" Y$ t
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
. L" e7 v$ k* L, e; u: y$ y7 @                if(++count[id] == numFadeLevels)
8 Q! f7 v3 v: W6 w4 o) k                {
& g# X2 l: y, P! t- C                        fadeOut[id] = false;
, T5 C2 A; K) U9 A: g                }9 C& g* Q, O% T) D1 t# m1 C+ h8 ]
        }
% {$ n" M  H: p6 x4 W        else
6 l+ S' `/ @: x9 W4 T        {
; M* L) n9 h1 P& E0 V                currR[id] -= redInterval;
- b) O3 E# g3 C6 j+ ?% ?+ k" o6 T( W2 l$ X, V" l/ b
                currG[id] -= greenInterval;% \$ Y  P  p+ ?  H. L

6 @: b7 x$ p4 E/ R+ }  g& ~                currB[id] -= blueInterval;" L0 O6 D) @+ z2 t; n, M4 V4 n  i% S

2 v. \" e0 i2 i+ R1 ]0 e                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);# i$ j6 k. Z8 W& I
  j2 L. r( q1 v! J8 `
                if(--count[id] == 0)) }$ I) h  g/ \; j
: l, g; V" B1 s9 y* c1 B5 b  ]
                {
  G8 [' G' z8 j8 H" Z, E+ `  r1 ?( K  h. b0 e
                        fadeOut[id] = true;; f' H; k2 @: M' m# h) [

) P$ |3 X/ O/ e+ H: Z: k                }
& r7 r' Z0 a# K4 x3 L4 E. C5 a+ T
- X* v2 n; u3 }) k6 j& A. h        }  Y  y$ ]' c/ ^1 t! K0 |) k9 m
1 l* _" J' l# Z- N4 {/ a) o! i
        if(continuous[id] == true)
2 O2 e3 H1 s  f( }! |2 f& r' a) y
        {
5 f) f- v% U2 j  U  ^
. `; b' m# c# J$ `1 W: D                document.getElementById(id).style.color = newColour[id];                6 Y4 G2 L  ~3 A) O$ }' P

% m& F2 U* G8 F/ M        }
& F$ ]! f: ]" S' p! n# H4 f
: L# J0 R9 O& Z* K        else
& H" U4 B' S3 X! d, q
) R2 o% x' s6 s0 R, y9 s        {0 D# L% ~9 f% J  g2 L

( M1 l" k+ ^) j/ U0 z                document.getElementById(id).style.color = hoverColour;
( H; \  e6 L# E5 b6 F6 y( ?) \5 H% ~% H
        }/ |, `$ z2 L9 T0 e4 s# q& p  N

, u- m) m; n5 G        clearTimeout(tID[id]);
4 z( R- A) U" @( i
6 _5 `+ {3 [8 v* \' l2 E        tID[id]=setTimeout('startFade(' + id + ')', rate);
; L# q% @3 l7 y* U
% I6 B. E; _6 p}3 G9 H2 i% F' p7 N) B; W. w7 D
* t2 @# q8 M3 j/ l; ~# R& @
function continueFade(id)
. s& Y8 H  f( V' y5 M5 @7 D* \
3 ?- D: `& d$ `& i8 V. M{7 C" Z: k9 r, U) x7 a3 U: T
% r" |. J7 m) M+ C* U& p9 i* _
        continuous[id] = true;9 @2 ?) U8 x: Y: H

+ Q0 ^' C2 \" {}' X, l' ^3 M& f; V8 R
3 {9 V0 q. |3 C1 J) P! h/ @
function stopFade(id)
# r# s7 {! [( m; B) ?1 \. c+ U, l! A  ?+ `* `
{8 A8 u: V3 _; C* r+ V/ l' x% l

% h! b6 p6 D6 z( b        continuous[id] = false;; _3 X$ }8 D; N" U( a0 w
; B8 w' e2 c1 P% D& Q
}
/ a- V8 g. @" n+ |- _/ i" G9 l1 V
1 v  s+ z8 O, c* n  k3 W. Ofunction StartTimers()
1 e/ A/ q2 ]: m  U# C" s) ]* t2 l" G; j, b2 a6 S. _/ u0 O
{        //set up an initial set of timers to start the shimmering effect
$ J% @2 i0 c; e5 X  R# ?0 a1 K
! |' R# d7 j' {4 ?9 \        for(id=0; id<numLinks; id++)2 a- ]4 e( i2 b9 J4 v+ o
& b! V& q8 q# U. X
        {
/ n. [. v6 A2 y1 ]& s
& U  }  V4 o. ^& h: Y* g1 I1 s  _                t=setTimeout('startFade(' + id + ')', id*100);2 s; u9 r  A  y* p0 T- E9 e
) c& C1 ^1 Y3 P$ w4 C+ l$ L1 @
        }
( s6 A3 b9 O' l5 ?) y, ?6 ]% ?) e+ `9 f' j2 Q
}  K2 J0 G9 _. O' t* f
% [( z  z2 a- p% \/ G
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour'). s6 G& _+ F; A5 j8 k5 P" [9 H, {
: n7 L, P% l) N
initLinks('#FF0000', 6, '#FFCC77');$ r) W. u; u+ [

& J$ A; l: R6 f% Z, _9 E0 B4 G//-->
5 t/ `# i- w! p4 _2 g
3 I6 E/ f3 i( j, K/ b: ~8 e+ S  V</script>. {) P9 e" R. _, c3 T, `7 \6 ~
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名:58元4 N# }. u) g8 v+ t6 L" p& _+ m$ b% V
</a>+ g9 j7 b- j  x  |
<br>- \$ D' C5 H0 [8 O
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名:110元</a>
; U+ ~! p" q% e0 T/ C% y( `' N<br>* G5 {- [% d; H
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>" Z* j7 e9 O5 P* s: a6 S
<br>        " O4 M6 X9 M# g( `' {/ }$ C
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
. O+ t% z" q  |  |5 n<br>
5 }7 ?" V+ t3 Q1 `- {$ O4 D' v1 |<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>( N6 I( ~9 J0 C0 T* ~; H+ L
<br>
2 ]6 x/ c9 ]  {# n& X<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a># a. {) n: j" v; ~9 N; l
<script language="javascript" type="text/javascript">$ @- {9 _% a% p9 r
<!--7 \* J8 ~+ h% {& O
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering  E$ M" o" J  {8 I
//-->8 C" @+ d% j% ?% _9 W, |
</script>

返回列表
【捌玖网络】已经运行: