返回列表 发帖

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

<script language="javascript" type="text/javascript">
) f' L2 E! k+ X, h% e2 U<!--5 a4 d4 O% I! w7 ]# b' F
// convert a single digit (0 - 16) into hex) e2 [4 p0 {" s( [& g) a% n1 f
function enHex(aDigit)
1 |9 J& A  T4 g. g0 N{  B" g5 Y; q8 s
    return("0123456789ABCDEF".substring(aDigit, aDigit+1))' V( \5 e  i- {3 O
}0 d. |3 ~: \5 p/ L
// convert a hex digit into decimal
5 X; Y3 N& p9 ]+ qfunction deHex(aDigit)2 @& L) P6 `$ G
{
8 T7 G% v9 R+ f8 t0 Z( d    return("0123456789ABCDEF".indexOf(aDigit))
! B3 Y, w( f+ g! l& ^' e}
) W9 ^4 H  V9 V+ I8 s4 |$ q+ \* e  ?0 q! B( p% B; d3 e
// Convert a 24bit number to hex, m7 d- R* q" U8 s9 m
function toHex(n)2 Z; K8 p" P, }% Z; u/ g" K
{
, U/ L6 e( A# T    return (enHex((0xf00000 & n) >> 20) +
7 e; N' Z! n; @, a" K6 L9 J/ @            enHex((0x0f0000 & n) >> 16) +2 S  ^: Y- S" y1 d4 q
            enHex((0x00f000 & n) >> 12) +2 P! n- L0 j' B+ E
            enHex((0x000f00 & n) >>  8) +# K, R% W+ i! R
            enHex((0x0000f0 & n) >>  4) +0 J  j. ?# S5 z
            enHex((0x00000f & n) >>  0))9 V8 X0 F2 k7 y. h# m( {4 n
}0 j  S7 W1 w0 p
// Convert a six character hex to decimal
* o5 `% F7 z; L! M8 g9 B' w6 vfunction toDecimal(hexNum)
( D; u! I3 J4 s& U{" K4 O6 A$ c) y+ f" I0 S8 J
           var tmp = ""+hexNum.toUpperCase()5 p6 ]1 q" B/ u& y9 n
    while (tmp.length < 6) tmp = "0"+tmp
: M9 c, }0 n. H1 U; v1 y3 D           return ((deHex(tmp.substring(0,1)) << 20) +$ U# t+ N5 u( L" R  Z; m0 E
                   (deHex(tmp.substring(1,2)) << 16) + # _. V6 A  C3 n! M  Q6 B; T
            (deHex(tmp.substring(2,3)) << 12) +
4 R: R# ~( |  _1 J9 L4 z            (deHex(tmp.substring(3,4)) << 8) +8 j9 b9 ]8 j3 l
            (deHex(tmp.substring(4,5)) << 4) +
, [& L+ k$ @* x                   (deHex(tmp.substring(5,6))))
5 w+ Y( L4 c0 D( `}' B4 Q! k/ l, ~* y4 h) q' t
///////////////////Shimmering Links/////////////////////
/ G* W+ o2 }, P$ Y+ D( T+ X7 R, t//global variables/ G# j/ u- ?" R3 R& v( f" A
var hoverColour
) ^" j) r: s) Z& Y$ `7 d/ {var numLinks;
. I# y( t+ L% j; {# jvar rate;
* |  x# y* x4 V# k0 z& `var numFadeLevels;
6 r3 k' r. M! y8 tvar bgR;
1 v: Z: G$ g  i2 @5 M1 fvar bgG;
2 I$ Y7 Z  ~8 k8 U7 bvar bgB;
+ r1 e2 `/ |/ _" I& a+ Lvar currR;4 Q+ \# k, r; {6 z; b
var currG;
& ~9 N# R7 X0 W! `# j# }var currB;
( w2 R) h" k! o( P$ W9 S" Jvar count;; K9 }1 v* A4 w! P
var fadeOut;9 n" _" C8 O& B! N9 S
var continuous;
$ N. ~: j; j( Vvar newColour;2 ]% u$ I% g! I6 e7 v  {3 v9 O. g
var tID;
( H3 k6 L5 q1 v% jvar redInterval;
6 X# T% d; k2 Nvar greenInterval;
' K! r8 t9 w; p4 D: _var blueInterval;7 @8 x! [6 m! [# F7 y
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)+ l( e+ P# g  L
{) J. o; }! E( B+ O+ g
        hoverColour = mouseOverColour;& ?* }4 S0 o* `( k( `' H
        numLinks = numberOfLinks;8 o/ Z: R* R& U# y' t7 D4 ?
        rate = 1;1 p7 T; Z* W- T5 S2 |
        numFadeLevels = 30;
9 Q" l3 C: K; s% M# p: n        function initArray(theArray, length, val)
* `. |; }6 |0 D        {2 p' y; x1 `! O/ g5 X3 L  g
                for(i=0;i<length;i++)) Q$ r$ e; E( O" ~* b+ e. C  j/ L
                {7 `, P; n0 I* Q
                        theArray = val;
  N7 G2 M% z4 u, E  u! |( {; n                }7 s) |4 N. T; d+ G0 \
        }
  k3 a( u1 E( j* r8 e/ B1 X, R' z        bgR = '0000' + fadeOutColour.substring(1,3)! x2 G. r5 l6 l4 }! U& O. ~
        bgG = '0000' + fadeOutColour.substring(3,5)
; A# ], f5 i- w3 H$ C        bgB = '0000' + fadeOutColour.substring(5,7)
% C8 V# u  z5 K' b7 v3 I: s        currR = new Array(numLinks);
6 Q3 o! y9 c2 ]+ v6 x- U7 z        currG = new Array(numLinks);- z& c2 l6 L3 j
        currB = new Array(numLinks);
0 R" G- m7 Q7 g0 M5 ]. H" ^        count = new Array(numLinks);: Y0 A& m6 f4 h3 A% L+ f1 I1 j
        fadeOut = new Array(numLinks);( P& t% N1 ?# l( |+ D
        continuous = new Array(numLinks);- s9 u( Y" `# E
        newColour = new Array(numLinks);% ?6 {- d7 l5 G7 u& T' [
        tID = new Array(numLinks);
  h: e- u3 f5 x9 a        redInterval = toDecimal(bgR) / numFadeLevels;
# D0 a0 m! f: W9 }, z        greenInterval = toDecimal(bgG) / numFadeLevels;
. k' O7 Q+ q. X; o9 l        blueInterval = toDecimal(bgB) / numFadeLevels;
( u- F: D% {1 e5 {4 @        initArray(currR,numLinks,0);8 W. \- C; K4 z( A
        initArray(currG,numLinks,0);8 E% n, T$ D$ d
        initArray(currB,numLinks,0);
4 ~) b4 k% p- T( X6 G        initArray(count,numLinks,0);
" s% v7 B5 _2 v+ m9 W        initArray(fadeOut,numLinks,true);
# K/ t0 y% n+ }! X- Q0 `        initArray(continuous,numLinks,true);- I, |# h3 j% k  c6 b& d
}       
; q# l1 Z" l8 k* Nfunction startFade(id)
0 I! Y: T( ?# Q+ U{( H+ Y7 B& ~5 j) ]& r3 n$ G0 q. U0 v
        if(fadeOut[id] == true)
' h  J- K/ k6 j& Z* W        { /*move colour towards background colour (increment)*/. j5 V, T" K  K/ F
                currR[id] += redInterval;8 n+ w( B: H3 k. {' x
                currG[id] += greenInterval;
3 v8 K+ i# A2 H1 R0 q+ t: v- `                currB[id] += blueInterval;
9 K7 w* \# l5 ?8 S5 N                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
! S/ w  O4 s6 n& {# Q+ G                if(++count[id] == numFadeLevels)/ p& Q: M, \# F( M5 J0 J
                {
2 R% m# C9 Z4 U" S% ]* q0 M                        fadeOut[id] = false;
9 a' R! C7 x( l: Q3 e4 |                }
# m' K& t" z, p. S. Q5 S8 ~0 k        }
% y2 r% ]9 z. U! L% z6 S        else
/ }* ]* @1 ?6 Z7 q        {
; ^' `' G4 [: l7 r/ x                currR[id] -= redInterval;' R) J) D  j$ ^$ I; S
5 M# ~% a  ?/ ^! F
                currG[id] -= greenInterval;2 j, s7 o7 i7 d

* o+ |+ R4 E+ W' \                currB[id] -= blueInterval;; y5 Y9 a4 y9 m0 W2 ~: }* A- K

! Z; o  z2 x- f9 K1 A9 N$ F                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
9 R* m. f. G6 Y8 d$ b4 S" U8 A/ k3 Q5 h% z: @+ W
                if(--count[id] == 0)7 \: Z: T1 Y: o3 p- E
" M, B, t1 M! }; N) A; O
                {
: l  U  V$ e" T% s3 r3 O
# F  ?9 K6 h1 N6 Q9 X0 C$ X8 p9 X                        fadeOut[id] = true;/ m  I' ~. t) q5 a* P* ?

/ a7 i( @- [1 t( L) y) \                }
/ a0 Y5 ?  j3 C
& R) N7 y( K. L  n# Z  O        }
7 |+ x3 i! c  }" X! y4 Z; f- S3 z2 L0 y, B- J& X. {' ~
        if(continuous[id] == true)( U( K* z. K9 `3 V6 K
; B; h: S# ?) Y0 F
        {5 f' `/ h! V) A3 O& R5 g
; y" h! H+ j) b1 {7 Z
                document.getElementById(id).style.color = newColour[id];               
8 I% o$ W- b6 _4 \3 o5 r
- S9 g8 R* |/ @2 W4 q        }
# X/ o" b4 M. ^- U6 O' P: Q; _( N# `. ?6 B# \) j) I7 C2 N
        else
* c. \* g. r: E1 x; Z3 u; o1 d6 N- J8 Q& V7 g% i
        {. V+ a* R# c' o2 d+ ]) Z
0 d- \$ i$ w" V: n* r- p
                document.getElementById(id).style.color = hoverColour;7 r  i# X# P' q8 S" d! K& R+ B
' z4 }9 @9 o7 l9 ~
        }9 J$ s4 h3 e( @7 K. a6 m

7 a* v& S9 C& }" ^        clearTimeout(tID[id]);
; [9 W8 C' u$ F* e* a/ n) f
: ~6 L' T/ B3 w1 i, X: x( k        tID[id]=setTimeout('startFade(' + id + ')', rate);
5 J+ l. N+ i2 ]) R) ?" z' Q! C' @* {, _0 S% B7 S6 d
}
. }$ R3 |6 t5 w0 L: C( a: P& n9 y# [$ A. g9 p# A& I
function continueFade(id): o6 m' b! R) D% K
# m7 h% q; x) {: H% w5 a, B
{
6 C8 s% m2 t% ~# w# f
1 e: I+ e2 c. f        continuous[id] = true;8 d% B: h) C2 X! c. {. s

7 L+ V: u" j* p+ s; Q}" r4 _- `& U2 \0 e( x7 [
8 r% L8 \! N0 I, ?: }7 L
function stopFade(id)- z" a/ m9 [4 U& {2 w4 W; Z) V) D

/ ~' Z- I  R, x9 t. t9 [{
% T/ p# |1 _% D- H- @2 x( l/ W9 |
1 E0 t3 Y3 p! l        continuous[id] = false;% @5 B1 @- P& d1 K( X

0 g9 R0 R. k7 J}
& A- c' I& }& C) i0 R' [, b9 h$ ]: U
function StartTimers()
' X4 m9 v* k; @% X, X$ A+ l7 O. V2 h, F+ v/ a
{        //set up an initial set of timers to start the shimmering effect  k- Z0 O! ^2 c/ W( r9 W! J

* B* ?9 H3 m  ]) R        for(id=0; id<numLinks; id++)# A5 R; L" Q. _9 d

# g  ]( Q& ^1 O# x, r0 N( `5 Z        {
; W. ]+ i% g* K- l+ `
& }3 C" w- F; y, y* t* g+ i% J                t=setTimeout('startFade(' + id + ')', id*100);3 g! Z/ K6 y8 k- v
  e8 e" O: Q) \% S6 P, M1 i
        }% \8 n" Z7 {7 k4 i; b+ _2 a! g: i
2 K6 U) `  ?) ~
}3 B! H4 n* A- ^
' i$ F4 |7 b; J$ U# Y* q* R
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')0 ]8 y5 R& T: v' |6 |

7 s  u$ w: F! m7 W, c; K# UinitLinks('#FF0000', 6, '#FFCC77');
5 _" o+ A; V5 j# H$ h1 V$ N& m/ U
//-->0 E+ F: o0 k, k$ T+ x6 S) }

8 Z' m5 [- Z5 `8 g1 @* z9 T</script>2 B$ ^$ }* @3 T
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名:58元7 V/ _3 k7 d2 D" B- u& Y" @
</a>
$ A" F/ M# f' g; h<br>
( k" e+ w/ L9 d# W<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名:110元</a>. e4 k( W+ X5 U+ E" w* e. p
<br>5 h% G% e# d1 \& z) ?, T. O
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>, l( s5 z$ }4 t0 \6 H5 N/ @
<br>       
5 d: `% S8 b2 {% S3 `. t) E<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
/ t2 Y, l9 O& D$ B* i' g  z<br>5 E4 Q% I7 g" F* l2 v
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
/ x5 p0 @1 b6 B! N<br>4 v& d, I2 v# D3 S
<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>& W2 s+ T9 t4 K: k" o# E4 M
<script language="javascript" type="text/javascript">" J1 r6 P5 R+ ?2 v- B# m, X6 \
<!--2 r2 R. m) {7 ], y% K
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
6 I5 b) m0 }/ y6 ]3 v; z//--># N, o, ^' |6 w% B+ Z
</script>

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