返回列表 发帖

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

<script language="javascript" type="text/javascript">" P( J6 P$ S  r& X1 V
<!--/ ^. p4 J  ]) L7 `% |4 C' w5 c
// convert a single digit (0 - 16) into hex
, J% G8 N. y* ^% Kfunction enHex(aDigit)
$ c6 t' F- o/ {{
& Q) n- N9 H! z, W    return("0123456789ABCDEF".substring(aDigit, aDigit+1))
; l" j( C7 a3 `6 p% h( T}
( a) l* s; u) E; e. k3 I// convert a hex digit into decimal% w3 `( @5 x! A
function deHex(aDigit)1 X  v+ J& G9 ~9 u
{, Z9 G/ |3 m3 a/ ?
    return("0123456789ABCDEF".indexOf(aDigit))
( j5 r9 O; L, b4 t! c}: i4 n- ^8 L9 Q% f7 Q

9 F! g0 o1 f: o1 |+ o5 @( b+ ?// Convert a 24bit number to hex- S. B8 W: p7 `2 W2 u1 L6 U
function toHex(n)8 d7 b/ s3 n, F9 z# g0 _
{. a1 L: Q% X+ A5 Z, ^, Y" v
    return (enHex((0xf00000 & n) >> 20) +
1 W& j& I+ l7 `            enHex((0x0f0000 & n) >> 16) +
# C; T0 w6 w: ?' Z7 d0 t            enHex((0x00f000 & n) >> 12) ++ t! b# K3 O4 V
            enHex((0x000f00 & n) >>  8) ++ `* c( {, n# U1 |0 {+ P
            enHex((0x0000f0 & n) >>  4) +
. F& ?  y9 n0 b  O' U- M            enHex((0x00000f & n) >>  0))+ W8 ~4 y* o" [: q
}( k; g. H( p( X  h
// Convert a six character hex to decimal  }3 C$ H8 }! y# s
function toDecimal(hexNum)
( l6 t0 i8 g6 L7 e! K! Z{
) [* C, m2 N; e9 M+ R/ S. L& p( g           var tmp = ""+hexNum.toUpperCase()
1 a5 X7 B1 n( \" U    while (tmp.length < 6) tmp = "0"+tmp1 C  J6 h( p7 F* `" y# x6 J
           return ((deHex(tmp.substring(0,1)) << 20) +6 `9 u: I; Z4 Z) w, `  e9 f& u
                   (deHex(tmp.substring(1,2)) << 16) + ) z* O& Z$ ]* ~7 \% S6 B1 V/ Y$ x& A
            (deHex(tmp.substring(2,3)) << 12) +% r. T* m- k  R5 Q, Y6 |
            (deHex(tmp.substring(3,4)) << 8) +) s$ Z, p# S+ Y8 z- ?2 Z
            (deHex(tmp.substring(4,5)) << 4) +
; C# o3 P0 k3 {9 g6 g! m+ |                   (deHex(tmp.substring(5,6))))
$ w9 w. ?( s& u  G) b% ~" Z}
( s& ^9 Q9 A) ]. s& s/ j///////////////////Shimmering Links/////////////////////  N$ x  V$ F4 O; K
//global variables) V, t- g$ `% M7 B. B& W
var hoverColour
1 a) \, P4 Z; _var numLinks;
$ R8 c3 N- W1 Y5 O8 a- ?! I: ?var rate;
! w; L1 p0 h$ r: U1 s1 r+ |var numFadeLevels;
' j& N2 r2 U# M. R7 i3 m  I' cvar bgR;
7 \/ {/ R0 b0 r- M) r! n% Fvar bgG;3 z- C6 j: o% g
var bgB;
0 i6 I4 _$ p/ h3 N1 Q; A8 z* Vvar currR;5 |2 _; q( b% C7 K5 h  t3 @  [
var currG;
# O. [( F, C# t9 |& Vvar currB;
0 p9 G+ M7 t; f7 s, cvar count;$ _# Z/ u( |" M1 ?8 ]
var fadeOut;
/ l; p( d$ G) Cvar continuous;7 G8 T7 W% `) z, B  K& H: S+ K
var newColour;
1 U0 w7 w: {, U8 c+ Ovar tID;) c( v/ f! n6 q: S
var redInterval;. K6 O, K: W" E2 p: T; i. |
var greenInterval;! J  o4 G7 f8 s& u8 F7 @# h) m
var blueInterval;
" C- Q- Y: Q" v9 @function initLinks(mouseOverColour, numberOfLinks, fadeOutColour); E5 F$ W) J, N" a& k7 p
{
# [! A# v4 j6 ^& R5 {        hoverColour = mouseOverColour;
" g8 N$ t' ~: F5 _; i) k        numLinks = numberOfLinks;
2 y2 i) _" ?1 a& Z, a. b) z( ~- {        rate = 1;
, }' D! [. E1 z3 n) u# H        numFadeLevels = 30;/ s# S0 q% I, A; X% b
        function initArray(theArray, length, val)
! t4 k' g2 z2 x. Z! l        {3 S# A) B- O5 T  w2 `- x* _
                for(i=0;i<length;i++)
3 S! V3 Z2 k4 I/ Q                {
! ^' A$ T5 @5 d% }+ I2 |1 h: a% V                        theArray = val;* v8 n) O4 v2 g
                }
, }+ y' [% F4 w        }
& l& [' S9 c- ?        bgR = '0000' + fadeOutColour.substring(1,3)" ]( }$ r' f( r/ Q# k6 h. H
        bgG = '0000' + fadeOutColour.substring(3,5), ^; ]7 u% M+ F7 |
        bgB = '0000' + fadeOutColour.substring(5,7)
3 ^9 ?( B2 f* \- t4 o) h7 n( ?+ |        currR = new Array(numLinks);
/ ~7 g) d5 @4 U2 c/ V; \! c        currG = new Array(numLinks);
3 g. p/ h8 t- ?        currB = new Array(numLinks);6 ^: V9 _) \+ M6 Y& L! J& j- ]
        count = new Array(numLinks);9 y9 X& ~& J! ~7 G, S
        fadeOut = new Array(numLinks);
$ M5 I! O. a# y9 b) @" X% _% e        continuous = new Array(numLinks);% x9 E' _/ n, s# O, d  D
        newColour = new Array(numLinks);
% E& e( P7 a( d, f# y        tID = new Array(numLinks);3 g1 e) n* f% m  M% c" O
        redInterval = toDecimal(bgR) / numFadeLevels;+ o, H5 {5 Y9 O# ^+ s0 M
        greenInterval = toDecimal(bgG) / numFadeLevels;
3 v3 J: X' r: u9 P9 X: Y* _1 g- C        blueInterval = toDecimal(bgB) / numFadeLevels;
3 o2 h. _' s5 p, e+ i, v        initArray(currR,numLinks,0);& D# \3 i1 q7 c; E- M
        initArray(currG,numLinks,0);/ u( j! E" w! A
        initArray(currB,numLinks,0);
# ~) z. M$ D/ m9 F        initArray(count,numLinks,0);
3 _+ \4 Y7 c9 }! r2 r, L/ \        initArray(fadeOut,numLinks,true);
) {" c4 m0 ?2 d# y" P        initArray(continuous,numLinks,true);
; H5 E3 p6 K: Z}       
! D- K& j& D' _1 d2 ]function startFade(id)( }' b( _6 U2 f# K1 v
{
/ [$ j+ d5 K8 w3 y% N. m        if(fadeOut[id] == true)
5 ^- `+ [& H: q; n8 |        { /*move colour towards background colour (increment)*/0 Z- W$ Q' S/ s" r- W$ p7 @" s. u
                currR[id] += redInterval;$ R; j* @0 D0 p0 @; Y. A
                currG[id] += greenInterval;: j! v' Q; I3 J0 K% `" u+ o
                currB[id] += blueInterval;
  h& N) E$ U1 n/ Y# x% I                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);/ |4 l# x, F# I( I" ^
                if(++count[id] == numFadeLevels)
* w5 p' u( `+ g* Q1 T3 g. U) R                {" V3 B' ?# c; B1 A
                        fadeOut[id] = false;5 l# x. S" I1 p' o
                }
- x' l/ k: U1 I. d4 a- c! `" a        }
) h! ~" m$ ?4 r" a8 T$ K        else
7 R7 u) [. N" O7 g# k3 X5 @* g        {0 h, R, M' y) i8 U4 M
                currR[id] -= redInterval;
+ {2 c3 ~# q0 a7 j0 x9 }0 b, c8 P$ g5 A' T3 m2 R0 c5 |* K4 c( T
                currG[id] -= greenInterval;
5 h% w: k, i' c9 o) c
/ |# ~5 O7 m/ \7 \6 I2 V5 b                currB[id] -= blueInterval;* R2 h! Y- s$ b, X/ v9 M

: F7 z9 x6 n, {                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);8 }5 f/ f; S8 B

- I: V1 @8 n4 e. ]. g* C, A                if(--count[id] == 0)
4 k) B. k* @& m; ^
& F- z, F( \6 Y. R% z5 T9 s- E: Q                {
, i& x5 K+ W+ y; n% B8 l* Z. j* `& s" y; C& x/ W/ o9 h
                        fadeOut[id] = true;2 p) |3 V1 I# }) c6 ]1 _# s

5 f! f6 j. Y1 V* ^* H5 I0 W                }
7 j# f2 G# O/ y( R3 ?4 V# C  W4 j$ X9 |# l. [; Y, d9 S
        }
& `9 L7 b7 d, E" R* c) P8 ?
3 B/ r/ A0 x( V, Y1 I& a6 }        if(continuous[id] == true)% I. e" v( x& J5 c9 h5 |

. ~" f, m, [$ e" q" Y! i        {6 h  P, V( g2 R1 \& z

: l0 v9 S  [" U$ o& h$ @. s: r                document.getElementById(id).style.color = newColour[id];                ( k7 ^1 ~0 P' e- e

" _/ i' |! k: ?/ U/ s2 ?7 e        }* h. m% {' U2 |0 B- i

) x. k' o+ L8 }2 p        else
# M0 V9 f8 R7 [" x# C; c% K! O5 f9 _
        {
4 Z$ u4 L1 o7 B- F8 w; @
, k: V! F% Z7 V6 e8 f                document.getElementById(id).style.color = hoverColour;
, r: o5 f! b" m% u0 H* d
4 `- V; c/ K! l4 {% y        }
, B* }, s% N0 ]. ~; p
! r8 O, o7 k0 t" }& v! o, N        clearTimeout(tID[id]);  O6 C( `! _! D  L$ }) j& \8 z  S

, Y9 s: G% N( C& h        tID[id]=setTimeout('startFade(' + id + ')', rate);
3 _% i7 ~3 E- j& @+ V' ^% q* [
+ _( f; V1 s; w7 U1 E- X# |}) u2 g6 S$ v+ X2 x

# k8 \! I' g/ h& nfunction continueFade(id)
5 N+ P8 _3 K3 Q+ M. L3 D" F. _7 E( ^* \3 ?; \: i/ a% b
{. s! _# {: K/ N5 i9 y
. @) m/ x% e$ G4 Y$ N' }3 c( L9 ^
        continuous[id] = true;; I* b8 r. _( V# L* v8 E2 e# Y' a
- ~# L, p( Q8 ?6 N! P/ E9 g, d
}
" ]' T3 j: \* b0 T% r# o
, ?# J+ }$ m. h" C/ Efunction stopFade(id)
7 r# ]6 K0 p+ A9 n5 q3 ]7 r- g2 `
6 B* Z  n  c& Y# _5 |( `, F4 t{
: i  p- c& f6 P' e" m% [5 a! L3 T  A3 E$ c/ G" o0 d
        continuous[id] = false;
) ^+ Z9 G5 V, a% E& Q6 `' I; \# J# O. t* c3 G: i
}( Y9 W9 u; _4 o1 g2 t4 I6 R

4 M2 K9 w" }% O) P! X8 Kfunction StartTimers()! }1 \/ o7 B% @8 ~0 `, j- w

5 U4 d/ F. B" u2 k# _3 @{        //set up an initial set of timers to start the shimmering effect
3 u* P# _( c. O& W' S2 c1 ~( ]
2 Y6 f- @7 Z7 Z9 K+ ?3 J/ I        for(id=0; id<numLinks; id++)& m$ Q% D4 @8 {. X" d
* }3 y% i; d. v( n1 y  s. ]! P4 M
        {6 {* P$ G% w* d; @0 p7 h
+ t: @  S) s% q
                t=setTimeout('startFade(' + id + ')', id*100);
5 s9 t0 |9 N# V& ?
  E; D! j9 X3 k( u        }
/ S+ v* d+ t+ A0 A" f. O4 o( X  ]8 E1 o
}
, n1 D& m  ], H  q0 s, X! A) \/ Y) _
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
" M" O6 d( k2 m- T, O2 F" O3 `4 _+ p8 X% X+ A3 h
initLinks('#FF0000', 6, '#FFCC77');
9 F/ j# I4 k5 G  n3 ^( w1 V" L$ y& D' P+ m' z
//-->" y* \" J4 F, y* R0 ^, M6 V
3 f4 e- E) Z( M: g9 U7 r. y
</script>- z, U) O4 j) \! n" c+ O
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名:58元& ^7 W5 b" u/ `
</a>
& P1 f. c6 D: n; o<br>$ W0 _1 [6 J. f! g, h
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名:110元</a>5 {# T9 F0 ]7 a. c  r3 H
<br>
& T3 q9 ^9 I1 g<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>* D6 u7 l* D& n! p7 y- k, w* ]/ |# O
<br>       
0 u% D  K3 T7 t) Q<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>2 ]5 e8 V* |7 I% G2 \: s
<br>
7 i$ J, S* c3 \# J5 D- t! k<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
" P2 V* z8 B% ^" B3 o<br>
8 r2 e. X4 p# d" F  d  b1 p0 K* E<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>
% |7 W- e1 o& g' F<script language="javascript" type="text/javascript">
" O& _* c& s) w7 ]1 \( Z<!--# v! I% S4 s! f& ~3 A7 }
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
1 @! Z7 [: c( ~% V2 A; o+ ^, h3 l; ?$ F//-->
" ^: F: \- i1 h5 D: Q& f8 y, L</script>

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