返回列表 发帖

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

<script language="javascript" type="text/javascript">0 l$ [8 L& a0 F0 E9 s
<!--
) b( D- }5 e- J* `  n$ W- N// convert a single digit (0 - 16) into hex6 U0 F# a- _. ?# [# I
function enHex(aDigit)
. V9 S. L( [. j8 n{
* G5 A+ B1 j( [+ ^- \( M    return("0123456789ABCDEF".substring(aDigit, aDigit+1))
) U( ^* }, p6 G}! O+ ?/ Y4 f- G) n  e) k
// convert a hex digit into decimal3 f8 X! Y2 d. E) g) N! O
function deHex(aDigit)3 {" ~1 U" |, r9 N
{
2 B; g& r: ?8 ^9 t' t' m- y1 C    return("0123456789ABCDEF".indexOf(aDigit))
& w2 ?  s" X- B8 i0 x1 [}
/ {! x- Q$ J0 u, ?5 a3 n$ R7 G* w# N0 N
// Convert a 24bit number to hex
& k4 b' A* O5 @function toHex(n)
2 [2 r# x6 R! A{
1 U7 B+ d5 @/ V; ]5 ?/ V    return (enHex((0xf00000 & n) >> 20) +
7 x6 m* }# B' D1 I0 ~, I            enHex((0x0f0000 & n) >> 16) +' H+ U3 s: S" Q7 O1 F" a
            enHex((0x00f000 & n) >> 12) +' E. |" q* x3 E  ^! U3 \
            enHex((0x000f00 & n) >>  8) +( n3 {) Q* e. b* N. o: z2 K( v
            enHex((0x0000f0 & n) >>  4) +
  m- k) G- G- n            enHex((0x00000f & n) >>  0))' x+ _; g& x; i4 A5 c# `5 ]# j
}! D6 u6 N9 |( N+ j& S5 S
// Convert a six character hex to decimal5 A# u: o5 a2 n
function toDecimal(hexNum)3 @0 N! J& W$ z- G2 |7 ^
{
" `1 h% E" C4 l: Q           var tmp = ""+hexNum.toUpperCase()) I0 A/ Q( n  V8 {
    while (tmp.length < 6) tmp = "0"+tmp6 h: }" e  ^8 x  L
           return ((deHex(tmp.substring(0,1)) << 20) +
$ R2 E" J2 N. p+ [                   (deHex(tmp.substring(1,2)) << 16) + 8 v, ]# I& Q& G& Q0 X# s
            (deHex(tmp.substring(2,3)) << 12) +* N! W) V# B% P: y6 ?! N' @& U. [
            (deHex(tmp.substring(3,4)) << 8) +
# c! ?% c+ l# ?            (deHex(tmp.substring(4,5)) << 4) +
; Q/ d# A* F: p8 k# O                   (deHex(tmp.substring(5,6))))& K$ W2 @# x! Z; j, S8 q2 i( F1 x$ X
}6 z+ W, }* ]2 l8 E8 A  t
///////////////////Shimmering Links/////////////////////
, @% ~5 W8 T5 z& q. J6 b//global variables
& ^' ]7 |! l$ }8 W/ }% vvar hoverColour
* @( _6 C# S. Z5 |+ g& ?var numLinks;
' Q7 f7 a7 q* Mvar rate;  D$ x" C  U2 B' u; G5 Z
var numFadeLevels;
, O- \. K3 u# \var bgR;* W9 |' H" N" q
var bgG;
# T6 y* ^, z5 Tvar bgB;
$ U4 N& t, n2 m2 w6 w* F% M% xvar currR;( I- P( ~4 G5 H; u6 O  {* c
var currG;! }- m. q1 F/ ^4 F
var currB;' K# Y$ f( m: W( A" W) z) ?
var count;
6 w& b* j/ U  Y/ _% U# Avar fadeOut;
/ ~$ D8 e% V7 O1 d: P* Ivar continuous;
& t& e, W" b9 evar newColour;9 l' w6 I: |+ H# \$ M
var tID;
* G1 n# d3 t7 x7 ?0 }4 A6 h9 D  Fvar redInterval;6 H! `. |7 q  a/ E5 N1 ~
var greenInterval;* o' e2 w1 \1 f
var blueInterval;) B$ Q' N: v2 v7 u
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
  \8 V1 R% o5 b{& ~! [, A3 L$ a# L0 R& @" w. }
        hoverColour = mouseOverColour;
* _! n2 k7 K# \2 ~7 o        numLinks = numberOfLinks;
* g- M' m. Z; ~4 ?        rate = 1;5 r. U9 S- @9 J! J
        numFadeLevels = 30;( c! Q  P  B5 I5 f
        function initArray(theArray, length, val)
) o; s2 K! c; i        {
) [& Z9 a; o1 I8 C+ B% d: v                for(i=0;i<length;i++)
  E, U- E6 f/ O; m# Q                {
0 @# P; b0 H! _7 ^% ]' U# i: N2 q                        theArray = val;4 s4 w8 W( _) G' f+ ]5 }; L1 P
                }
3 F/ {/ R* L' O        }& O/ B, a. r2 H. \
        bgR = '0000' + fadeOutColour.substring(1,3)
6 g) u/ X, @' D! v; \2 g) w& l        bgG = '0000' + fadeOutColour.substring(3,5)
8 s0 ^& M! I( W; U5 a& G        bgB = '0000' + fadeOutColour.substring(5,7)
+ @, [8 w' V- _% u% k0 `        currR = new Array(numLinks);0 @) s* C: [$ \
        currG = new Array(numLinks);
0 I/ x1 I7 o0 s0 D+ n0 U        currB = new Array(numLinks);1 K, Y; H" f2 U# @! o; u
        count = new Array(numLinks);
5 Q  L+ K- k3 |5 `        fadeOut = new Array(numLinks);
  e! s6 @- p4 S* _! F7 H( E  y        continuous = new Array(numLinks);5 D* S) _+ N5 x' m2 i4 a
        newColour = new Array(numLinks);
. [% D& Q' n+ X; e6 ?- U        tID = new Array(numLinks);) N1 G  ]9 u7 y8 t2 Y4 c
        redInterval = toDecimal(bgR) / numFadeLevels;" n4 ]: `% m9 z. w$ I
        greenInterval = toDecimal(bgG) / numFadeLevels;
$ ~. ]1 H6 Y! E9 o& G( T& |        blueInterval = toDecimal(bgB) / numFadeLevels;
( ~3 T! P7 G& ?/ U& H: v        initArray(currR,numLinks,0);
! r7 X: f7 d3 h" B' J  l- d        initArray(currG,numLinks,0);
; d$ G, q5 w+ Q  U        initArray(currB,numLinks,0);
3 a& w, T( ?3 n: b% ^2 |" r3 T        initArray(count,numLinks,0);' i4 S6 M% I! I! [
        initArray(fadeOut,numLinks,true);2 {# y' Z# P) }6 |! D# Z
        initArray(continuous,numLinks,true);
/ L) y, h2 P& b! l$ t}       
! {, x, ], w, y3 l1 U' tfunction startFade(id)8 q6 C, i" d: o+ k
{7 @+ O. Z. j9 L
        if(fadeOut[id] == true)
+ J0 l, }4 y* s# {$ s2 A8 G        { /*move colour towards background colour (increment)*/
: w) v2 B" Z7 {. q1 v                currR[id] += redInterval;
8 i1 K4 C7 u" U: k, e9 K4 Q9 i                currG[id] += greenInterval;
5 J( o' W+ P/ p. j( B8 |                currB[id] += blueInterval;/ A' K3 t. N; ]+ B( _8 q( ?
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);0 Z; K% q( s! k$ n3 |
                if(++count[id] == numFadeLevels): Q8 @9 V; A/ D- V7 p5 W0 `
                {# j0 j+ p& J6 M3 j& `
                        fadeOut[id] = false;* Y" f' X* p" `4 }; Q0 |% r1 R4 ?
                }9 Y+ ]# W4 [+ y. n8 i& O) e  f3 e
        }  E2 f6 i  ^! T
        else
6 q% f7 s, f' \' q        {
+ A1 V- ?: g" Z. h+ l                currR[id] -= redInterval;% J6 b- G- u8 L* I9 g/ S2 ]: o

1 e. _7 ?0 y3 _+ k1 @                currG[id] -= greenInterval;
  p. v5 r  D: v: K! X4 @2 Y% N0 K' [
% x3 ^# b& U. i/ c' S! u                currB[id] -= blueInterval;+ p. A# X" y! m9 z6 D9 q: h+ r
! G5 J, m  i/ q' Q3 J( e8 [' @  S
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
+ ]5 F+ v; S4 e+ P& k7 q% @9 d. w( s; a8 s' K6 I
                if(--count[id] == 0)
" m& ^& v. V1 s: c" J0 ^4 O- |! e) d
                {# p+ t+ P# r% T# M4 _( l

7 ^1 T# ^$ [. R                        fadeOut[id] = true;# r, Y, P- H& f. m

2 j1 v) @3 r; D3 _+ E: z                }
( [( e; E+ H  y0 w) s, N) k5 w! s3 u- O1 a
        }/ e2 o' e8 K* j6 u. V

6 G1 P9 ?2 k9 S  _% S6 F' ~; {        if(continuous[id] == true)5 W6 R# ~$ H& P/ I4 |5 z4 Y) ]7 w7 t
7 W% h9 w: z+ n! u. E8 _4 L
        {
/ ^) Q2 w4 O0 S, X' M6 e3 [! U5 z2 w+ `4 s2 c3 }
                document.getElementById(id).style.color = newColour[id];                & c! Z' x/ D' h: w1 O3 x% }
" G/ Z+ P$ I7 P
        }* _% m  z$ L& a4 H) l: ?: u
1 f, |* n% {$ C* r- p' b- |9 m5 W
        else- Q1 C. @' X; ^$ k
+ ?3 T6 g. }% w
        {
1 P4 e& T: n6 s- s/ h! S: v' W3 @9 ]9 I/ W* x' Q1 }" ]+ R1 H  V  i
                document.getElementById(id).style.color = hoverColour;: p6 p: Z5 {2 I( R1 o

! t5 c9 s" M" I        }+ x- |1 a* E% w7 ?; ^2 |4 {& ~
2 v  K2 p3 {1 z* H
        clearTimeout(tID[id]);6 I1 y5 U9 U6 f5 w' Y0 C4 {

( Q! |, U/ W9 b        tID[id]=setTimeout('startFade(' + id + ')', rate);
; r3 I. P" [& |/ Y$ w! ^1 f! a4 r' X: \, f( o/ F
}  _& t( Q4 n9 l: \+ K: T9 i- _
0 J% M! k3 c/ S# h
function continueFade(id)
" _: W" [% r7 i  w% N0 H) o' \3 v9 n6 P% q, E8 ?. L+ Z
{
( r7 L( w- n' |0 T, H! P' q/ i# P% G$ Z2 X- X5 r1 X! c/ W, I
        continuous[id] = true;3 `1 q( |& }) P1 Q; e: U7 Y

6 W5 m" B9 k, }* g}
  ], R- o- u: S/ W$ j
( C8 W$ j" W1 I! Z+ ffunction stopFade(id)
/ ~( O8 @% `# V. h& ]% d
. }" P9 s+ ~8 ]! W$ q5 B{
6 b9 h! t, c0 \' r0 d+ ]2 z' u! F6 X0 T0 u3 v
        continuous[id] = false;$ F- C# ^9 r- V
; V5 g1 D0 y( b" C2 b2 i8 j
}
: l  N5 F( [) n2 y5 A$ ^4 \9 `0 }. \, c, T' K
function StartTimers()
% C4 x0 U" L0 h
& F; k% Z5 P% z( H9 C) }{        //set up an initial set of timers to start the shimmering effect
* y  }) E% u9 P
7 h. F, ^, L% b$ d8 [5 a        for(id=0; id<numLinks; id++)0 E5 `) Z  l/ l3 ^1 I' l6 U

9 L/ S( S" h- I' R2 W        {
4 |6 X) M4 ?( l+ v8 H' y2 V1 f- a- W# G3 C1 C
                t=setTimeout('startFade(' + id + ')', id*100);
6 \9 T2 y# {: a( f9 u: s3 r) u" n$ C& {* t# ]
        }
# B7 ~9 z3 _8 a: ~) D; g
* a8 N/ L4 y; H6 `* z}
" H  K7 M: T3 ]( q+ }4 m" W7 G0 n- r" A' V
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
) ?, P" R: [# n( l
  m2 f, B- O+ E: t  y3 VinitLinks('#FF0000', 6, '#FFCC77');$ L8 h( Q/ W* ^& ~' K: _2 [8 o4 V/ K
$ g8 ~) n- x+ Y! I4 l" d
//-->  t  T$ i& \- ?* S( \8 X
4 Z0 p* B6 i  s9 y! f$ ^; I9 }
</script>
5 c+ E) H' X, g$ J6 }8 J" z  n<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名:58元
4 X. l9 a. O/ s$ x7 E4 L! P</a>; r+ B$ U5 l" i! N
<br>) J8 B# B" q( U' u) I' [; @4 N
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名:110元</a>
5 p) D4 C1 ]; s<br>4 `' t3 a. ^0 J/ m9 N" N7 b7 B
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
9 }0 W, z3 ^. y- A0 b  _<br>        0 T4 Z# K3 ], i5 v$ |; Z3 G
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>/ a6 @; Z4 v% e, |% ^( Y
<br>( C# e" G! \+ R7 V6 y  E" e% u
<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a># y5 h+ C6 q9 w
<br>
0 Y3 ~# V; {6 b/ m; P3 U<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>( [0 T2 l9 X/ b, I
<script language="javascript" type="text/javascript">
& O- f) j- @3 l5 ]' v<!--* \% G1 S- H" x6 x+ q7 O
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering5 J* A! N4 B3 P
//-->7 j4 S: U# l9 k! i
</script>

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