返回列表 发帖

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

<script language="javascript" type="text/javascript">4 L, f, W; i" Y& l4 _3 J
<!--
% q  t# M! j* V, x// convert a single digit (0 - 16) into hex: b( f: L2 `  e% z
function enHex(aDigit). _7 j% @0 A: ?  |
{2 ]  L/ e/ j! `
    return("0123456789ABCDEF".substring(aDigit, aDigit+1))
1 t. C& o- j4 l+ i$ Z/ c. o}
: I9 a: q8 a+ D// convert a hex digit into decimal
- V# T$ B$ W. G& @' j# I) |0 Q3 vfunction deHex(aDigit)
( T6 a# V5 v" b4 J, u: J9 X2 a{+ K9 }8 X3 g. b. j  e4 F8 A
    return("0123456789ABCDEF".indexOf(aDigit))( x& x. |! A8 S3 [6 Y
}
3 _+ C, e, l' ?$ _# p+ W
5 K6 |# D8 z( Q// Convert a 24bit number to hex
. |+ X' ~6 m5 H9 X$ Xfunction toHex(n)( a5 a7 ^8 H- B, T3 T/ s, V3 z3 W7 L' D
{
  t: E" L  m6 H; y+ y% T7 U    return (enHex((0xf00000 & n) >> 20) +( Z3 R9 Z- k# R* N0 J
            enHex((0x0f0000 & n) >> 16) +
% c9 L) m6 A4 y* d: p            enHex((0x00f000 & n) >> 12) +
9 Y1 _7 a6 A/ m" K& e) U# |9 _6 `            enHex((0x000f00 & n) >>  8) +
" C0 Z* K. `, h2 S/ W" s            enHex((0x0000f0 & n) >>  4) +2 r  a: _0 O+ I1 g4 P! F
            enHex((0x00000f & n) >>  0))
% Z% |% o/ B6 }}5 l1 q+ g8 @/ R- o
// Convert a six character hex to decimal% Z6 h) V3 A& K& t9 `* i
function toDecimal(hexNum)4 `2 {3 a5 s) n+ O! U# K' o
{
! Z$ L/ E; o/ x4 _- j: ]           var tmp = ""+hexNum.toUpperCase()
' ~" I& p' T/ Q: A8 ^( X8 K9 L    while (tmp.length < 6) tmp = "0"+tmp( J' L. m8 d+ ?9 e2 Y1 C, e% {( Y
           return ((deHex(tmp.substring(0,1)) << 20) +
5 V5 _  Y5 ^9 w5 A6 ~                   (deHex(tmp.substring(1,2)) << 16) + ; ]6 O7 h) S/ S3 M) A% a
            (deHex(tmp.substring(2,3)) << 12) +
" o+ T3 O3 Y7 K/ _! d) {            (deHex(tmp.substring(3,4)) << 8) +
9 N) D5 x% s- Q* F            (deHex(tmp.substring(4,5)) << 4) +
. \, M+ W* B8 t& [4 }  y                   (deHex(tmp.substring(5,6))))6 ^7 F7 _+ n$ F6 V2 M' ~
}0 V; A! h) {9 Y* R- S$ e' D* P, V
///////////////////Shimmering Links/////////////////////2 g/ N- A3 y* h$ _3 k9 A
//global variables
; b3 s' K+ D+ B; `8 |* I, xvar hoverColour
- A! ?4 T$ {# r% C' `7 ?1 Zvar numLinks;( _7 r5 d  r# \7 r+ s
var rate;3 Z9 Y: M) b9 \# K
var numFadeLevels;0 {7 s0 y; ?  f
var bgR;
* L1 d& F% [3 e! N& Q! r! Z7 Lvar bgG;
1 f& l/ m$ c, A9 _  B" A1 jvar bgB;
- O5 L: k1 i6 O+ Kvar currR;
( r  |7 e% S6 Rvar currG;  b; o' n' R3 y4 F" o
var currB;
& u$ G, Y3 z9 u9 j) E2 ~) E3 T9 L+ lvar count;7 \) I- O: T8 Z: k# h5 A* a
var fadeOut;) w4 e1 D* y* V$ l) c8 k5 v* M
var continuous;- [7 f! O$ H! k6 a; i
var newColour;* p( ^6 j5 A4 [5 C8 \7 H: e
var tID;
% g! X- m9 e1 G8 i) rvar redInterval;0 l3 v% R3 D( G& X$ Q
var greenInterval;" w/ t' F: e5 Z2 C9 N4 n: j/ g
var blueInterval;! v* J- _" M6 i$ I- V* {. E
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
" _" S: X4 i# P+ E+ I{# E9 Y6 j+ `) Y9 u8 W. A
        hoverColour = mouseOverColour;5 L! Z1 G0 G3 s$ A
        numLinks = numberOfLinks;& y& i+ {0 T- ^6 r! o4 |: H# d" e
        rate = 1;; G. X) R" Q! [( ]1 M
        numFadeLevels = 30;: ^' }, |0 [6 @3 P+ q
        function initArray(theArray, length, val)
- d4 Q" v. j6 r* j: Q        {
! N; }: ~, g3 d+ e, Q4 p$ O                for(i=0;i<length;i++)4 Z0 z' O  k8 P. M
                {
  G; m7 h* N6 Z! @, v                        theArray = val;
+ ~  D8 f: x4 p( C/ h  k0 N                }
4 n& }1 K! \3 z/ `- ?1 V/ o7 O        }
5 `: {$ j# j/ _8 t  _        bgR = '0000' + fadeOutColour.substring(1,3)
/ i# f" O. }% c        bgG = '0000' + fadeOutColour.substring(3,5)
: K, v* f8 v/ O7 ^; k; B        bgB = '0000' + fadeOutColour.substring(5,7)
# l" O: j, n% A  w9 x& V6 G        currR = new Array(numLinks);
$ W# o+ j7 P' J0 b# S0 n9 t$ h        currG = new Array(numLinks);
6 R5 ]6 e! R- E2 r        currB = new Array(numLinks);
! n/ P$ ?- C( S7 i0 m2 l+ l        count = new Array(numLinks);. s% c) S0 [; l' k# F# p) z8 g
        fadeOut = new Array(numLinks);
( Z# g/ V/ K- a4 v. i        continuous = new Array(numLinks);8 Y) z6 d9 t& f1 f& R' g7 q
        newColour = new Array(numLinks);
" E0 G9 f5 ^( N& G% A$ Q: r4 `        tID = new Array(numLinks);% b+ ?* o6 E4 I  m6 M2 F  C
        redInterval = toDecimal(bgR) / numFadeLevels;1 `1 g6 g# p4 [4 H0 I, U
        greenInterval = toDecimal(bgG) / numFadeLevels;
! l- Q3 [; U, ~8 r  [        blueInterval = toDecimal(bgB) / numFadeLevels;1 u6 p& Q# e  A; m2 {' i
        initArray(currR,numLinks,0);+ C% P6 O+ R4 q1 A1 q! w
        initArray(currG,numLinks,0);
4 L0 i" z, j" j" `5 p8 |! E3 v        initArray(currB,numLinks,0);% j7 F& r' w9 M" Y  S+ }
        initArray(count,numLinks,0);
0 G4 Y: Z! L4 g        initArray(fadeOut,numLinks,true);6 S  f3 g" B( A, H9 J) K1 h
        initArray(continuous,numLinks,true);) O$ W3 U9 R4 o- a- l( E
}       
! T8 ?1 |' \1 q' Bfunction startFade(id)
0 ^3 G& V: J, Q{
+ [: P2 }" q3 ^4 t) W        if(fadeOut[id] == true)$ f+ s" ~1 \( h$ M0 p1 M
        { /*move colour towards background colour (increment)*/
/ k, g- \3 O8 R2 B7 Y9 Q                currR[id] += redInterval;
7 p2 M8 O0 o' d& m                currG[id] += greenInterval;2 R8 O& o+ Q. u( Y* E  v% ^6 H& m
                currB[id] += blueInterval;3 ]# j# d9 V' f, ~
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);" g3 t# D' u% J" N
                if(++count[id] == numFadeLevels)9 m; v% e9 o6 t& Q
                {
/ I/ O( N3 g+ D! `6 G                        fadeOut[id] = false;3 E% k' I* F9 m
                }
7 n9 j" E, y, j$ v4 c  e* I/ j8 `) T        }
# J7 z/ [  S4 g2 m' E6 L; @2 B        else
; o6 n* O7 I: q) d& j        {2 q( s( Z  U" x
                currR[id] -= redInterval;; b& T. S8 P: i0 Y; e7 [/ s

* L2 S0 I% W$ X  T+ m& D                currG[id] -= greenInterval;
: G4 b, I' W1 @: P; D* {" Y9 Y2 q" S5 n4 M
                currB[id] -= blueInterval;2 G  |. I: C8 x7 v1 H% Y

& M; j+ @! ^3 J# L                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
% F6 @7 \' o8 R! q" k2 t9 e5 r
# R' o* p0 n9 ]) p3 }4 {                if(--count[id] == 0)4 c: T" F2 E3 n/ L* _- ?

2 m+ Q+ \& Y, i1 S. }6 |                {
. k3 i  x) B5 |3 S- O9 I. E: U: k9 M
                        fadeOut[id] = true;
+ E) Z6 d- C) `6 B% }9 f7 r; q
8 |4 d6 X& J1 g  q2 e7 ]% l' P3 l                }
% p" O# ?2 u# m  X/ e6 v0 k$ V3 t
% x- _, C, o9 P        }
1 ^1 K2 L' _  P: u7 S
# U; F! R3 R' x: {7 m        if(continuous[id] == true)4 m0 |7 b. c- B; Y" n# |- ]
6 B+ x% [8 r! E- I6 u
        {
- `) D( O$ h0 K$ `/ q
8 ~/ h: x/ k# A" s8 x' F                document.getElementById(id).style.color = newColour[id];               
5 O  U0 p* X+ [- g& W! @5 _
6 F* i2 {$ Q8 U/ W" i* j        }
$ w# r4 \0 k- `9 I
" M4 B' j2 v* n7 L        else
1 u  o$ v4 ^0 A7 W0 H
3 O9 u  [/ ]% h! X5 N        {; T' V; N& G% o0 T5 N3 ]+ A/ _
$ ~3 g1 S; Q5 z2 y5 N! c! e
                document.getElementById(id).style.color = hoverColour;
% Q) p3 R" H. x8 F  O! v
; T8 |5 Y) }& }6 Z, a2 Z  G' |! o        }4 e/ B7 ^* R; g7 v4 p1 K, m4 W1 t" I
8 I# L" N+ ~- C  G# H
        clearTimeout(tID[id]);
+ U8 v9 S; E8 D2 x' ~3 ?% u7 w  s4 Y( g% f
        tID[id]=setTimeout('startFade(' + id + ')', rate);6 l8 ^1 U0 F  K! ~# j& T6 N/ M

: K, i: T* ?% [4 D}
+ W6 U0 m" E, U& K0 i3 Y2 J2 ?0 ]* c+ H/ v* v
function continueFade(id)- }8 q* O& ~* Z+ C& @+ `

! H+ F+ i7 _4 M, l1 N+ g- M{
5 h' r& `, p: `& A3 f& L% y; A# Z7 I# W
        continuous[id] = true;
' o7 s. J8 ?5 B$ l% F; \$ [- }7 k; Y, ~- x! J8 i  j: Z. x
}* z! r7 a' ]' T% ^8 U
3 v5 k* {  j  Z8 [! C
function stopFade(id)/ _* a1 p# P" o1 l/ P1 J4 a9 o
* o9 d5 t; J/ f- n3 m. U
{) D: c& S% C1 o, X: |) ^

# v! W- V( k4 L5 Q: E        continuous[id] = false;7 ?' r2 c7 ]3 ~% M2 P
) F7 b! u$ o6 ^) `
}/ x/ w1 q! r! e2 q/ E

+ X5 t: G2 ?9 S2 b" e7 @9 jfunction StartTimers()
7 [4 y% @$ q% r' U6 F# R
1 ?, n2 @: J% o7 O5 r{        //set up an initial set of timers to start the shimmering effect
5 U" M& i! F1 p8 `7 T7 N, c+ E, I1 d9 U3 S! n$ O
        for(id=0; id<numLinks; id++); l3 C* s% V  L3 J5 o
' `' _/ _$ M" ^9 S5 X0 [6 X
        {
0 e5 S( P1 Y% b  q9 S+ ]
8 Q4 ?5 ]" {4 ~" O: {7 D6 ~# H                t=setTimeout('startFade(' + id + ')', id*100);
' u$ V' X9 Q' y" u  W/ I
! y2 h, Y- ^# x- c' x        }
* t' N& b/ O% B, y$ h7 f6 c$ n! S1 f2 F8 L
}, o4 e- D6 U* [  ^5 H- a% L

0 ?7 `- q1 f0 K, L/ ~* |//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
! s9 r6 k! K3 k9 e0 N
/ H$ `3 |0 V2 _. U: K" ^$ T( yinitLinks('#FF0000', 6, '#FFCC77');' d( U" ?! }! J1 l( Z% }

/ y3 ^7 E4 R1 B//-->
8 L7 ^6 }3 s: G$ ^6 l" e; e* [6 s2 T) J6 D
</script>) `# r" P# D0 L8 Q# Y! l6 `$ w
<a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名:58元
+ p6 e+ q' T) O2 K8 v# }' G6 q</a>( x2 P/ k) m7 l0 r: e# q
<br>  c& ?+ k) L0 f1 @) t
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名:110元</a>2 K, o1 H* `# F9 a3 G: W
<br>
2 R& S* u' ?# }$ K" n- R<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
9 _3 x* W/ x% j6 ^; e  b1 m<br>        ; T, o, t; _3 A, r, Q0 V
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
* d$ h! X; g) c6 Q  y<br>
9 _7 E" u- u$ A1 M# L<a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>% y# b! r4 G' @+ F
<br>: M1 P$ D2 i/ g6 u1 a0 M8 c
<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>8 _. @* E: t8 a1 A" V2 B1 _" b
<script language="javascript" type="text/javascript">" i2 c9 g0 |% U' M- x
<!--& W$ W. z# D7 o0 b
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
7 N  }9 V- i% ?: a. \2 j//-->
  X0 i" L4 Z& \3 |7 Y. V6 Y</script>

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