返回列表 发帖

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

<script language="javascript" type="text/javascript">, |% G3 s* d/ a' e" {" B
<!--$ M9 b2 @# K' L
// convert a single digit (0 - 16) into hex
5 H  T2 h, ~6 @. P' Jfunction enHex(aDigit)
; b4 y! [6 t# o& P{
, q, d5 F6 B0 {2 C    return("0123456789ABCDEF".substring(aDigit, aDigit+1))0 Z* j! a% c2 f7 l% t. c7 H
}$ [  G2 f: x* s5 Q$ a: _! v+ c2 t
// convert a hex digit into decimal
% X" L0 W0 Q$ k; a' rfunction deHex(aDigit)- S9 S3 D6 L* m# i" s
{  I/ x0 ~! g  m+ l
    return("0123456789ABCDEF".indexOf(aDigit))8 t; f! f# d9 Q& m9 Q# @8 G
}
8 _- k! L( c7 e9 O1 R
: o1 ]! I& h0 M8 x9 m// Convert a 24bit number to hex3 \, j- S4 U) E: T* S! |# x
function toHex(n)2 m5 M& s8 l' q8 s: ]' `- v
{3 J! W# k" O8 q5 B
    return (enHex((0xf00000 & n) >> 20) +0 |% [& S: @( Z
            enHex((0x0f0000 & n) >> 16) +
' q3 ]5 W( P/ b( ?            enHex((0x00f000 & n) >> 12) +2 O( G: O/ W6 A) [; ^7 E
            enHex((0x000f00 & n) >>  8) +4 S, _1 Z3 `5 v4 a6 n
            enHex((0x0000f0 & n) >>  4) +
; L' z2 y% e" ?7 F' Y' u" P            enHex((0x00000f & n) >>  0))
, n5 H/ r( F' V6 P0 I0 \3 d/ i3 D}
" z3 [8 z+ b% X$ _7 s+ G* {2 X4 N8 i$ o// Convert a six character hex to decimal! [2 W# l3 q5 ?" a  S
function toDecimal(hexNum)
- e$ ?2 Y& U) |{, p8 \7 M, U% Q0 `
           var tmp = ""+hexNum.toUpperCase()
+ s, _# Y9 S1 |4 O  r  Z9 @    while (tmp.length < 6) tmp = "0"+tmp
* `, P2 H! J. X6 E9 Z' c4 L           return ((deHex(tmp.substring(0,1)) << 20) +
" ^8 e  ?- Q- a- |" |9 Y; r                   (deHex(tmp.substring(1,2)) << 16) +
! n; d0 j7 p6 \: H2 d- i            (deHex(tmp.substring(2,3)) << 12) +
) c- W+ g. i& B8 k! }! L+ _            (deHex(tmp.substring(3,4)) << 8) +( b: I0 k) a' h. v
            (deHex(tmp.substring(4,5)) << 4) +* v1 Z5 Z% ^' i9 F, Y. _) i
                   (deHex(tmp.substring(5,6))))
) y! _: h1 a- w4 X, Y}- P- U: K& {, Z
///////////////////Shimmering Links/////////////////////6 u9 ]; n. u1 K3 M; P. G* Q# M
//global variables% |: L" \  w5 `
var hoverColour
+ e* m2 T  `! |6 v4 cvar numLinks;( q) Q1 e# a: y, S4 ?
var rate;: n2 J5 w- O( d, l
var numFadeLevels;5 M7 {& s1 @2 Z7 o
var bgR;
8 v5 e- p: H: x/ J- s6 H4 Nvar bgG;) q2 R! ~0 I+ a6 i( M5 b1 e
var bgB;
0 m- H; y0 i  M1 C, P! {3 N/ Evar currR;
1 O) X( J1 U3 \3 l  O; jvar currG;
8 b) `7 e9 O3 x3 A9 h; D/ Tvar currB;7 C* ?, _7 A2 R  d4 f; n
var count;
9 K! l3 d# J% \6 S* Svar fadeOut;6 r4 N, S5 j$ M
var continuous;
6 A& V/ I7 G: M8 jvar newColour;
) K% s' |9 _; V1 Q0 S3 J7 C& x  V1 ]var tID;
( G) Z' l  h2 ^" ~6 Cvar redInterval;
% F  T: {3 }! Uvar greenInterval;
+ U5 B8 m% X) F5 u4 \4 ~: Yvar blueInterval;8 V  ~$ i; M. c. G
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
( g1 |# e* t! d1 |: w! B7 N{
: c9 m9 k! Z) _! _        hoverColour = mouseOverColour;% X: O7 }+ b, B' L5 |. G
        numLinks = numberOfLinks;7 J, I2 E/ J. H4 Y4 ]  a
        rate = 1;
( R1 z& j/ ^) ?: p        numFadeLevels = 30;
7 p/ G3 \+ Y# |8 J) R& }        function initArray(theArray, length, val). W. \. p/ ]* d8 e
        {/ N: x% v! E$ k% R. p% u
                for(i=0;i<length;i++). n9 H3 D" g6 Y% ^3 f, b
                {$ l% A4 b0 y0 j  h
                        theArray = val;, x2 u" W! `5 e2 A) ]
                }
) N; m) [) M8 Y        }
9 p: X; S  |# c! L0 K6 \; F; E        bgR = '0000' + fadeOutColour.substring(1,3)
! X$ M3 D9 e+ G+ v& P. y4 U        bgG = '0000' + fadeOutColour.substring(3,5)2 T0 @" H! P4 H7 ?1 w
        bgB = '0000' + fadeOutColour.substring(5,7)
7 |  U: a4 s% ^        currR = new Array(numLinks);$ x! Q( @: z; I2 p4 x& ^
        currG = new Array(numLinks);! L) P0 w2 R1 b* f
        currB = new Array(numLinks);
) ?8 }$ e$ d/ A6 D# V        count = new Array(numLinks);
' `9 b% j/ F9 d7 b  z$ ?        fadeOut = new Array(numLinks);$ c( x' u0 H. x
        continuous = new Array(numLinks);6 Z; {; |% b0 ~* ]1 l0 N( U: ]
        newColour = new Array(numLinks);
4 i' @& C  k* o9 o0 _3 S5 t        tID = new Array(numLinks);8 ~/ c( d3 ~4 e  [" X
        redInterval = toDecimal(bgR) / numFadeLevels;
2 ~2 C' \( {4 T/ C* d* e        greenInterval = toDecimal(bgG) / numFadeLevels;- N; D4 |1 i7 h8 m1 p% s- X7 ?
        blueInterval = toDecimal(bgB) / numFadeLevels;3 B+ H/ r5 O  M' n2 T
        initArray(currR,numLinks,0);' Y( I& b+ X% V: R
        initArray(currG,numLinks,0);6 [7 h( n+ j  R
        initArray(currB,numLinks,0);0 E* ?% M2 w2 B% G0 H
        initArray(count,numLinks,0);5 T* b! W1 b9 m' v/ I
        initArray(fadeOut,numLinks,true);
0 t! Y6 S/ e7 _' f2 O9 T        initArray(continuous,numLinks,true);0 ]( H  N6 g  W( R8 ?4 I0 k. X
}        " w) ]) k* v/ N0 A
function startFade(id)
- W+ R# _* k% }{. o8 w5 l5 s. t% W3 l9 o  ^. f
        if(fadeOut[id] == true)! {. m5 \6 ?( ?# E0 q  ?" D6 R
        { /*move colour towards background colour (increment)*/
- [& Z+ g! M8 I1 \  }! v7 z0 y                currR[id] += redInterval;  b- m) n6 i5 B4 t+ M  H9 }
                currG[id] += greenInterval;
" C; n" p5 }; l                currB[id] += blueInterval;
2 l; M, Y( R/ B: N" F$ z- b" g                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
' o5 |9 @6 R2 `* u, u; E/ r                if(++count[id] == numFadeLevels)
& j/ W" s$ s3 k- }9 a5 [                {
$ N$ h1 x. m' H' }) d! R- i                        fadeOut[id] = false;9 G- a& K' B8 @  {# N, \
                }- B+ D; e% `) `
        }
" l0 g% Q4 p- {, I5 |. u        else
5 z+ I  O0 T2 c5 P: b& i# f. b        {* z- q. N$ }0 _. M
                currR[id] -= redInterval;7 X! e9 J9 r' }; C# }
/ ~8 J* T+ H5 z9 ?4 H$ T# T) H- f
                currG[id] -= greenInterval;
7 @& Q+ v8 N* B4 K7 ^, f! N
7 r. |" b: x. M/ r0 }, s4 v                currB[id] -= blueInterval;" }3 E0 v9 D! V2 y+ q6 W
, L+ K/ C1 w3 |& U9 I
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
9 p* \% S9 Q2 z: R9 b) E& y" h; b! y+ O- j0 c' L! T
                if(--count[id] == 0)
! ~$ ~/ K0 H' ~0 d6 M7 `; [8 U! J! X( f( }# @$ x
                {; _" M4 s) B, M% Q  p( n1 C

5 ^9 j+ Y6 h! W# Y                        fadeOut[id] = true;8 u! Y0 C" T/ ]; }5 k2 h  z
+ e8 U: z4 P1 s6 Q3 i, i
                }" H8 r1 D9 C6 b  ~
& n4 k. Z" f! |/ W0 z" F, {
        }
* p# @: r$ \' g2 M" ~
! U# z; ~4 t2 \        if(continuous[id] == true)0 e8 n  D3 j. U/ d& Q) g, e

' Y% a. P6 J, {# v9 g        {4 f' n' b' D# ]0 U5 I
% t+ S, c+ I" \( c
                document.getElementById(id).style.color = newColour[id];                " ?; Q( l9 `9 f2 d  l

! N/ E# B8 L2 _+ j" G% Z        }
6 r" C( O- `/ M" ~  x% K
$ V2 |$ I; w0 D) m, Z$ l        else
0 N# H- n0 {" O, Z1 g: x6 P7 e3 p( C* p: |( ^
        {
+ M. R$ s6 ?6 ?  C: _% d% ?' n" X) Q0 x, N% Y" G
                document.getElementById(id).style.color = hoverColour;
9 M0 c- O. Y' x9 F7 o, r% @8 R4 @. l6 G9 z( b. y" h0 @
        }
0 I8 s$ e- Q3 A/ D' C  ?2 i- \1 r$ i& z: G
        clearTimeout(tID[id]);/ r4 r4 }% u# U
  S# `  V0 I# Q: n( t( v
        tID[id]=setTimeout('startFade(' + id + ')', rate);% L( {  a4 C5 _1 a

7 P& Q$ N5 J6 O1 n}! C* ^* N' T3 y% g% ^" W' G) ^, @
9 w( f: d- c8 h& S% C/ R
function continueFade(id)
" l: ?8 p- m2 _* O2 q+ N& }& d5 d  M1 I7 {& h: {, y
{( G) b; }6 y& i( e

7 |* C* m1 J( Q! L2 }% J        continuous[id] = true;
2 P0 \' f- ~# H$ z1 q6 @3 g4 b) o2 u5 F& z; N$ B7 i( \( e* n1 D
}
3 w) U$ K1 y! r* r3 x  \$ @1 Z7 N1 r; m* w8 f& u: f3 P
function stopFade(id)
7 T6 ^$ g1 F6 @; P! I) @, k4 H9 B3 v; ^  E% R8 x
{
! a' I3 K- _4 r5 x
/ [6 X/ P5 D7 ^( |, n" M' ~, X        continuous[id] = false;
; {& X7 S2 I  h1 ^* B8 ?8 P1 h
4 ^7 x! g4 L4 ~$ y# u}" }; Z/ ]! q' _  ^% [% D

# P: p2 ?3 \9 S+ ~8 a7 tfunction StartTimers()! |3 j- J7 `/ p1 J2 c" y- r7 R  L4 {

1 ^6 p3 ~+ F! @- Z+ v{        //set up an initial set of timers to start the shimmering effect5 Y# u: L! h. j/ ]: i. {2 A4 e
8 T7 o# v" M# K0 n9 `; b
        for(id=0; id<numLinks; id++). Z. d3 c; ]& X5 L+ b* T
: V% _0 S, \; y) h
        {# V1 `4 P! J8 B2 L& N' d

" i! m3 H- u. q6 t                t=setTimeout('startFade(' + id + ')', id*100);
" k* s( ]( o; a7 U! `* X3 N) U: D( p* K3 l4 c
        }) I; N1 y- I, ^" P
2 F" _( @1 l5 [3 m
}) H  t9 i, H' Y8 j( G2 U' i
1 Y. g- O& r9 w
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
4 v; k* L- o9 c! S1 X: n
# g( D: b! e1 iinitLinks('#FF0000', 6, '#FFCC77');
3 ?! J; s! v: j9 A4 e2 J/ d3 P! v5 I  u& r$ G; N8 x! c  _
//-->
; U5 ~( \0 f/ E; ]
& C6 |/ j' s& M9 o8 @7 ]% O1 k1 {</script>
4 |9 s/ q3 G1 E2 m/ G  V<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名:58元! J% l* _4 u# v6 t/ B5 {1 Q" I; R" ~
</a>3 q( U" ?" M( n* f  c- J9 R! r5 [* S
<br>
2 D) L' Q5 h5 h5 ^! r% R. i6 E" A<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名:110元</a>
9 q! v& X6 a! m9 d<br>
0 L+ {4 {. k* E7 ^4 E<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>& j7 @2 r' g7 d1 n0 U& N# e0 `
<br>       
+ f5 V. Q! }* |0 k! G2 c- p<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>* n& W! l  D* \0 m+ T; V5 r& v
<br>0 {5 f9 [# Z, I" [' }, A: R+ Q5 {
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
8 C: _: E7 j/ Z<br>
& B- M. R, g" b. G3 s5 I<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>
) t6 i& K. \1 b; }$ C7 P<script language="javascript" type="text/javascript">
  r$ k8 K  @- i4 l<!--0 X) S1 b$ J. H- S
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
$ x1 U, f+ D- A2 h6 W1 t5 K: `) `//-->  e4 b: f3 T$ x+ {# y. Q5 A/ t4 ]
</script>

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