返回列表 发帖

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

<script language="javascript" type="text/javascript">6 T  k5 f$ ~. i/ A1 `- x
<!--) o  k6 {  V. X+ j: P7 j& E$ y
// convert a single digit (0 - 16) into hex* r& }: x1 i, i2 ~7 ~1 o1 Q, O4 j% K
function enHex(aDigit)* e' ^; m: }" j0 {' j3 P" c
{. {9 E0 j! f9 B9 F3 |7 ~
    return("0123456789ABCDEF".substring(aDigit, aDigit+1))" d# V* X% m6 B: h
}
  L7 C! `# V0 Z2 ~: i8 \2 S// convert a hex digit into decimal. X. k: f  w. R3 j1 X
function deHex(aDigit)* }" r0 E) p' Y! `) y& T. V0 @5 Y
{) m7 W& X3 W  E& z5 c9 `! ^/ m& x% f
    return("0123456789ABCDEF".indexOf(aDigit))0 T' p, ]4 n' B6 v5 b
}
" {5 n  L) p5 D# Q) q$ V+ N3 ~' M+ p6 }4 a3 ]
// Convert a 24bit number to hex2 u0 {; N, L2 p- l' X$ x  k8 i/ L
function toHex(n)( O6 G# ^9 r" [( G# z1 v
{" X' Z7 ^. a( J  k: `4 F
    return (enHex((0xf00000 & n) >> 20) +
; Z# |2 R, I2 E8 ~            enHex((0x0f0000 & n) >> 16) +; q5 k# l6 Y' w/ Z
            enHex((0x00f000 & n) >> 12) +. E' m8 v, p1 \
            enHex((0x000f00 & n) >>  8) +: T0 P$ U- Y. h; c/ G
            enHex((0x0000f0 & n) >>  4) +
! K" R. J8 ]) N5 c% y1 C- r. `' g6 w            enHex((0x00000f & n) >>  0))
8 I8 O2 j+ J7 X& Y' p" x5 s}
0 K9 |% _. N: f, \, t// Convert a six character hex to decimal
* r$ K3 h" k5 s: L, x( lfunction toDecimal(hexNum)% x* a* ]* k( T0 Z
{. o- g$ i1 F5 t+ ?8 J
           var tmp = ""+hexNum.toUpperCase()
4 Z4 I" X( s9 }% y$ O    while (tmp.length < 6) tmp = "0"+tmp
' w$ L, y& K2 r1 J, }6 U4 `. d           return ((deHex(tmp.substring(0,1)) << 20) +
- u! l0 r# D$ t+ I, O2 D( b                   (deHex(tmp.substring(1,2)) << 16) + 6 \% S. t5 [2 E! H
            (deHex(tmp.substring(2,3)) << 12) +
7 E; \9 m9 {, T2 g$ ~+ x: l1 @            (deHex(tmp.substring(3,4)) << 8) +
9 \6 ~8 R6 `. w1 [( a4 W            (deHex(tmp.substring(4,5)) << 4) +. }( N/ z5 F& V6 {" V9 }5 v
                   (deHex(tmp.substring(5,6))))$ H- N1 x- o2 Q& l
}
( v7 X( M. ]3 e6 `6 J! O///////////////////Shimmering Links/////////////////////
( y+ u5 ~& c- |/ _7 [7 |//global variables
9 x  o- W; A& m9 w8 S* h- Mvar hoverColour" d7 W' x+ I$ I! P4 ~, b
var numLinks;6 I! z( ?8 [1 Z, T0 g5 F9 B( i
var rate;1 J9 u; b# a1 W0 ~$ ~
var numFadeLevels;
: ]- J" z* e; Y& P( `var bgR;% [; i3 b7 Q5 @9 v9 \
var bgG;# W: h9 v- K& e4 Z
var bgB;
" H, F2 Z: l& pvar currR;
+ s& \( o0 j# [, _& Kvar currG;
7 b5 D8 A) x2 P. Q2 ]# X2 \, Jvar currB;' i/ F# J! L! `+ f
var count;
6 ]7 T* e( d% f2 Cvar fadeOut;; l$ K9 Q! @4 L' B* g; h1 |2 `
var continuous;
& o& }' C- t5 |% ivar newColour;
4 K0 N& Q/ Q  {" Gvar tID;  D, M  H! ?8 c( {" y+ N
var redInterval;
( ^& I- ]1 Y- \" B# ^! A1 y$ Cvar greenInterval;: a4 ~/ N: H  G7 o5 S/ o
var blueInterval;
% X3 d# {; A4 e9 X2 E4 Sfunction initLinks(mouseOverColour, numberOfLinks, fadeOutColour)* s# S) W  a; W, N6 }
{
2 O/ c! }4 U/ ^* `& b- T# d* f$ q+ I        hoverColour = mouseOverColour;  C% V! r8 K+ J1 ]: h) K! J
        numLinks = numberOfLinks;) ]. d; F' ?* d( w7 l8 J; U, R+ |
        rate = 1;- \; @( z, \0 g+ D; [. h3 @6 c8 F3 g
        numFadeLevels = 30;( g6 H1 P& c6 i4 H
        function initArray(theArray, length, val)  J7 e3 g. W0 B0 S$ q: c! O6 L; b
        {
0 f3 i; Y9 [& T+ X0 ?                for(i=0;i<length;i++), h' Q" E2 }. \' `  k, p6 X' F
                {
- ~3 p1 U7 x9 @$ q                        theArray = val;
5 R$ }+ e# D& C6 n( [                }
  Z# G% p" V& i# p6 `        }
+ V5 a$ i6 Y! k# k2 [# p/ J( J        bgR = '0000' + fadeOutColour.substring(1,3)* I$ Q+ B4 O# h! ^1 d, s
        bgG = '0000' + fadeOutColour.substring(3,5)
% @" P6 `) X& o: O  Z' y        bgB = '0000' + fadeOutColour.substring(5,7)
1 a; i/ D! c5 G( a- F6 I4 y/ Z        currR = new Array(numLinks);( t: x( b1 Z9 {
        currG = new Array(numLinks);5 ^: s  M. i3 W) ]
        currB = new Array(numLinks);! m7 P0 B  I- q8 u7 I% _0 N
        count = new Array(numLinks);# I7 l2 `$ ?6 o: t1 V5 }
        fadeOut = new Array(numLinks);5 I: D4 i# Y& L5 \+ ~
        continuous = new Array(numLinks);
- S9 W& l6 ?) Z  C3 p* Y        newColour = new Array(numLinks);$ Z/ a: ^5 e4 C; R2 L
        tID = new Array(numLinks);
1 j+ l& i$ o9 o$ x. I; Z- D& ~! W        redInterval = toDecimal(bgR) / numFadeLevels;7 W- @9 H; \1 u/ i* q; U
        greenInterval = toDecimal(bgG) / numFadeLevels;
* D; U" w  O0 i- K9 }" Y* x4 F        blueInterval = toDecimal(bgB) / numFadeLevels;
. f) P! e% _6 [        initArray(currR,numLinks,0);
5 C4 p" T2 t) G( d' D        initArray(currG,numLinks,0);+ J. {4 o* Q" s- Q8 n! i0 y
        initArray(currB,numLinks,0);
) Z" r5 H: Q$ J8 f" J        initArray(count,numLinks,0);# [$ `% B1 x' d! c/ Z/ X  x
        initArray(fadeOut,numLinks,true);8 O) U( S$ x! d
        initArray(continuous,numLinks,true);5 y# ]# |( s; I. Z$ t
}       
9 r( {0 i. t3 X) mfunction startFade(id)0 o3 P7 r2 z9 p+ Y- N4 M
{3 T" t' D$ c  F3 N& l+ f
        if(fadeOut[id] == true)
5 ]. h* A! I1 r, c4 b        { /*move colour towards background colour (increment)*/
  O% m. F4 k& [                currR[id] += redInterval;
) L1 n0 c, w( @( E0 \: \* f: _                currG[id] += greenInterval;; Z4 k( H8 N& s& k) e+ o% D8 D
                currB[id] += blueInterval;
2 |' |0 {( K& g7 |0 n                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
4 N% t* I1 u$ {# A+ C8 T! ]                if(++count[id] == numFadeLevels)5 o* F& d+ }; m* ?5 p
                {$ I+ e) s8 R' V
                        fadeOut[id] = false;8 \* `7 B# t. u0 G0 ?. g
                }6 Q4 w' T6 @( W& R% Y
        }
$ m: `1 u& z3 y$ w5 [        else% w, M% ]. B- _5 A
        {
% w  R3 g  K4 E, Q5 o7 ~                currR[id] -= redInterval;' s. O# w0 g- Q

; }4 x3 v9 N6 M6 ?7 I9 q- a                currG[id] -= greenInterval;
/ h! B4 q6 O! k* l  U2 r1 w; {* J* p" A% x$ b5 M. q
                currB[id] -= blueInterval;
$ I* v. i- ?% e$ b) w+ a+ {& ?" b0 M$ r
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
! p1 o4 T& x% u" n4 l
  ?. N& u  K% {                if(--count[id] == 0)8 Q/ [% P: S! ?6 p& {
- r. d! f% b) _: h- p% a7 M
                {& j1 v' t& @2 P5 j

* ^3 p" I5 C9 s0 C1 Z8 S/ w, y% c$ Q                        fadeOut[id] = true;
! h- |3 w) s% T6 e& s
, q9 V% V5 Z7 b  p0 B                }) I( R6 W' o0 w& r/ n

: s. E! T/ X) ?6 f3 S) c        }- D  w; e2 E( S: E( k  g
5 J2 N4 Z1 u! P! x6 s* ^) b6 n
        if(continuous[id] == true)
  H3 o, y( ^) J9 x; I1 i' W
& R* ^" ^+ B6 H  u4 ]        {
- U5 K  @, a. R# o, y/ J, D
' C' L, `* s& s! d7 s- s                document.getElementById(id).style.color = newColour[id];               
; u' x) m. `4 t/ e* C
* z7 @9 }! `$ O  T3 c( X        }; }8 @  I7 A: ], O
; o- ^( g7 Q, s3 h$ D' Z8 ]) K. A
        else
' \! H# b# I9 S) k8 c; y7 \* d! E: V
' a8 ^/ I8 U7 f* c8 T7 w" M% O        {6 e- Q0 t" A" R/ ^3 R+ C
+ C( a6 s9 J" ?. I$ z
                document.getElementById(id).style.color = hoverColour;
1 w4 p, e; K& ?3 F& O6 w1 C1 U8 A0 H
        }
7 |4 ~1 X% c( ]% J2 l$ A9 S4 @* }
4 `' m! l! g* Y+ u        clearTimeout(tID[id]);
( t( O" Q1 M+ U1 U$ q) t- k) D+ h; S- D+ b# j* {
        tID[id]=setTimeout('startFade(' + id + ')', rate);
  P! r; w6 J4 W# i' s0 K, b/ G5 i
; A2 S+ L0 |' M7 _3 z}
' b9 j( \  l4 W! N7 b5 r! D, F/ A. j3 w, _7 M0 P' R2 D/ F
function continueFade(id): O8 ~/ R/ J/ x8 e9 Z
) r+ \4 I/ J8 y
{4 @% y+ y# s- Q9 |2 z( F% c+ |

" T9 `7 L1 _* k/ ]        continuous[id] = true;, `' Y" C/ A7 j8 L4 K

/ X% Y* j9 K+ v}
. U. q2 _$ y, w' F' N/ s% J" V" b; ^6 J* V
function stopFade(id)
, o. O! `: T1 Y, H! a
% k! V" w- B& ]{% l4 s6 y$ i0 Z( s( U

. K8 l! `  H3 p% ~        continuous[id] = false;0 S9 M4 \0 F- ?
8 ]( Q6 s: o% F+ t3 }
}1 h! E  u5 S; d' Z: y

' [/ F; l$ v2 Lfunction StartTimers()- F' l. m& E2 A% F
$ m' F8 u# `% a0 ~3 b3 t- q/ `
{        //set up an initial set of timers to start the shimmering effect
/ l( z. e6 O5 o+ @( K- v8 M7 w. f7 k
        for(id=0; id<numLinks; id++)" C! l8 s3 k6 C* ^; Z' t
/ q8 D1 h9 y. E
        {
8 O# r/ ^; h" a6 e5 @+ T
0 R0 n, c, Q, W/ P0 e                t=setTimeout('startFade(' + id + ')', id*100);+ |2 T# K6 J8 Y8 k/ K: Q! B

% ^$ Y+ M/ ?1 a2 b9 L        }
; ]* T) D$ J# G. u) P6 O- y6 E/ I% D
}
% ~. a+ m; T# B- S& ]8 q* d1 K+ P5 N5 x; h
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')( C, e4 N  p6 F; L$ s" ?0 ~

/ F+ A" I, o" P2 T, b+ AinitLinks('#FF0000', 6, '#FFCC77');) A, u6 Q, [8 F! p

* p0 ?" S3 x+ U3 k, g//-->
; W$ ?* a: h& n) `, k
8 Q, V9 g) f) Y& J' _2 \- c+ e</script>
* B+ g7 D, e3 n! v" M<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名:58元
, T$ U; q5 {6 J7 i: D</a>: J8 t2 i3 d, z" Z% h1 n
<br>
. @7 f! g( N- w3 A<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名:110元</a>. c% N- W! k5 U5 d8 E- @
<br>
8 R; z3 @' m% j' Y. X<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>$ k# B) y* g) l; P- j+ s
<br>        + Z! E6 C6 J, b3 @$ w3 W! H: v
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
; A2 s& t8 Q4 y1 w<br>% u. W3 r6 L3 p3 b: G* `. e7 h# b' _
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
! ?1 i7 N& q# {* Q) K<br>
/ r2 G: I5 y! t<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>
. O1 k4 r5 Q- z  @% ^& ?<script language="javascript" type="text/javascript">5 x' f+ v. ]3 O  u7 K
<!--/ Z% q" g3 {: D
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering) `3 N3 I! G% Z& h/ {+ T! j
//-->
4 g) N. t" T8 H  R- k1 i</script>

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