30多种js焦点图插件myFocus轮播滚动切换特效代码

版权：原创更新时间：1年以上

[该文章底部包含文件资源,可根据自己情况,决定是否下载资源使用,时间>金钱,如有需要,立即查看资源]

以下是 30多种js焦点图插件myFocus轮播滚动切换特效代码的示例演示效果:

当前平台(PC电脑)

平台:

整屏预览

部分效果截图1:

部分效果截图2:

HTML代码(index.html):

<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>30多种js焦点图插件myFocus</title>
<link href="css/main.css"  rel="stylesheet" type="text/css" />
<script src="dist/myfocus-2.0.4.min.js"  type="text/javascript"></script>
</head>
<body>
<br>
<div id="container" class="mbox">
	<div id="content" class="single">
		<div class="cbx post">
			<!--内容区域-->
			<div id="focus_wrap">
				<div id="focus_box">
						<div id="focus">
								<div class="loading"><img src="picture/loading.gif"  alt="请稍候..." /></div>
								<!--载入画面(可删除)-->
							  <div class="pic">
								<!--图片列表-->
								<ul>
								  <li><a href="#"><img src="picture/1.jpg" thumb="" alt="图片1说明" text="图片1更详细的描述文字" /></a></li>
								  <li><a href="#"><img src="picture/2.jpg" thumb="" alt="图片2说明" text="图片2更详细的描述文字" /></a></li>
								  <li><a href="#"><img src="picture/3.jpg" thumb="" alt="图片3说明" text="图片3更详细的描述文字" /></a></li>
								  <li><a href="#"><img src="picture/4.jpg" thumb="" alt="图片4说明" text="图片4更详细的描述文字" /></a></li>
								  <li><a href="#"><img src="picture/5.jpg" thumb="" alt="图片5说明" text="图片5更详细的描述文字" /></a></li>
								</ul>
							  </div>
						</div>
							<div class="clear"></div>
				</div>
			</div>
			<div id="focus_set"> 风格应用选择：
				<select id="focus_pattern">     
					<option value="mF_fscreen_tb">mF_fscreen_tb</option>     
					<option value="mF_YSlider">mF_YSlider</option>     
					<option value="mF_luluJQ">mF_luluJQ</option>     
					<option value="mF_51xflash">mF_51xflash</option>     
					<option value="mF_expo2010">mF_expo2010</option>     
					<option value="mF_games_tb">mF_games_tb</option>     
					<option value="mF_ladyQ">mF_ladyQ</option>     
					<option value="mF_liquid">mF_liquid</option>     
					<option value="mF_liuzg">mF_liuzg</option>     
					<option value="mF_pithy_tb">mF_pithy_tb</option>     
					<option value="mF_qiyi">mF_qiyi</option>     
					<option value="mF_quwan">mF_quwan</option>     
					<option value="mF_rapoo">mF_rapoo</option>     
					<option value="mF_sohusports">mF_sohusports</option>     
					<option value="mF_taobao2010">mF_taobao2010</option>     
					<option value="mF_taobaomall">mF_taobaomall</option>     
					<option value="mF_tbhuabao">mF_tbhuabao</option>     
					<option value="mF_pconline">mF_pconline</option>     
					<option value="mF_peijianmall">mF_peijianmall</option>     
					<option value="mF_classicHC">mF_classicHC</option>     
					<option value="mF_classicHB">mF_classicHB</option>     
					<option value="mF_slide3D">mF_slide3D</option>     
					<option value="mF_kiki">mF_kiki</option>     
					<option style="color:#f00;" value="mF_fancy" selected="selected">mF_fancy</option>     
					<option style="color:#f00;" value="mF_dleung">mF_dleung</option>     
					<option style="color:#f00;" value="mF_kdui">mF_kdui</option>     
					<option style="color:#f00;" value="mF_shutters">mF_shutters</option>   
					<option style="color:#090;" value="more">更多...</option> 
				</select>   
			</div>
		</div>
	</div>
</div>

<script type="text/javascript">
	var $id=function(id){return document.getElementById(id)};
	  var oriHtml=$id('focus_box').innerHTML;
	  function resetHTML(){//还原
			$id('focus_box').innerHTML=oriHtml;
			var css=document.getElementsByTagName('style')[0];
			css.parentNode.removeChild(css);
		}
function pageInit(){
	var pattern=location.href.split('pattern=')[1];
	if(pattern) $id('focus_pattern').value=pattern;
	myFocus.set({id:'focus',pattern:$id('focus_pattern').value});
}
pageInit();
		$id('focus_pattern').onchange=function(){
if(this.value==='more'){//更多风格
location.href='more.html';
return;
}			
resetHTML();
			myFocus.set({id:'focus',pattern:this.value,loadIMGTimeout:0});
		}
</script>
</body>
</html>

JS代码(myfocus-2.0.4.min.js):

/*! myFocus v2.0.4 | https://github.com/koen301/myfocus */
eval(function(p,a,c,k,e,r){
	e=function(c){
	return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))}
;
	if(!''.replace(/^/,String)){
	while(c--)r[e(c)]=k[c]||e(c);
	k=[function(e){
	return r[e]}
];
	e=function(){
	return'\\w+'}
;
	c=1}
;
	while(c--)if(k[c])p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c]);
	return p}
('(6(){
	7 q=6(a){
	9 P a===\'1O\'?W.4c(a):a}
,$M=6(a,b){
	9(q(b)||W).3G(a)}
,$3F=6(a,b){
	9 $2H(a,b,\'M\')}
,$18=6(a,b){
	7 c=$M(\'*\',b),1f=[];
	B(7 i=0,l=c.K;
	i<l;
	i++){
	8(2G(a,c[i])){
	1f.z(c[i])}
}
9 1f}
,$3o=6(a,b){
	9 $2H(a,b)}
,$2H=6(a,b,c){
	7 d=[],R=c===\'M\'?$M:$18,1C=R(a,b),v=1C.K;
	B(7 i=0;
	i<v;
	i++){
	8(1C[i].1d===b)d.z(1C[i]);
	i+=R(a,1C[i]).K}
9 d}
,2G=6(a,b){
	9 3i(\'/(^|\\\\s)\'+a+\'(\\\\s|$)/\').2D(b.23)}
;
	u=6(a){
	9 1b u.1U(a)}
;
	u.N=6(){
	7 a=3f,v=a.K;
	8(3===u){
	8(v===1)1E=u,i=0;
	E 1E=a[0],i=1}
E{
	1E=3,i=0}
B(i;
	i<v;
	i++){
	B(7 p 25 a[i]){
	1E[p]=a[i][p]}
}
9 1E}
;
	u.N({
	2C:{
	G:\'48\',2B:\'2z\',35:\'2w\',22:y,29:y,2Z:4,1x:0,2Y:y,1F:2u,28:D,2s:1g,2r:\'\',2R:y}
,1U:6(a){
	7 e=a,v=e&&e.K;
	8(e 4B u.1U)9 e;
	3.K=0;
	8(!e||(e.4V&&!v)||(e.2Q&&!v)){
	1K.1G.z.L(3)}
E 8(e.2R){
	e=q(e.H);
	1K.1G.z.L(3,e);
	3.2q=a;
	3.1q=$M(\'1h\',$M(\'1i\',e)[0]);
	3.1W=3.1q.K}
E 8(v){
	B(7 i=0;
	i<v;
	i++)1K.1G.z.L(3,e[i])}
E{
	1K.1G.z.L(3,e)}
9 3}
,R:{
	3K:[].3K}
,G:{
}
,2o:{
}
}
);
	u.1U.1G=u.R;
	u.R.N=u.G.N=u.2o.N=u.N;
	u.R.N({
	21:6(b){
	7 c=3,12=D,$=u;
	7 d=3.3B(b);
	8(3.K)B(7 i=0,v=d.K;
	i<v;
	i++){
	7 f=[],s=d[i];
	3b(s.4M(0)){
	1o\'>\':12=y;
	15;
	1o\'.\':7 g=s.2h(1);
	7 h=12?$3o:$18;
	$(c).1B(6(){
	f=f.4K(h(g,3))}
);
	12=D;
	15;
	1o\'#\':7 j=s.2h(1),e=q(j);
	8(e)f.z(q(j));
	12=D;
	15;
	2w:7 h=12?$3F:$M,2f=s.40(\'.\');
	7 k=2f[0],g=2f[1];
	$(c).1B(6(){
	7 a=h(k,3);
	B(7 i=0,v=a.K;
	i<v;
	i++){
	8(g&&!2G(g,a[i]))2d;
	f.z(a[i])}
}
);
	12=D}
8(!12)c=f}
9 $(c)}
,3L:6(){
	9 u(3[0].1d)}
,Y:6(s){
	8(P s!==\'2a\'){
	3[0].Q=s;
	9 3}
E 9 3[0].Q}
,1B:6(a){
	7 b=3;
	B(7 i=0,v=b.K;
	i<v;
	i++){
	7 c=a.L(b[i],i);
	8(c===D)15;
	8(c===y)2d}
9 3}
,4L:6(n){
	9 u(3[n])}
,3B:6(a){
	7 b=/(([^[\\]\'"]+)+\\]|\\\\.|([^ >+~,(\\[\\\\]+)+|[>+~])(\\s*,\\s*)?/g;
	7 c=[],m;
	5j((m=b.3Z(a))!==1g){
	c.z(m[1])}
9 c}
,22:6(a){
	7 o=3[0],e=W.1D(\'T\');
	e.Q=a;
	7 b=e.39;
	o.1d.4d(b,o);
	b.1L(o);
	9 3}
,2U:6(a){
	7 b=3[0];
	7 e=W.1D(\'T\');
	e.Q=a;
	7 c=e.4C[0];
	b.1L(c);
	9 u(c)}
,1N:6(a,b){
	7 c=3.1q,n=3.1W;
	7 d=[\'<T 18="\'+a+\'"><1i>\'];
	B(7 i=0;
	i<n;
	i++){
	7 e=$M(\'11\',c[i])[0],Y;
	3b(b){
	1o\'2t\':Y=\'<a>\'+(i+1)+\'</a><b></b>\';
	15;
	1o\'1Q\':Y=e?c[i].Q.1r(/\\<11(.|\\n|\\r)*?\\>/i,e.30)+\'<p>\'+e.1l("1k")+\'</p><b></b>\':\'\';
	15;
	1o\'1t\':Y=e?\'<a><11 U=\'+(e.1l("1t")||e.U)+\' /></a><b></b>\':\'\';
	15;
	2w:Y=\'<a></a><b></b>\'}
d.z(\'<1h>\'+Y+\'</1h>\')}
d.z(\'</1i></T>\');
	9 3.2U(d.1u(\'\'))}
,4e:6(a){
	9 3.1N(a||\'2t\',\'2t\')}
,4j:6(a){
	9 3.1N(a||\'1Q\',\'1Q\')}
,4m:6(a){
	9 3.1N(a||\'1t\',\'1t\')}
,3C:6(){
	7 o=3[0];
	8(o)o.1d.4y(o)}
,4A:6(n){
	7 n=n||2,1Z=3[0].1d,Y=1Z.Q,s=[];
	B(7 i=0;
	i<n;
	i++)s.z(Y);
	1Z.Q=s.1u(\'\');
	9 u(1Z).21(3[0].4D)}
}
);
	u.R.N({
	C:6(b){
	7 o=3[0],X,1f=[\';
	\'],1j=u.1j;
	8(!o)9 3;
	8(P b===\'1O\'){
	8(b===\'1H\')b=1j?\'56\':\'59\';
	8(!(X=o.S[b]))X=(1j?o.5o:3X(o,\'\'))[b];
	8(b===\'V\'&&X===2a)X=1;
	8(X===\'29\'&&(b===\'O\'||b===\'x\'))X=o[\'46\'+b.1r(/\\w/i,6(a){
	9 a.47()}
)];
	7 c=3j(X);
	9 3k(c)?X:c}
E{
	B(7 p 25 b){
	8(P b[p]===\'1P\'&&!3.2P[p])b[p]+=\'J\';
	1f.z(p.1r(/([A-Z])/g,\'-$1\')+\':\'+b[p]+\';
	\');
	8(p===\'V\')1f.z(\'2X:33(V=\'+b[p]*2u+\')\')}
o.S.27+=1f.1u(\'\');
	9 3}
}
,3a:6(a){
	3[0].S.V=a,3[0].S.2X=\'33(V=\'+a*2u+\')\'}
,3g:6(a,b,m){
	3[0].S[b]=20[m](a)+\'J\'}
,2b:6(a){
	3[0].23+=\' \'+a;
	9 3}
,3x:6(a){
	7 o=3[0],2c=a&&o.23,3E="/\\\\s*\\\\b"+a+"\\\\b/g";
	o.23=2c?2c.1r(3i(3E),\'\'):\'\';
	9 3}
,2P:{
	4O:y,4P:y,4Q:y,V:y,5C:y,4W:y,4X:y,51:y}
}
);
	u.R.N({
	1X:6(a,f,g,h,i,j){
	7 k=3,o=k[0],2S=a===\'V\',2e=D;
	i&&i.L(o);
	8(P f===\'1O\'){
	8(/^[+-]=\\d+/.2D(f))f=f.1r(\'=\',\'\'),2e=y;
	f=3j(f)}
7 l=k.C(a),b=3k(l)?0:l,c=2e?f:f-b,d=g,e=3.2W[h],m=c>0?\'3V\':\'3W\',1n=\'32\'+a,2g=k[2S?\'3a\':\'3g\'],34=(1b 38)*1;
	o[1n]&&1R(o[1n]);
	o[1n]=2i(6(){
	7 t=(1b 38)-34;
	8(t<=d){
	2g.L(k,e(t,b,c,d),a,m)}
E{
	2g.L(k,b+c,a,m);
	1R(o[1n]),o[1n]=1g;
	j&&j.L(o)}
}
,13);
	9 3}
,4b:6(a,b,c){
	8(P a!==\'1P\')c=a,a=3c;
	8(P b===\'6\')c=b,b=\'\';
	3.1X(\'V\',1,a,b||\'2j\',6(){
	u(3).C({
	2k:\'4f\',V:0}
)}
,c);
	9 3}
,4h:6(a,b,c){
	8(P a!==\'1P\')c=a,a=3c;
	8(P b===\'6\')c=b,b=\'\';
	3.1X(\'V\',0,a,b||\'2j\',1g,6(){
	3.S.2k=\'2l\';
	c&&c.L(3)}
);
	9 3}
,3v:6(a,b,c,d){
	8(P b!==\'1P\')d=b,b=4k;
	8(P c===\'6\')d=c,c=\'\';
	B(7 p 25 a)3.1X(p,a[p],b,c||\'2m\',1g,d);
	9 3}
,4l:6(){
	7 o=3[0];
	B(7 p 25 o)8(p.3z(\'32\')!==-1)o[p]&&1R(o[p]);
	9 3}
,2W:{
	2j:6(t,b,c,d){
	9 c*t/d+b}
,4n:6(t,b,c,d){
	9-c/2*(20.4o(20.4p*t/d)-1)+b}
,4r:6(t,b,c,d){
	9 c*(t/=d)*t*t*t+b}
,2m:6(t,b,c,d){
	9-c*((t=t/d-1)*t*t*t-1)+b}
,4t:6(t,b,c,d){
	9((t/=d/2)<1)?(c/2*t*t*t*t+b):(-c/2*((t-=2)*t*t*t-2)+b)}
}
}
);
	u.R.N({
	14:6(a,b){
	u.2n(3[0],a,b);
	9 3}
,4z:6(b,c,d){
	7 f=3,p=f.2q,n=f.1W,t=p.2Z*3D,d=d||D,1H=u(f.1q).C(\'1H\'),1p=1H===\'1y\',2p=1p?\'1y\':\'1e\',1A=1p?p.O:p.x,1v=0,I=p.1x;
	f.21(\'.2T\').3C();
	f.1w=6(a){
	b&&b(1v,n);
	I=P a===\'1O\'?1v+4U(a.1r(\'=\',\'\')):a;
	8(I<=-1){
	I=n-1;
	8(d)f.1q[0].1d.S[2p]=-n*1A+\'J\'}
8(I>=n){
	8(!d)I=0;
	8(I>=2*n){
	f.1q[0].1d.S[2p]=-(n-1)*1A+\'J\';
	I=n}
}
8(d&&1v>=n&&I<n)I+=n;
	c&&c(I,n,1v);
	f.2V=1v=I;
	p.2s&&p.2s.L(f,I)}
;
	1T{
	f.1w(I)}
1S(e){
	1M(6(){
	f.1w(I)}
,0)}
;
	8(p.29&&n>1){
	f.1I=2i(6(){
	f.1w(\'+=1\')}
,t);
	f.14(\'24\',6(){
	1R(f.1I);
	f.1I=\'31\'}
).14(\'2v\',6(){
	8(!f.5w&&f.1I===\'31\')f.1I=2i(6(){
	f.1w(\'+=1\')}
,t)}
)}
f.21(\'a\').1B(6(){
	3.5B=6(){
	3.3T()}
}
)}
,3U:6(a,b){
	7 c=3,p=c.2q,1s=p.2B,1F=p.1F,2x=b||{
}
,1Y=2x.36||p.36;
	7 d=6(){
	8(3.1x!==c.2V&&!2x.3Y){
	c.1w(3.1x);
	9 D}
}
;
	a.1B(6(i){
	3.1x=i;
	7 o=3,$o=u(o);
	8(1s===\'2z\'){
	$o.14(\'24\',6(){
	$o.2b(\'37\')}
).14(\'2v\',6(){
	$o.3x(\'37\')}
).14(\'2z\',d)}
E 8(1s===\'24\'){
	$o.14(\'24\',6(){
	8(1F===0)d.L(o);
	E a.2y=1M(6(){
	d.L(o)}
,1F)}
).14(\'2v\',6(){
	a.2y&&41(a.2y)}
)}
E{
	42(\'u 43 44(2B):\\"\'+1s+\'\\"\');
	9 D}
}
);
	8(1Y){
	7 e=a.C(\'1H\'),1p=e===\'1y\'||e===\'45\';
	a.1V=1p?\'1y\':\'1e\';
	a.n=c.1W;
	a.2A=1Y;
	a.1a=p.1x;
	a.1J=a.1a+1Y-1;
	a.1A=a.C(1p?\'O\':\'x\');
	a.3d=a.3L()}
}
,49:6(i,a){
	7 n=3.n,1V=3.1V,$1i=3.3d,C={
}
;
	8(i>=3.1J){
	3.1J=i<n-1?i+1:i;
	3.1a=3.1J-3.2A+1}
E 8(i<=3.1a){
	3.1a=i>0?i-1:0;
	3.1J=3.1a+3.2A-1}
C[1V]=-3.1a*3.1A;
	$1i.3v(C,a||4a,\'2m\');
	9 3}
}
);
	u.N({
	3e:6(p,c){
	7 F=3,H=p.H,17=F.3h(H);
	p.G=p.G||F.2C.G;
	p.1c=p.G+\'4g\'+H;
	F.2n(2E,\'4i\',6(){
	F.2F=y}
);
	F.3l(p,6(){
	p=F.N({
}
,F.2C,F.2o[p.G],p);
	F.3m(p,6(){
	7 b=F(q(H));
	p.$o=b;
	p.2r&&F.3n(p);
	p.19=$18(\'19\',b[0])[0];
	p.O=p.O||b.C(\'O\'),p.x=p.x||b.C(\'x\');
	F.3p(p,17);
	b.2b(p.G+\' \'+p.1c);
	F.3q(p,6(a){
	8(p.28)F.3r(p,a);
	F.G[p.G](p,F);
	c&&c()}
)}
)}
)}
,2F:D,3l:6(p,a){
	8(3.G[p.G]){
	a();
	9}
7 b=3.3s()+\'4q-G/\'+p.G;
	7 c=W.1D("3t"),C=W.1D("4s"),U=b+\'.3u\',1z=b+\'.C\';
	c.1s="1k/4v",c.U=U;
	C.4w="4x",C.1z=1z;
	7 d=$M(\'3w\')[0],26=D,3y=10*3D;
	d.1L(C);
	d.1L(c);
	c.2I=c.3A=6(){
	8(26)9;
	8(!c.2J||c.2J=="4E"||c.2J=="4F"){
	26=y;
	a();
	c.2I=c.3A=1g}
}
;
	1M(6(){
	8(!26)q(p.H).Q=\'加载失败:\'+U}
,3y)}
,3s:6(){
	7 a=\'\';
	7 b=$M("3t");
	B(7 i=0,v=b.K;
	i<v;
	i++){
	7 c=b[i].U;
	8(c&&/4G([\\.-].*)?\\.3u/i.2D(c)){
	a=c;
	15}
}
;
	9 a.2h(0,a.4H(\'/\')+1)}
,3m:6(p,a){
	7 F=3;
	(6(){
	1T{
	8(F.1j)q(p.H).4I();
	E q(p.H).Q;
	a()}
1S(e){
	8(!F.2F)1M(3f.4J,0)}
}
)()}
,3q:6(p,a){
	7 b=p.2Y;
	7 c=q(p.H),11=$M(\'11\',p.19),v=11.K,2K=0,2L=D,2M=1b 1K(v);
	8(!b||!v){
	a();
	9}
B(7 i=0;
	i<v;
	i++){
	7 d=1b 4N();
	d.i=i;
	d.2I=6(){
	2K+=1;
	2M[3.i]={
	w:3.O,h:3.x}
;
	8(2K==v&&!2L){
	2L=y,a(2M)}
}
;
	d.U=11[i].U}
}
,3r:6(p,a){
	7 b=$M(\'11\',p.19),v=b.K,1m=p.O,16=p.x;
	B(7 i=0;
	i<v;
	i++){
	7 w=a[i].w,h=a[i].h;
	8(w==1m&&h==16)2d;
	8(w<1m&&h<16){
	7 c=w,x=h,1e=(16-x)/2}
E 8(w/h>=1m/16){
	7 c=1m,x=1m/w*h,1e=(16-x)/2}
E{
	7 c=16/h*w,x=16,1e=0}
b[i].S.27=\';
	O:\'+c+\'J;
	x:\'+x+\'J;
	3H-1e:\'+1e+\'J;
	\'}
}
,3p:6(p,a){
	7 b=[],w=p.O||\'\',h=p.x||\'\';
	8(p.19){
	b.z(\'.\'+p.1c+\' *{
	3H:0;
	4R:0;
	4S:0;
	4T-S:2l;
}
.\'+p.1c+\'{
	3I:3J;
	O:\'+w+\'J;
	x:\'+h+\'J;
	2N:2O;
	4Y:4Z/1.5 50;
	1k-3M:1y;
	52:#53;
	54:55!3N;
}
.\'+p.1c+\' .19{
	3I:3J;
	O:\'+w+\'J;
	x:\'+h+\'J;
	2N:2O;
}
.\'+p.1c+\' .1Q 1h{
	O:\'+w+\'J;
	x:\'+p.35+\'J!3N;
	2N:2O;
}
\');
	8(p.22)p.$o.22(\'<T 18="\'+p.G+\'57"></T>\');
	8(p.28)b.z(\'.\'+p.1c+\' .19 1h{
	1k-3M:58;
	O:\'+w+\'J;
	x:\'+h+\'J;
}
\')}
1T{
	a.3O.27=b.1u(\'\')}
1S(e){
	a.Q=b.1u(\'\')}
}
,3h:6(a){
	7 s=\'#\'+a+\' *{
	2k:2l}
\',17=W.1D(\'S\');
	17.1s=\'1k/C\';
	1T{
	17.3O.27=s}
1S(e){
	17.Q=s}
7 b=$M(\'3w\',W)[0];
	b.5a(17,b.39);
	9 17}
}
);
	u.N({
	1j:!!(W.5b&&5c.5d.3z(\'5e\')===-1),2n:6(o,a,b){
	7 c=3.1j,e=c?\'5f\':\'5g\',t=(c?\'5h\':\'\')+a;
	o[e](t,6(e){
	7 e=e||2E.5i,3P=b.L(o,e);
	8(3P===D){
	8(c)e.5k=y,e.5l=D;
	E e.5m(),e.5n()}
}
,D)}
,3n:6(p){
	7 a=2E.3Q?1b 3Q():1b 5p("5q.5r");
	a.5s("5t",p.2r+"?"+20.5u(),D);
	a.5v(1g);
	3.3R(a.5x,p)}
,3R:6(a,p){
	7 b=a.5y.3G("2Q"),v=b.K;
	7 c=[\'<T 18="2T"></T><T 18="19"><1i>\'];
	B(7 i=0;
	i<v;
	i++){
	c.z(\'<1h><a 1z="\'+b[i].1l(\'1z\')+\'"><11 U="\'+b[i].1l(\'5z\')+\'" 1t="\'+b[i].1l(\'1t\')+\'" 30="\'+b[i].1l(\'5A\')+\'" 1k="\'+b[i].1l(\'1k\')+\'" /></a></1h>\')}
c.z(\'</1i></T>\');
	p.$o[0].Q=c.1u(\'\')}
}
);
	8(P 3S!==\'2a\'){
	3S.R.N({
	u:6(p,a){
	8(!p)p={
}
;
	p.H=3[0].H;
	8(!p.H)p.H=3[0].H=\'4u\';
	u.3e(p,a)}
}
)}
}
)();
	',62,349,'|||this|||function|var|if|return|||||||||||||||||||||myFocus|len||height|true|push||for|css|false|else||pattern|id|indexCurrent|px|length|call|tag|extend|width|typeof|innerHTML|fn|style|div|src|opacity|document|value|html|||img|isChild||bind|break|boxHeight|oStyle|class|pic|showStart|new|__clsName|parentNode|top|arr|null|li|ul|isIE|text|getAttribute|boxWidth|timerId|case|isLevel|HTMLUList|replace|type|thumb|join|indexLast|run|index|left|href|distance|each|doms|createElement|dest|delay|prototype|float|runTimer|showEnd|Array|appendChild|setTimeout|addList|string|number|txt|clearInterval|catch|try|constr|dir|HTMLUListLength|animate|tsNum|pNode|Math|find|wrap|className|mouseover|in|isSuccess|cssText|autoZoom|auto|undefined|addClass|cls|continue|diffValue|sArr|setProperty|slice|setInterval|linear|display|none|easeOut|addEvent|config|direction|settings|xmlFile|onChange|num|100|mouseout|default|par|mouseoverTimer|click|showNum|trigger|defConfig|test|window|onloadWindow|hasClass|getChild|onload|readyState|count|done|arrSize|overflow|hidden|cssNumber|item|__focusConstr__|isOpacity|loading|addHtml|runIndex|easing|filter|loadingShow|time|alt|pause|__myFocusTimer__|alpha|origTime|txtHeight|thumbShowNum|hover|Date|firstChild|setOpacity|switch|400|slideBody|set|arguments|setAnimateStyle|initBaseCSS|eval|parseFloat|isNaN|loadPattern|getBoxReady|loadXML|class_|initCSS|getIMGReady|zoomIMG|getFilePath|script|js|slide|head|removeClass|timeout|indexOf|onreadystatechange|parseSelector|remove|1000|reg|tag_|getElementsByTagName|margin|position|relative|splice|parent|align|important|styleSheet|flag|XMLHttpRequest|appendXML|jQuery|blur|bindControl|ceil|floor|getComputedStyle|isRunning|exec|split|clearTimeout|alert|Error|Setting|right|offset|toUpperCase|mF_fancy|scrollTo|500|fadeIn|getElementById|replaceChild|addListNum|block|_|fadeOut|load|addListTxt|800|stop|addListThumb|swing|cos|PI|mf|easeIn|link|easeInOut|mF__ID__|javascript|rel|stylesheet|removeChild|play|repeat|instanceof|childNodes|nodeName|loaded|complete|myfocus|lastIndexOf|doScroll|callee|concat|eq|charAt|Image|fillOpacity|fontWeight|lineHeight|padding|border|list|parseInt|sort|widows|zIndex|font|12px|Verdana|zoom|background|fff|visibility|visible|styleFloat|_wrap|center|cssFloat|insertBefore|all|navigator|userAgent|Opera|attachEvent|addEventListener|on|event|while|cancelBubble|returnValue|stopPropagation|preventDefault|currentStyle|ActiveXObject|Microsoft|XMLDOM|open|GET|random|send|isStop|responseXML|documentElement|image|title|onfocus|orphans'.split('|'),0,{
}
))

CSS代码(main.css):

@CHARSET "UTF-8";*{margin:0;padding:0;list-style:none;}
body{background:#f0f0f0;color:#333;font:12px/22px Verdana,Geneva,sans-serif;}
img{border:0;}
.clear{clear:both;height:0;overflow:hidden;}
a{color:#333;text-decoration:none;}
a:hover{text-decoration:underline;}
.red{color:#A74040;}
.mbox{width:960px;margin:0 auto;position:relative;}
#myTop{height:28px;line-height:28px;background:#585858 url(../images/global_nav_bg.jpg) repeat-x;overflow:hidden;font-family:Arial,Helvetica,sans-serif;}
#myTop ul.nav li{height:28px;float:left;border-left:1px solid #555;border-right:1px solid #333;}
#myTop ul.nav li.line{width:1px;background:#333;border:0;}
#myTop ul.nav li.last{background:#555;}
#myTop ul.nav li a{display:block;color:#ccc;padding:0 10px;}
#myTop ul.nav li a:hover,#myTop ul li.current a{background:url(../images/hover_bg.png) left repeat-x;color:#fff;text-decoration:none;}
#myTop ul.nav li.index a{width:22px;height:28px;background:url(../images/icon.png) center no-repeat;}
#myTop ul.admin{position:absolute;right:0;}
#myTop ul.admin li{height:28px;float:left;}
#myTop ul.admin li a{display:block;color:#ccc;padding:0 10px;}
#myTop ul.admin li a:hover{background:url(../images/hover_bg.png) left repeat-x;color:#fff;text-decoration:none;}
#header{}
#header .mbox{border-bottom:18px solid #5D5D5D;background:#fff;}
#header .logo{height:96px;width:297px;overflow:hidden;padding-top:4px;}
#header .nav{position:absolute;right:0;top:36px;background:#6C6C6C;border:3px solid #f1f1f1;}
#header .nav li{float:left;border-right:1px solid #444;border-left:1px solid #858585;height:34px;line-height:34px;}
#header .nav li a{display:block;padding:0 20px;color:#fff;}
#header .nav li a.current{background:#9DA4A9;}
#container{background:#fff;border-bottom:2px solid #9DA4A9;}
#focus_wrap{width:100%;margin-top:38px;text-align:center;}
#focus_box{display:inline-block;*display:inline;*zoom:1;}
#focus{width:560px;height:300px;display:inline-block;*display:inline;*zoom:1;}
#focus_set{margin-top:40px;position:relative;text-align:right;padding-right:10px;}
#focus_set span{color:#999;}
div.right a{color:#0F67A1}
div.right a{text-decoration:underline;}
div.right pre{padding:5px;display:block;background:#F2F3F7;border:1px dashed #ccc;margin-top:20px;}
div.right pre code{font:12px/1.5em "Courier New",Courier,monospace;}
div.right pre code.css{white-space:normal;}
div.right pre code.js{white-space:pre;}
div.right pre code b{color:#c00;}
div.right pre code span{color:#06F;}
#container div.left{float:left;width:180px;border:1px solid #ccc;margin-left:20px;padding:16px;}
#container div.left li{border-bottom:1px solid #ccc;height:26px;line-height:26px;}
#container div.left li.cur{background:#0F67A1;}
#container div.left li.cur a{color:#fff;}
#container div.right,#comments{margin-left:256px;padding:10px 10px 50px;}
#container div.right h4,#container div.right h6{font-size:18px;height:30px;line-height:30px;}
#container div.right h6{font-size:14px;background:#A6CAF6;border-bottom:1px solid #A6CAF6;padding-left:10px;}
#container div.right .box{border:1px solid #A6CAF6;padding:10px;}
#container div.right p,#container div.right ul,#container div.right dl{margin:16px 0;font-size:12px;}
#container div.right ul{margin-left:20px;}
#container div.right ul li{list-style:circle;}
#container div.right dl dt{font-size:12px;height:30px;line-height:30px;font-weight:bold;margin-top:16px;padding-left:16px;background:url(../images/li.png) left center no-repeat;}
#container div.right dl dd{margin-left:18px;}
#container div.right ul.settings{background:#f1f1f1;margin-left:0;border-top:1px solid #ccc;}
#container div.right ul.settings li{border-bottom:1px solid #ccc;list-style:none;padding:6px 10px 0;}
#container div.right ul.settings li h5,#container div.right ul.settings li span{display:inline-block;*display:inline;*zoom:1;width:200px;}
#container div.right ul.settings li span{color:#888;}
#container div.right ul.settings li p{margin:6px 0;}
#container div.right h3{font-size:14px;height:30px;line-height:30px;margin-top:10px;color:#fff;padding-left:10px;background:#9DA4A9;}
#container div.right dl.api{}
#container div.right dl.api dt{font:bold 16px/30px "Trebuchet MS",Verdana,Helvetica,Arial,sans-serif;color:#333;margin-top:12px;position:relative;}
#container div.right dl.api dt span{position:absolute;right:0;font-size:12px;font-weight:normal;color:#666;}
#container div.right dl.api dd{border-bottom:1px solid #dedede;padding-left:10px;color:#666;margin-left:12px;}
#focus_tip{margin-top:40px;border-top:10px solid #EEECEC;padding:20px 40px;}
#focus_tip a{color:#0F67AE;}
#focus_tip ul li{list-style:circle;}
#focus_download{background:#9DA4A9;text-align:right;padding:40px;}
#focus_download a{display:inline-block;*display:inline;*zoom:1;font-size:1.2em;padding:.3em 1.1em;color:#fff;font-weight:bold;text-decoration:none;text-transform:uppercase;border:1px solid #000;background:#666 url(../images/btn_graygrad.jpg) top repeat-x;}
#footer{height:80px;color:#888;line-height:22px;margin-top:12px;text-align:right;}
#footer .mbox{background-color:transparent;}
#footer .mbox a{color:#666;}
#comment-post textarea{background:none repeat scroll 0 0 #FFFFFF;border-color:#CCCCCC #EEEEEE #EEEEEE #CCCCCC;border-radius:3px 3px 3px 3px;border-style:solid;border-width:1px;color:#666666;font-size:12px;margin:0;overflow:auto;padding:0.29em 0;width:100%;}
#comment-post #submit{background:none repeat scroll 0 0 #464646;border:1px solid #333333;border-radius:30px 30px 30px 30px;color:#FFFFFF;cursor:pointer;margin-top:10px;padding:3px;width:200px;}
#comment-post #submit:hover{background:none repeat scroll 0 0 #666666;}
#comments{margin-top:0px;padding:0px 10px 50px;}
.commentsorping{height:22px;}
.commentsorping .commentsays{float:left;font-size:16px;width:502px;}
.commentsorping .commentpart,.commentsorping .pingpart{cursor:pointer;float:left;text-align:right;}
.commentsorping .commentpart{width:100px;}
.commentsorping .pingpart{width:75px;}
.commentnav{float:right;margin-top:10px;}
.commentnav a,.commentnav a:link,.commentnav a:active,.commentnav span.pages{background:none repeat scroll 0 0 #F9F9F9 !important;border:1px solid #DFDFDF !important;color:#222222 !important;padding:4px 8px !important;}
.commentnav span,.pagenavi a{margin:2px;}
.commentnav span.pages{margin:2px 2px 2px 0 !important;}
.commentnav a:hover{background:none repeat scroll 0 0 #EEEEEE !important;border:1px solid #AAAAAA !important;text-decoration:none;}
.commentnav span.current{background:none repeat scroll 0 0 #EEEEEE !important;border:1px solid #BBBBBB !important;padding:4px 8px !important;}
.commentnav span.extend{background:none repeat scroll 0 0 transparent !important;border:0 none !important;font-weight:bold !important;}
.commentlist li{background:none repeat scroll 0 0 #FFFFFF;border:1px solid #CCCCCC;border-radius:3px 3px 3px 3px;margin-top:5px;padding:10px;}
.commentlist li .children-first{padding-left:26px;}
.commentlist li .children li{border-color:#EEEEEE -moz-use-text-color -moz-use-text-color;border-left:medium none;border-radius:0 0 0 0;border-right:medium none;border-style:dashed none none;border-width:1px medium medium;padding:0;}
.comment-body .commenttext{padding:5px 0;position:relative;line-height:20px;}
.comment-body .commenttext .commenttime{color:#666;}
.comment-body .commenttext .gravatar{border:1px solid #d1d1d1;float:left;height:50px;padding:2px;width:50px;}
.children .comment-body .commenttext .gravatar{height:32px;width:32px;}
.comment-body .commenttext .comment-meta,.comment-body .commenttext .commentp{margin-left:66px;}
.children .comment-body .commenttext .comment-meta,.children .comment-body .commenttext .commentp{margin-left:48px;}
.comment-body .commenttext .commentp{position:relative;}
.comment-body .commenttext .commentp .reply{border-color:#D6D6D6 -moz-use-text-color #D6D6D6 #D6D6D6;border-style:solid none solid solid;border-width:1px medium 1px 1px;bottom:0;box-shadow:-1px 1px 4px #CCCCCC;display:none;position:absolute;right:-10px;text-align:center;width:50px;}
.comment-body .commenttext .commentp .reply a{display:block;cursor:pointer;}
.comment-body .commenttext .commentp .reply a:hover{background:none repeat scroll 0 0 #F1F1F1;text-decoration:none;}
.comment-body .commenttext .comment-meta .commentid{font-weight:bold;}
.comment-body .commenttext .comment-meta .commentcount{position:absolute;right:0;top:0;}
#comment-post{background:none repeat scroll 0 0 #FFFFFF;border:1px solid #CCCCCC;border-radius:3px 3px 3px 3px;margin-top:15px;padding:10px;position:relative;}
#comment-post h2{font-size:18px;font-weight:normal;margin-bottom:6px;}
#comment-post #cancel-comment-reply{position:absolute;right:10px;top:10px;}
#comments .tip{background:none repeat scroll 0 0 #FFFFFF;border:1px solid #D6D6D6;border-radius:3px 3px 3px 3px;box-shadow:-1px 1px 10px #EEEEEE;margin:0;padding:3px;position:absolute;width:400px;z-index:3;}
#comments .tip .act{display:none;}
#comments .tip .commenttext{background:none repeat scroll 0 0 #FFFFFF;border:medium none;margin:0;padding:0;}
.atreply{cursor:help;}
#author_info{margin-top:10px;}
.writerinfodiv{margin:5px 0;}
#author_info .writerinfodiv input{border:1px solid #DDDDDD;border-radius:3px 3px 3px 3px;padding:3px;width:230px;}
#author_info .writerinfodiv label{color:#666666;margin-left:5px;}
#cancel-reply{position:absolute;right:10px;top:10px;}

附件:下载该文件资源,减少时间成本(增值服务)