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

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

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

<script language="javascript" type="text/javascript">
PDQu4m9H!H6T9|a <!--:}*C9p`d%^
// convert a single digit (0 - 16) into hex
Z[j6n9B1T4}i function enHex(aDigit)Ah*w hqQW
}
{
(e4O9o"TS;gb,b     return("0123456789ABCDEF".substring(aDigit, aDigit+1)) ~4xak,~0xQpF8cx3S
}#UT4S:G F(z2sM+Vn
// convert a hex digit into decimal4k!E4u3xV)b*h` {
function deHex(aDigit)*K \PuCK1?"`jz
{r(VOlY#d ypM
    return("0123456789ABCDEF".indexOf(aDigit))
d3L+?E$~3\(|5M }
'M O"Dx yD
BXr.N A2Wa$O // Convert a 24bit number to hexg_ VD@'S2W"[
function toHex(n)&Q5E!fyhy
{
Gc-pqB2k$q#_}9X
    return (enHex((0xf00000 & n) >> 20) +
E[-QC5jQQ             enHex((0x0f0000 & n) >> 16) +DD9lZD9v#V
            enHex((0x00f000 & n) >> 12) +
eO
s8tW'de             enHex((0x000f00 & n) >>  8) +
$blw'xb/n             enHex((0x0000f0 & n) >>  4) +
r{f Tzu's}             enHex((0x00000f & n) >>  0))
-[-X3}0jaIy }j;c0\_#x.v^
// Convert a six character hex to decimal
.m!G"tm6{/jT function toDecimal(hexNum)
,z}c"[2\!N"]A {9Y&b If4U,A#@7Z8TM7H
           var tmp = ""+hexNum.toUpperCase()
:Dnz G4i} ?o     while (tmp.length < 6) tmp = "0"+tmp
laZ+DH!e,y8iB9][            return ((deHex(tmp.substring(0,1)) << 20) +
d~hCGn2lj                    (deHex(tmp.substring(1,2)) << 16) + m3K!K+~)_\
            (deHex(tmp.substring(2,3)) << 12) +
.CwUY:V             (deHex(tmp.substring(3,4)) << 8) +Y6isI2g
            (deHex(tmp.substring(4,5)) << 4) +
o:i?]!i@o                    (deHex(tmp.substring(5,6))))
m0@}/l C'ek'pge }Ng6A"dg J#jv5o
///////////////////Shimmering Links/////////////////////
+@lT$zZLv //global variables
"G VSC1Q%JN var hoverColour5a,B*\.L?*J
var numLinks;JG9]f7Qt)Y
var rate;a
pF2P1t}
var numFadeLevels;3_&jK1ax
var bgR;{?7e;[;Ps
var bgG;!I%i9|(Y%F
S*^.U
var bgB;
9Kwz+b4c[)K"P var currR; roy yQ7DUC8b
var currG;|$Vv
l/G8z0Sd_xs
var currB;.L`s(c+Jfj
var count;
O'J2j)gq(Ww var fadeOut; Q kU6R4Cj$i4T/s u1N
var continuous;ZDfz[I/d(i$~'_
var newColour;E.D#p9ib ?k
var tID;!D!wr.LCfS`#o
var redInterval;
QW:Os)O3@y var greenInterval;
T
gQB+nS!r*fZ? var blueInterval;
8Hf2@#T9m function initLinks(mouseOverColour, numberOfLinks, fadeOutColour)ow:is5d+]'TUl1Z
{.L1j@:odP-A
        hoverColour = mouseOverColour;
+L~+zL.i*u:jz.gz         numLinks = numberOfLinks; F T5jCr'`R
        rate = 1;q$lZ?D!o{'Z\
        numFadeLevels = 30;&? C-_m)z ??
        function initArray(theArray, length, val)6K(c$zOm:d:^#I!D*f
        {UIR'R$Z(w ^
                for(i=0;i<length;i++)
O-CbZ#\y;I[%x                 {
.Xj_{.d|#@0H0b4X                         theArray[i] = val;:EEOg:EL
                }8Z2[;d)_z2u!ICt4h/n
        }
_,SkDro         bgR = '0000' + fadeOutColour.substring(1,3)
aE'bS$y2I/| U         bgG = '0000' + fadeOutColour.substring(3,5)
]+lfaHj5S4^9S$b I         bgB = '0000' + fadeOutColour.substring(5,7)-SG^zn%k(|)h
        currR = new Array(numLinks);
lJ?|tC"I         currG = new Array(numLinks);Ph c%T]U$Ku!w z
        currB = new Array(numLinks);
J[ GuYN         count = new Array(numLinks);)S'X}[TX
        fadeOut = new Array(numLinks);7g)ukt~_6oe,w&@
        continuous = new Array(numLinks);0PoEo'`t(`,i"ca)b
        newColour = new Array(numLinks);;e)y].@,oXo
        tID = new Array(numLinks);5}M'L2\$E;\1Qd
        redInterval = toDecimal(bgR) / numFadeLevels;!`$P6{4A5R*V$W4Y:jt-n
        greenInterval = toDecimal(bgG) / numFadeLevels;
XY'f S lU&xQj$|         blueInterval = toDecimal(bgB) / numFadeLevels;2gG|U[ aEp
        initArray(currR,numLinks,0);:UQ;wH?L)[)b(?0r
        initArray(currG,numLinks,0);
`^?*h5H"E4d         initArray(currB,numLinks,0);/_hv Q.@r8W&RdL8}
        initArray(count,numLinks,0);9zYd6i(]S7Wi:D
        initArray(fadeOut,numLinks,true);
]
Igi'xj         initArray(continuous,numLinks,true);-i_-v q+D.yl
}       
%G&c[*DFd function startFade(id)
9ja!Y-fwaXHn K {
fh-?3V2j!S'~-H         if(fadeOut[id] == true).R+lo/FIG
        { /*move colour towards background colour (increment)*/
2UZ9z8YMO4e                 currR[id] += redInterval;N,t_ t+?)}/}9i
                currG[id] += greenInterval;
Mmm/X7k8Sw                 currB[id] += blueInterval;s
r&`4Ds_~X
                newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6);
v-WA4D,N0C G                 if(++count[id] == numFadeLevels)
a6g8FnjP                 {
0g8X[7b)i3Pr                         fadeOut[id] = false;i4Ya~
Qa/q2n
                }
$Q'M_"G*a`.nr L         }
,c6nJ(dXF]V         else0E"gg$m%[ e
        {
,N4{f eBErx                 currR[id] -= redInterval;q?y"]#Ql;r?-]#jS
?+u+a O.aK+^
                currG[id] -= greenInterval; K:gms|w*g)sze+V

^)Ik
H:py6]k.^                 currB[id] -= blueInterval;b2c uTd.h9eE? {

:?)|;xDp)E6J.gy0G                 newColour[id] = '#' + (toHex(currR[id])).substring(4,6) + (toHex(currG[id])).substring(4,6) + (toHex(currB[id])).substring(4,6); r?"o:Y{,~GcD

6?Iy)h VW`P                 if(--count[id] == 0)"@/K9HH*bd-wF

;U:W;_yYhh"Ig                 { T8v&[H
dU9f5t^k
~&Q/MuWN1k;jD
                        fadeOut[id] = true;
O+vC'M|Q%h
\;h qF&u7{f8rc                 }
*s%k-lD-_(u ?g-V c{K4uovQ'u0T)M
        }wEx_sqT&T"Q7C

0h:o(e"E(uMW?         if(continuous[id] == true) L"S!r7x(G

vXjV-u)fv         {9y7y[%[H[4Q
6qC2JI2{n
                document.getElementById(id).style.color = newColour[id];               

d(X5g9[c"jTO-E\t BIQR~
        }KF\#p)W l
$@8Ys]e/LE@PK8w
        else
%Qf.z2n2rv ^(R
Hg
E#]:l!~6D@
        {1dp6L(e"yV0Hq
9v.^-u7p8qat
                document.getElementById(id).style.color = hoverColour;5K!u fV-d E/v\H~
G je Q,m.|#E
        }
aTxr9v0y8_P ;W#q'zZu;i.E9@
        clearTimeout(tID[id]);-` d.Ta!?c7K
j

)Cr.T%k0Q$?$Ev7^_         tID[id]=setTimeout('startFade(' + id + ')', rate);J nNw
y

)?"n.{2t w*Q }
Y AD.b;ez GFi "C;uA*e*fg,Pwj
function continueFade(id)1E
vc4f,`-mSt
9J$R&M{+yJ4{
{
e2x,Gl q[1r 5rao!m c;k w8^
        continuous[id] = true;ZVsB,|2H$^$G ij
aBz&T9RD+uu)s
}
v{
vh;`r'C
La&S *o%O%_R)h,~L
function stopFade(id)4XA}(||)eh9x
`]kb!Uo2r
{coh(p t${#n ^p,A&w6C
4g'yp&Kj
x1`;m
        continuous[id] = false;7A.a;J [ZC.U`Y8N5W
a0sI:PZrJd
}#^8_]o\].C
O"Z6O
B8C0~_
function StartTimers()%F0HLguJ

~ ?;y6kU:qA {        //set up an initial set of timers to start the shimmering effect
!xP6a#ex&] Z6y#j4Mn
        for(id=0; id<numLinks; id++):Tw9p1\9['Q0^

$@Y!m7TrrD2GG         {|IB}Y `,^g
k(sM}DqG
                t=setTimeout('startFade(' + id + ')', id*100);"E@rd_ u
SjQ2qoL!fB0R
        };Y:C5QQ LGF

~}}&{$v,^ g }U_c)l,v"FEu
5O!fE&Z1j,U H]
//format = initLinks('mouse-over colour', 'number of links', 'fade-out colour')
G1i4F4u0q`IiD
$T} j)pb d initLinks('#FF0000', 6, '#FFCC77');
Pg b2I.@v Q6yrG:LI
//-->
b(n+D]$UZ?_y7iM 9WeC#vpGA:m
</script>
1U H%?i@T <a class="links" id="0" onmouseover="stopFade('0');" onmouseout="continueFade('0');" href="http://7wind.com/">国际域名：58元
&gT1? S sY"V4J [ </a>M;v0q&IXv6z
<br>Fv }TZ
<a class="links" id="1" onmouseover="stopFade('1');" onmouseout="continueFade('1');" href="http://7wind.net/">国内域名：110元</a>Q
N9}7_/R
<br>;n5J*k[%sf|J
<a class="links" id="2" onmouseover="stopFade('2');" onmouseout="continueFade('2');" href="http://7wind.net">新一代企业信息系统</a>
1~5n3s6}
EU <br>       
I)q?KQA <a class="links" id="3" onmouseover="stopFade('3');" onmouseout="continueFade('3');" href="http://7wind.net">新一代网络商城</a>+W'`,mbg-sG
<br>
-jwlK\ LY <a class="links" id="4" onmouseover="stopFade('4');" onmouseout="continueFade('4');" href="http://7wind.com/">全新的自助建站方式</a>8M9_m D8I~"j"t
<br>
_,hbT1ykp <a class="links" id="5" onmouseover="stopFade('5');" onmouseout="continueFade('5');" href="http://www.webdevelopersjournal.com/">全新的设计理念</a>
]_Z RGle <script language="javascript" type="text/javascript">%r"w/jf,E6y
<!--Fi;x;YI"D|nL]
setTimeout('StartTimers()', 1000); //initial 1 second delay to allow page to load and ensure smooth shimmering
$~`
I"R-_G"s_0q-D //-->
m!ZU'cx NE </script>

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