返回列表 发帖

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

<script language="javascript" type="text/javascript">4 @6 J3 K! u7 Z
<!--
) ?# }, a" f5 L5 T4 E6 H3 M// convert a single digit (0 - 16) into hex' j- E- ?/ |/ u5 V" H/ ?" i
function enHex(aDigit)
' ?1 `9 k9 N! x{
* I0 X% l+ H. V# k) a+ I    return("0123456789ABCDEF".substring(aDigit, aDigit+1)); z$ n: I* [! w( b( ^) m
}( c8 C# z% r6 K: \' y- P
// convert a hex digit into decimal: e8 p' W6 _' T! K
function deHex(aDigit)1 l# M5 O* @" m6 ^/ ~
{
4 d' m: C0 a, a* a    return("0123456789ABCDEF".indexOf(aDigit))
7 g4 W9 C+ q" O# B- q- z( H}$ c, V: J8 V, j7 k5 y6 \

: T, ]5 L+ H/ n! t6 ^+ J1 d. Y// Convert a 24bit number to hex$ M- ~$ Z* J, c. Z, H3 l6 u
function toHex(n)
) _0 @/ ^( }3 R( `9 f{
8 q2 e: _% Y3 A' F$ d    return (enHex((0xf00000 & n) >> 20) +
, T9 b1 H) N* O- e1 B# {& `            enHex((0x0f0000 & n) >> 16) +8 `4 ^+ u+ S3 ~: U
            enHex((0x00f000 & n) >> 12) +
/ k2 R- ]6 \6 D  t            enHex((0x000f00 & n) >>  8) +
7 q* l( B2 h( e            enHex((0x0000f0 & n) >>  4) +
; z9 a& ~% V: E- \7 u: W, [            enHex((0x00000f & n) >>  0)). x7 \* u6 z: i  H1 c
}+ t, |& B# q9 c) w% k
// Convert a six character hex to decimal
$ d2 y; W, A3 nfunction toDecimal(hexNum)
8 p/ a1 d! Q1 ]0 d: m0 ]. S{
4 U9 I' b; |. H( @! Y# i# R           var tmp = ""+hexNum.toUpperCase()% D0 ]/ p% [) ?8 w: A; \2 [7 n% r
    while (tmp.length < 6) tmp = "0"+tmp$ N9 ]6 |3 X4 A$ y
           return ((deHex(tmp.substring(0,1)) << 20) +" E1 S5 [. y6 c6 P5 i+ P
                   (deHex(tmp.substring(1,2)) << 16) + 7 Y! g" s! V* ~7 Y
            (deHex(tmp.substring(2,3)) << 12) +
' o- r6 o4 j" `% E4 D& P% U            (deHex(tmp.substring(3,4)) << 8) +
$ q7 Z! u6 K8 z& ?! v8 [            (deHex(tmp.substring(4,5)) << 4) +
0 H" _3 ]% n) A1 j* h3 F                   (deHex(tmp.substring(5,6))))
% \& [- C  [$ Y  I' t; K% O}, B' E/ y( q" o" X
///////////////////Shimmering Links/////////////////////1 f2 {# W3 t4 {. o
//global variables
5 m  S8 d! X8 C; o1 mvar hoverColour4 Q6 u8 e, ?! f' P
var numLinks;
& V3 q6 ^8 B/ a. D: g2 Ivar rate;
- G0 ~3 Z  Z+ M+ |/ jvar numFadeLevels;
( N( V/ Q& c, |5 Bvar bgR;6 M; E4 S8 n& J( ?+ _9 P
var bgG;
) I6 K  G8 `, {4 [1 T2 Dvar bgB;
2 L1 C/ f* b! Nvar currR;8 C! J1 ?' D8 H: e; `7 \6 K
var currG;$ L" u0 f( @; b; l/ U# K0 D
var currB;' N# E$ S. T" u! {8 L1 A$ s1 u; D
var count;8 n' C3 @0 M7 q
var fadeOut;
4 B# R% l; e6 T5 v1 Lvar continuous;  }9 N4 ]! a4 X/ N
var newColour;
. X* `5 y0 W6 K) \var tID;
* Z2 x5 R: A5 Wvar redInterval;
" ^; f( G, A5 T5 zvar greenInterval;
9 T& _& n/ U" Pvar blueInterval;4 \5 Q) ?6 W: _5 P! E
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
0 m) C2 [1 R& ]: J0 ~  y+ w{3 C  r0 Y" N& T" v- p* q
        hoverColour = mouseOverColour;1 g5 f( X6 K6 ~% C5 L" p
        numLinks = numberOfLinks;1 s* p+ F' N' @, c: }# ^$ K
        rate = 1;
% q2 x0 Q& Z7 }% M! U0 L        numFadeLevels = 30;6 K7 \! j7 b4 B! h) x4 C/ p
        function initArray(theArray, length, val)
% A$ @6 \0 E3 j: M        {
( _+ g: J2 F8 H2 \2 ~! [2 A' |                for(i=0;i<length;i++)% @9 s  N! e/ n
                {
2 J) Z3 A7 o+ u" w. w# b% d                        theArray = val;5 q: _; p  Y% l* h: L6 I: g
                }
! z5 E. `7 z3 W2 U3 c0 g' u- n0 R        }( E: g8 D* X" v& \, X
        bgR = '0000' + fadeOutColour.substring(1,3)
8 c  e+ M  ^7 s  l/ B) R        bgG = '0000' + fadeOutColour.substring(3,5)
" F* _3 I2 c  m/ y% E7 d# z7 j        bgB = '0000' + fadeOutColour.substring(5,7). {# t! K, w/ n. O
        currR = new Array(numLinks);7 C! x' F( J' t  b; s, [
        currG = new Array(numLinks);
; ~* @; I# \& V3 O        currB = new Array(numLinks);+ [) x  [* ^& e, P  w5 {) [: a
        count = new Array(numLinks);
+ ]1 u  q, D6 n; y3 m0 L        fadeOut = new Array(numLinks);
6 N7 S$ a. S( B# L* v: k        continuous = new Array(numLinks);; s9 N  c! w' Q( B
        newColour = new Array(numLinks);
# a1 B; Z! I% h7 n        tID = new Array(numLinks);
% I+ t- ~: z( }8 {5 ^4 k# k        redInterval = toDecimal(bgR) / numFadeLevels;/ r$ b7 z. U+ {+ I1 ?/ H& h( v
        greenInterval = toDecimal(bgG) / numFadeLevels;7 d5 m  Y' R3 ^! |7 |# `
        blueInterval = toDecimal(bgB) / numFadeLevels;
- o) w5 l' m( G9 ~0 \& q# s+ t4 N        initArray(currR,numLinks,0);% B4 q8 i- r0 u
        initArray(currG,numLinks,0);
5 F' W( z: H- ~  z7 K# `: v        initArray(currB,numLinks,0);
* Y8 e7 o7 \) ~( M1 h/ V# C0 T        initArray(count,numLinks,0);
& E- d0 g5 Q. y2 }        initArray(fadeOut,numLinks,true);6 I9 C& N$ {; l4 M+ S
        initArray(continuous,numLinks,true);
( G/ R6 j: H8 X. l}       
0 X* a& I9 Y; Q9 j' j3 K, q7 Vfunction startFade(id)
3 l1 m: Q4 Y( x1 h. |{2 F2 h. V# w# z5 ~" k/ @: c6 x1 H* }
        if(fadeOut[id] == true)
9 D; T9 A9 z- m, [8 @& U) l        { /*move colour towards background colour (increment)*/7 \2 X- s7 E- ]: L4 d; G
                currR[id] += redInterval;! ~  p' p2 P9 D  z
                currG[id] += greenInterval;  m; Y2 I! {! y% y- Y/ ?
                currB[id] += blueInterval;% C4 E) B( d6 h
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
9 M1 J, Y- o5 f6 ~8 f3 e3 K                if(++count[id] == numFadeLevels)
) D& [" m5 Y3 Z  g; ^                {/ N# z* ]1 W' c. x# O3 H3 `4 j
                        fadeOut[id] = false;
* Z& c7 O2 q6 y7 M% _  D                }3 O6 T: r1 J. s  E3 J. {
        }$ Y$ V5 b2 P' l# P# h# u
        else
7 K% o$ A, r! e8 ^        {3 p; N: E8 R/ l- E
                currR[id] -= redInterval;* w: ?! N1 ~1 j; \2 O7 N3 R, c& \

/ `1 ~4 o4 h; i- }9 C) L9 K                currG[id] -= greenInterval;/ y) m# v$ E" U9 F8 N) i/ a

" ]: ~( b1 S) ]  v                currB[id] -= blueInterval;
, G% l: H5 s1 \" Q) T# I* M
+ G3 g+ L( `6 p) z, N: q                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
& w3 K4 T8 k4 |0 i0 k& R  R# l) b- T5 r6 x
                if(--count[id] == 0)
4 j$ B( |$ t2 b4 m3 O0 c, g% z
/ ~0 D! s+ q7 d0 M6 r. c                {
# [9 M' C- }( i4 O
$ n' E4 t4 P  M3 f- E( c0 @/ H$ k- n                        fadeOut[id] = true;
& x; G+ O, H) }& f$ \$ \! r: M; W! R3 r1 D
                }
5 [1 r3 K5 j& F( o8 \( y( y- a  S5 x3 \$ o. v) @
        }4 I. ^2 o4 I) @6 {) T2 t

4 W2 c6 q/ x) L& Q. S1 e4 b( C        if(continuous[id] == true)
4 ]8 l9 R  w+ H7 V4 `% S, g
! v/ Q' s! `/ }4 g- r. Y7 i. Z! m0 d        {
6 S. F" K9 F5 D4 i; n
( j- N8 f7 N: A  r" a                document.getElementById(id).style.color = newColour[id];                % [* n6 e3 Z4 Z& i* x5 X$ f

) g7 I6 ]# Z& q# X% }2 `        }, c: |# t3 a6 ]: d7 w
3 ~$ S0 I3 m  L& O3 Q
        else) N2 K* z  s# m% ?) x

( t+ `& A: P0 v0 W        {
( |! z  I; Z: \/ u! A5 L4 V, b' _! f/ N# |. V% O
                document.getElementById(id).style.color = hoverColour;
! r8 N1 j1 _; E) y- ^5 S* s5 ~0 U1 O8 K( @0 _
        }. _3 K) C& r# y9 B. _. G; J& r
! w0 F- q3 I* p: j7 F9 t
        clearTimeout(tID[id]);
! j* @4 r% V7 Z. w, `& {1 ?* I8 ^
        tID[id]=setTimeout('startFade(' + id + ')', rate);. O7 R7 d0 }. K) i
+ R+ U  F, i" p* x. m' {
}
" Q  b7 Z: n5 Q% z+ Z/ L# m* p( \# P. {0 G7 _5 g* v! z. A
function continueFade(id)( R/ S. ~, V2 ~1 H+ V

* ~1 [; r  r4 |* {  m{
8 x# p/ w, x8 @8 S9 i8 C
: @9 Z' R- G: l, R- i( t" M        continuous[id] = true;$ y# Y6 j5 G+ Q+ p4 F% {+ z( g  i
5 a/ b* c( x1 q" G3 K7 q
}
. c( ]/ q0 A! y0 }6 F3 I% h
  o9 v; V+ P0 _' @function stopFade(id)
+ D/ d! j. \0 P% k; C! @% D( q
' E/ d# z# X3 Y" a4 v5 P' ?{' s" D, g3 {3 A% a( k  l' l7 c

9 z5 X# f7 U% @6 R        continuous[id] = false;
' m, M" [: [0 m4 N" q+ a" ?: p" h
5 ]0 `8 _% s, N2 y0 K3 k}
# v9 ?" e+ \! F4 N8 y
, r; z7 J) X8 E3 gfunction StartTimers()
7 T% h. w# a6 k5 |  L( W! T8 W
( ]+ M' q0 }+ L# G7 c0 X+ F/ g{        //set up an initial set of timers to start the shimmering effect8 g) j. A! ~, @: w- U7 h& _6 g8 O6 U  z
, X% k5 G0 _) @. H6 K& U" {- E, c' o
        for(id=0; id<numLinks; id++)
  ]/ L+ o  A, n, Z) h* v* d* ?4 q3 G
1 A% \4 i4 ~) \$ x        {
! x& ]5 q  D3 A$ ^( E+ u4 _1 B1 D* G& ~
                t=setTimeout('startFade(' + id + ')', id*100);
- g' q3 _- l7 R% S- r% i; n& g4 F
        }
. X$ a" |/ [+ k2 w: I$ {/ l9 A7 w9 f( S5 m
}
5 c5 T$ @" P2 d4 ]
6 Z: \$ F$ s+ ^1 M: {6 y9 V, C# Y//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')  T0 u' u/ _0 M/ V! e5 M

, J0 g0 P, J4 |( B9 }initLinks('#FF0000', 6, '#FFCC77');
, a6 b, D4 T" e' ]# T9 Q
1 Z( E  g6 W) a8 W! E//-->9 T4 \1 P9 Z5 Q# R

. B' v# b6 Z6 B7 k& l</script>
/ u. D$ P% B1 I# A<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名:58元
5 D. I% m- v% {5 p3 u</a>
% D: |2 d/ N+ B1 [<br>7 {0 ?( R% V' |% y( l9 L7 ]
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名:110元</a>8 M( Q7 G  Z% Z5 r/ {1 k
<br>6 H7 }5 Q# i3 b! g# e, M; W
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>3 h6 _8 l6 g( w: C
<br>        ( x+ u- I, Y& U
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>4 G" n8 j: g' I: H! S/ t
<br>
- O. s' m+ f# ^8 b8 f( x<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>7 X. v& J# S& {# q6 R4 ?+ Z
<br>, ?  r; F: M6 A
<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>3 e3 \& _8 `* m6 Y' u9 _
<script language="javascript" type="text/javascript">/ T5 Y. E/ t4 |
<!--
9 v8 h- M! M6 ]4 r, ssetTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering3 ~* x; ]% f* J4 P7 K4 D4 K0 C8 B
//-->& \. u) Y% |$ X# J5 ?4 v: d6 i
</script>

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