捌玖网络工作室 » 网页编程 » 网页之文字的循环闪动特效

zw2004 发表于 2008-1-21 20:48

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

<script language="javascript" type="text/javascript">Yf'`\8l^&U
<!--
~a&li+l~[ w7K // convert a single digit (0 - 16) into hex
fH)bf{9\0h/b%m J function enHex(aDigit)"Cm}5pxB7w
{
b0bD}!m,z     return("0123456789ABCDEF".substring(aDigit, aDigit+1))*FS*M&Y:d'k2\?
}.fzv/A!a+_+e
// convert a hex digit into decimalo)K+cW{~
function deHex(aDigit)
,E8}p3Rt:d'gL {
!J5w%j$X.k;LhG     return("0123456789ABCDEF".indexOf(aDigit)):^t*Xi:L
}
s~I0a2_ 4Z2Ul#Z,T-mvvv
// Convert a 24bit number to hex3i&^"t` h,Im)x
function toHex(n)WLf)GDg
{,B2W-pY5i.svy%m hz
    return (enHex((0xf00000 & n) >> 20) +XZ3a N8W
o
            enHex((0x0f0000 & n) >> 16) +V | CG!F.X
            enHex((0x00f000 & n) >> 12) +h)^;J1IN]3O;MVZ{
            enHex((0x000f00 & n) >>  8) +
Lf$RBN             enHex((0x0000f0 & n) >>  4) +
PI:`7^ zG+|             enHex((0x00000f & n) >>  0))1Z*E-ea9uL
}
8b2zr-^h*U,HYXL // Convert a six character hex to decimal
v!F+p6Iex
function toDecimal(hexNum)WO/f?7gE M$Y
{@m2Z WCr3T
           var tmp = ""+hexNum.toUpperCase()&X9H?y8g W Jku
    while (tmp.length < 6) tmp = "0"+tmp4` sG-oh BBi#Ry o{
           return ((deHex(tmp.substring(0,1)) << 20) +
+U
YV6a:U;Z                    (deHex(tmp.substring(1,2)) << 16) +
:d`%m:_i,@#kO             (deHex(tmp.substring(2,3)) << 12) + ^Rdo3q,pSt
            (deHex(tmp.substring(3,4)) << 8) +
8G)D
M/b8oI'VY:b ^1n*I'Q             (deHex(tmp.substring(4,5)) << 4) +
d-X9a ih@_                    (deHex(tmp.substring(5,6)))) BZcF)V1GU]
}(Fz&qyK\r l
///////////////////Shimmering Links/////////////////////uoL2wdz.e q
//global variables
0hp4GKN h var hoverColour
:bElU)n @[Ot] g var numLinks;|'VBc.L"N1g \+B
var rate; Xd'y'jw
var numFadeLevels;
@VLwg#K,E{ var bgR;
0PVLu\Q var bgG;_H Iy o
var bgB;`` R/V NI
var currR;
~ y+K'h
}9S*OxK!P var currG;
"{c"t%w V-q3X.W r var currB;
L SP;{Le*t var count;
?!m!`0s
u5j var fadeOut;
dzx(iz4` var continuous;5B]*W/R1Mlx
var newColour;
u
Q TE.|P,k*jk3~ var tID;B^N.Wab,vn
var redInterval;z/\ ~,a"~y"^"t
var greenInterval;e0k OL/JrCg(pv
var blueInterval;-f.]
i\VK3U.niJ
function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)
d,_p[9X3b4r ~vl&v {.V pBw#\WjE
        hoverColour = mouseOverColour;~vt*@2IM
J,KF4_
        numLinks = numberOfLinks;
C,Ws&Tp         rate = 1;

C"A:YN9bc0eV         numFadeLevels = 30;;A/M#l}&D SQ&qn
        function initArray(theArray, length, val)
5L
GK^;k         {7z4n#C2sVq0up-X4W
                for(i=0;i<length;i++)
8?4f f"Ww`\H                 {TW(^,RI$wQZ*Tb
                        theArray[i] = val;uy&|R_CU O
                }1X5x-o*T:w4l}
        }"f sXJ?i
T^
        bgR = '0000' + fadeOutColour.substring(1,3)
k2l#X
xg5O"P*uA8J O         bgG = '0000' + fadeOutColour.substring(3,5)'o9tt4{ ]1J1{Q+W&\(x
        bgB = '0000' + fadeOutColour.substring(5,7)
/l9q+~Qsu{0]NUK:}         currR = new Array(numLinks);VzR#U-_@M*q
        currG = new Array(numLinks);
5yFy qu h:O         currB = new Array(numLinks);
&OA9vMg9i?         count = new Array(numLinks);
JRl!PPW"x'A         fadeOut = new Array(numLinks);T4j-D8^%e.Z*G
        continuous = new Array(numLinks);
7o*|D;PP#y+[@ S#l c         newColour = new Array(numLinks);
4iqo1XGl         tID = new Array(numLinks);B7aZy,c"m
        redInterval = toDecimal(bgR) / numFadeLevels;v-C9BZ"B1P9Q
        greenInterval = toDecimal(bgG) / numFadeLevels;
w{6mR:\e'H         blueInterval = toDecimal(bgB) / numFadeLevels;
+v8eJQA s
wn         initArray(currR,numLinks,0);
I?@,u8o         initArray(currG,numLinks,0);
:n$M6zik'_z%yuM         initArray(currB,numLinks,0);UL&S"M D2{p4sf
        initArray(count,numLinks,0);
2^mg(fhm         initArray(fadeOut,numLinks,true);
NiQ QAm#O         initArray(continuous,numLinks,true);
}4l~+[s'n }        :K4w C;c0X4y:SiQ.ym
function startFade(id)
x.Q/jc9K,Y3q)y'g {
ID5~q4Dw N gQ\         if(fadeOut[id] == true)
9i)A|*mLha@O         { /*move colour towards background colour (increment)*/2o;JQ+F!Jt!@X~'N;f
                currR[id] += redInterval;
1dvnRm&f!A7\ Z"Mf$O                 currG[id] += greenInterval;I#N6`,i`Y
                currB[id] += blueInterval;
6uo9B-{9x9~UT$J                 newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);x1[8QBN)| EQ
                if(++count[id] == numFadeLevels)
,K!E"KY'T ] o&k                 {
*rL2gJ5[0[@3Y                         fadeOut[id] = false;EG3K(M
b5~A4N9i
                }KD
JxE] gr
        }m`Y'F
F?+W
        else
'D}:?d&J         {$lXE9M t
                currR[id] -= redInterval; UP3q+c$tq7X

3rH @Mp8M"LTT                 currG[id] -= greenInterval;
]p| w8d(E&^ 5gg)C5~Fs;i
                currB[id] -= blueInterval;g`]4A}!joEuuQ q
&c1]0W[S5{ lj
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);)?g:cG @*j~Js[
H*\1Am]N
                if(--count[id] == 0)
RX3`8mCO
)q(RUF+Dr&a%T(xI8u                 {
bvmws(MLJ8W?
/d$_?1H[!o-k0q                         fadeOut[id] = true; R[bx)Qb
n2`[j P-g w7o/j9o
                }
8^3oT)U A3E5A!s2l
B g7lDf0roT
        }
$gSB;A8pXbC ZkDZZ^urul
        if(continuous[id] == true)+c0l_%C~$d:h6W3Ad

#w2f^%u"g%D$_$q         {
"@k6]TJ)b"c JZ%Tv"A1qK
                document.getElementById(id).style.color = newColour[id];               
O|)fU F
N| .IQ-^6u$T
        } ^*Hq*U"Oz
ch
6y&|4MCt
        else
aI ^ Z`9B W~ [.b
m
        {
;S(aHba6G
fJ\Xh C                 document.getElementById(id).style.color = hoverColour;7|,_(t:L M Y"VGD
d"l5J+]@ J%N#H
        }]6Ua7d Int-s

8CeV%\(Q         clearTimeout(tID[id]);^t9^O$T~it

&OH2}W'BR4o         tID[id]=setTimeout('startFade(' + id + ')', rate);
W*M:p^.iu8M \
*CO5s)RS"SU }L{J.[1{M/cE9@

:C`,Xp @,? function continueFade(id)Q1`+s^OS~

/j#HQR#VU7U {-|3|#O]2_;?5r.]
e @hI9u!\
        continuous[id] = true;
Q6@F:C"Q1_9|bu#\ \Q*Q8]$`4h;cM
}
q4r&UeT
zk9D
v,[+o-@0O(UC function stopFade(id)
%L)ew5g6bb H5T 3|/p X5__sO-I%Ce
{Yr4{A4at!GoN`
%n
?+J$m-U+G_9f%@`
        continuous[id] = false;
.rfoE'[%wr+|
7Ia4p&?1yz} }wt-Xf^t d;n+fD

e(? f3?.~N$d function StartTimers()
?+r&L$n Uh5^
!Nm:D|)KJauE} {        //set up an initial set of timers to start the shimmering effect1E8y|:G5n

-B:ENa/c ] _,W0oN         for(id=0; id<numLinks; id++)
i3u!|j]H3J'V O8P
tRM[8S2{         {
9zZ,R9[LV
.n-S!O3p\                 t=setTimeout('startFade(' + id + ')', id*100);

Cd(j;}J{] O l
R |Q}]?B:u         }
's,A%Q'@r{)e){0X/r /S N`T8a*]dq
}
B%Y;x;GCa *vT&?(w1nfTzA
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')WI#Rm5~ ]VL.I
Y$L.g|_W#l eFn
initLinks('#FF0000', 6, '#FFCC77');
Ft? ir
S1aw3d8dg yT(I //-->
#xp&zn%E6AC4J PxV?[$aeB ff
</script>
}b
M9E^9Y6l <a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元'eHC w]1Z
</a>
|#g1r
Z$H#]'fpe <br>
^"a!e4Qr <a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>;~M0Iw/C jx@,K
<br>
e3L w4i u <a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
b&^,W%\[8x <br>        b@*h6E0x/Tb
<a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>
:JVX'}1n0KN'hf*M <br>
MRx*?+|@ <a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>
1X;W1Hq9G5i <br>9I'N.UOg[7Q0~.p
<a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>
%U5}`f4a|)[ Q <script language="javascript" type="text/javascript">
tM%}.PX:N4U <!--
I*Bd}9Yj setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
O/NT}$s^/R //-->&Z3Z#K-fIa"z.q
</script>

查看完整版本: 网页之文字的循环闪动特效