电玩巴士jQuery焦点图轮播滚动切换特效代码

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

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

以下是电玩巴士jQuery焦点图轮播滚动切换特效代码的示例演示效果:

当前平台(PC电脑)

平台:

整屏预览

部分效果截图:

HTML代码(index.html):

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>电玩巴士jQuery焦点图</title>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <link href="css/zzsc.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript" src="js/jquery.js"></script>
    <script type="text/javascript" src="js/jquery.kom.min.js"></script>
</head>

<body>
    <div id="main" class="area">
        <div class="l">
            <div class="s l p1 focus">
                <div class="img">
                    <a href="#"><img class='pic1' src='images/2013050911264681.jpg' width='371' height='237' border='0' /></a>
                    <a href="#"><img class='pic1' src='images/2013051009355819.jpg' width='371' height='237' border='0' /></a>
                    <a href="#"><img class='pic1' src='images/2013051010545764.jpg' width='371' height='237' border='0' /></a>
                    <a href="#"><img class='pic1' src='images/2013050910414170.jpg' width='371' height='237' border='0' /></a>
                    <a href="#"><img class='pic1' src='images/2013051010251010.jpg' width='371' height='237' border='0' /></a>
                    <a href="#"><img class='pic1' src='images/2013050811250178.jpg' width='371' height='237' border='0' /></a>
                    <a href="#"><img class='pic1' src='images/2013051009375628.jpg' width='371' height='237' border='0' /></a>
                    <a href="#"><img class='pic1' src='images/2013050813363136.jpg' width='371' height='237' border='0' /></a>
                </div>
                <ul>
                    <li><span></span><a href="#">机战</a></li>
                    <li><span></span><a href="#">淘乐</a></li>
                    <li><span></span><a href="#">轩辕剑</a></li>
                    <li><span></span><a href="#">魔兽</a></li>
                    <li><span></span><a href="#">囧图</a></li>
                    <li><span></span><a href="#">大决战</a></li>
                    <li><span></span><a href="#">游戏</a></li>
                    <li><span></span><a href="#">微软</a></li>
                </ul>
            </div>
            <script type="text/javascript">$('.focus .img').rotFocus({ button: '.focus ul', clickChange: false, interval: 3700, easing: 'slideRight' }); $('.focus ul li:last').addClass('e');</script>
        </div>
    </div>
</body>
</html>

JS代码(jquery.kom.min.js):

(function($){
	$.fn.rotFocus=function(options){
	if(this.length==0)return;
	var defaults={
	button:null,prep:null,next:null,clickChange:true,interval:5000,easing:'slideLeft',callback:null}
;
	var o=$.extend(defaults,options);
	if(o.button==null||o.button=='')o.button=$(Array());
	else o.button=$(o.button);
	if(o.interval==null)o.interval=-1;
	else o.interval=parseInt(o.interval);
	if(o.easing==null)o.easing='none';
	var count=this.css('position','relative').show().children().css('position','absolute').length;
	var fn='JQUERY_KOM_ROTFOCUS_FN_'+parseInt(Math.random()*1000000);
	var cur=-1;
	var width=this.width();
	var height=this.height();
	var timer=null;
	var panel=this.children();
	o.button=o.button.children();
	window[fn]=function(dir){
	var next,_easing;
	clearTimeout(timer);
	if(dir=='p'){
	next=cur<=0?count-1:cur-1;
	if(o.easing=='slideLeft')_easing='slideRight';
	else if(o.easing=='slideRight')_easing='slideLeft';
	else if(o.easing=='slideUp')_easing='slideDown';
	else if(o.easing=='slideDown')_easing='slideUp'}
else if(typeof(dir)=='number'){
	next=parseInt(dir);
	_easing=o.easing}
else{
	next=cur>count-2?0:cur+1;
	_easing=o.easing}
;
	if(cur!=next){
	var curp=panel.eq(cur).stop(true,true);
	var nextp=panel.eq(next).stop(true,true);
	if(_easing=='slideLeft'){
	panel.not(curp).css({
	'top':0,'left':width}
);
	curp.animate({
	'top':0,'left':-width}
,'fast');
	nextp.animate({
	'top':0,'left':0}
,'fast')}
else if(_easing=='slideRight'){
	panel.not(curp).css({
	'top':0,'left':-width}
);
	curp.animate({
	'top':0,'left':width}
,'fast');
	nextp.animate({
	'top':0,'left':0}
,'fast')}
else if(_easing=='slideUp'){
	panel.not(curp).css({
	'top':height,'left':0}
);
	curp.animate({
	'top':-height,'left':0}
,'fast');
	nextp.animate({
	'top':0,'left':0}
,'fast')}
else if(_easing=='slideDown'){
	panel.not(curp).css({
	'top':-height,'left':0}
);
	curp.animate({
	'top':height,'left':0}
,'fast');
	nextp.animate({
	'top':0,'left':0}
,'fast')}
else if(_easing=='fade'){
	panel.not(curp).css({
	'z-index':0,'opacity':0}
);
	curp.animate({
	'z-index':5,'opacity':0}
);
	nextp.css({
	'z-index':10}
).animate({
	'opacity':1}
)}
else{
	panel.css({
	'top':0,'left':width}
);
	nextp.css({
	'top':0,'left':0}
)}
;
	if(cur<0)nextp.stop(true,true);
	o.button.removeClass('cur').eq(next).addClass('cur');
	cur=next}
;
	if(o.interval>0)timer=setTimeout(fn+'()',o.interval)}
;
	o.button.each(function(i,n){
	n=$(n);
	if(o.clickChange)n.click(function(){
	eval(fn+'('+i+')')}
);
	else n.mouseover(function(){
	eval(fn+'('+i+')')}
)}
);
	if(o.prep!=null){
	n=$(o.prep);
	if(o.clickChange)n.click(function(){
	eval(fn+'(\'p\')')}
);
	else n.mouseover(function(){
	eval(fn+'(\'p\')')}
)}
;
	if(o.next!=null){
	n=$(o.next);
	if(o.clickChange)n.click(function(){
	eval(fn+'()')}
);
	else n.mouseover(function(){
	eval(fn+'()')}
)}
;
	eval(fn+'()');
	return this}
}
)(jQuery);
	(function($){
	$.fn.countdown=function(timeout,options){
	function parseDate(datestr){
	var par=new Array();
	datestr=datestr.replace('/','-');
	par[0]=datestr.match(/\d+\-\d+\-\d+/g);
	par[0]=par[0]==null?"1901-1-1":par[0].toString();
	par[1]=datestr.match(/\d+:\d+:\d+/g);
	par[1]=par[1]==null?"0:0:0":par[1].toString();
	par[2]=datestr.indexOf('T')>-1?datestr.split('T')[1]:"";
	par[0]=par[0].split("-");
	par[1]=par[1].split(":");
	var date=new Date(par[0][0],par[0][1]-1,par[0][2],par[1][0],par[1][1],par[1][2]);
	if(par[2]!=""){
	par[2]=par[2].split(":");
	par[2]=(eval(par[2][0])*60+eval(par[2][1]))*60000;
	date-=par[2];
	date-=(new Date()).getTimezoneOffset()*60000}
;
	return new Date(date)}
;
	var defaults={
	now:'',format:'HH:MM:ss',expire:'Time out'}
;
	if(typeof(options)=='string')options={
	format:options}
;
	var o=$.extend(defaults,options);
	if(typeof(timeout)=='string'){
	timeout=parseDate(timeout);
	now=(o.now==''||o.now==null)?new Date():parseDate(o.now);
	timeout=parseInt((timeout-now)/1000)}
;
	if(typeof(timeout)=='number'){
	var t=new Date();
	t.setTime(parseInt(new Date().getTime()/1000+1)*1000+parseInt(timeout)*1000);
	timeout=t}
else return this;
	var p=this;
	var fn='JQUERY_KOM_COUNTDOWN_FN_'+parseInt(Math.random()*1000000);
	var i=0;
	window[fn]=function(){
	var t=timeout-new Date();
	var k=0;
	var l=0;
	var s='';
	if(t<0){
	p.html(o.expire);
	return}
else t=parseInt(t/1000);
	if(typeof(o.format)=='function'){
	s=o.format(t)}
else{
	s=o.format;
	var f=o.format.toLowerCase();
	if(f.indexOf('dd')>-1){
	k=parseInt(t/86400);
	s=s.replace(/dd/i,k);
	l+=k*86400}
;
	if(f.indexOf('hh')>-1){
	k=parseInt((t-l)/3600);
	s=s.replace('HH',k<10?('0'+k):k);
	s=s.replace('hh',k);
	l+=k*3600}
;
	if(f.indexOf('mm')>-1){
	k=parseInt((t-l)/60);
	s=s.replace('MM',k<10?('0'+k):k);
	s=s.replace('mm',k);
	l+=k*60}
;
	if(f.indexOf('ss')>-1){
	k=parseInt(t-l);
	s=s.replace('SS',k<10?('0'+k):k);
	s=s.replace('ss',k);
	l+=k}
}
;
	p.html(s);
	i=setTimeout(fn+'()',1000)}
;
	eval(fn+'()');
	return this}
}
)(jQuery);

CSS代码(zzsc.css):

/* global */
body{padding:0px;margin:0px;font-family:����,Arial,Helvetica,sans-serif;font-size:12px;color:#383838;background:#ffffff}
a{text-decoration:none;color:#383838}
a:hover{color:#ff0000}
ul{list-style:none;padding:0px;margin:0px}
li{padding:0px;margin:0px}
/* common */
.elite{color:#ff0000}
.b{font-weight:bold}
.l{float:left}
.r{float:right}
.dot{clear:both;height:1px;background:url('http://www.tgbus.com/images/v4/sign.gif');overflow:hidden;margin:0px 8px}
.clear{clear:both;height:0px;overflow:hidden}
.area{width:970px;margin:0px auto 7px auto}
.area .top{width:970px;height:35px;color:#666666;margin-bottom:8px}
.area .top .name{width:108px;height:35px;background:url('http://www.tgbus.com/images/v4/name.gif') no-repeat 28px 0px;float:left}
.area .top .nav{float:right;background:#ffffff;height:25px;line-height:25px;margin:5px 0px;width:785px;padding-left:30px}
.area .top a{color:#666666;margin:0px 4px}
.area .top a:hover{color:#ff0000}
.area .top .nav .more{float:right;margin-right:10px}
.area .l{width:760px}
.area .r{width:200px}
.area .l .s{width:373px;border:1px #cfcfcf solid;margin-bottom:10px}
.area .r .s{border:1px #cfcfcf solid;margin-bottom:10px}
.area .s .t1{height:30px;line-height:30px;padding:0px 16px;font-size:14px;font-weight:bold;background:url('http://www.tgbus.com/images/v4/bg.gif') #f9f9f9 0px -61px}
.area .s .t1 .more{float:right;font-size:12px;font-weight:normal}
.area .s .t2{text-align:center;color:#ffffff;height:31px;line-height:31px;font-size:14px;font-weight:bold}
.area .s .t2 a{color:#ffffff}
.area .l .s1{margin:12px 5px;height:124px;overflow:hidden}
.area .l .s1 li{float:left;width:180px;text-align:center}
.area .l .s1 a{position:relative;display:block;width:164px;height:124px;margin:auto}
.area .l .s1 a img{width:160px;height:120px}
.area .l .s1 a cite,.area .l .s1 a span{position:absolute;display:block;width:160px;height:20px;left:2px;top:102px;color:#ccc;line-height:20px;overflow:hidden;cursor:pointer}
.area .l .s1 a cite{background:#000000;filter:Alpha(opacity=50);-moz-opacity:0.5;-khtml-opacity:0.5;opacity:0.5}
.area .l .s1 a:hover span{color:#fff}
.area .l .s2{margin:10px;font-size:14px}
.area .l .s2 li{width:353px;height:22px;line-height:22px;overflow:hidden;padding-left:16px;background:url('http://www.tgbus.com/images/v4/sign.gif') #ffffff no-repeat 4px -5px;float:left}
.area .l .s2 li.sp{background-image:none;height:9px;overflow:hidden}
.area .l .s3{margin:10px}
.area .l .s3 li{height:21px;line-height:21px;overflow:hidden;padding-left:16px;float:left;background:url('http://www.tgbus.com/images/v4/sign.gif') #ffffff no-repeat 4px -6px;width:160px}
.area .l .s3 li.sp{background-image:none;width:320px;height:10px}
.area .l .s4{margin:10px;height:74px}
.area .l .s4 img{float:left;width:115px;height:70px;margin-right:10px}
.area .l .s4 .desc{margin-top:4px;line-height:22px;float:right;width:224px}
.area .l .s5{margin:10px;height:104px;overflow:hidden}
.area .l .s5 div{float:left;height:100%;width:134px;padding-right:5px;margin-right:5px;text-align:center}
.area .l .s5 div a{position:relative;display:block;width:134px;height:104px;margin:auto}
.area .l .s5 div a cite,.area .l .s5 div a span{position:absolute;display:block;width:130px;height:20px;left:2px;top:82px;color:#ccc;line-height:20px;overflow:hidden;cursor:pointer}
.area .l .s5 div a cite{background:#000000;filter:Alpha(opacity=50);-moz-opacity:0.5;-khtml-opacity:0.5;opacity:0.5}
.area .l .s5 div a:hover span{color:#fff}
.area .l .s5 div img{width:130px;height:100px}
.area .l .s5 li{height:21px;line-height:21px;overflow:hidden;padding-left:16px;background:url('http://www.tgbus.com/images/v4/sign.gif') #ffffff no-repeat 4px -6px}
.area .l .s5 .desc{margin-top:4px;line-height:22px;float:right;width:224px}
.area .r .s1{width:100%}
.area .r .s1 td{text-align:center;height:26px;line-height:26px}
.area .r .s1 thead td,#tvgame .p6 tfoot td,#digit .s1 tfoot td{font-weight:bold;height:32px;line-height:32px}
.area .r .s1 thead td a,.area .r .s1 tfoot td a{margin:0px 5px}
.area .l .underline li a{display:inline-block;border-bottom:1px #383838 solid;text-decoration:none;height:18px;height:17px;line-height:20px;overflow:hidden}
.area .l .underline li a:hover{border-bottom:1px #ff0000 solid}
.area .l .underline li a.red{border-bottom:1px #ff0000 solid}
.area img{padding:1px;border:1px #cfcfcf solid}
/* adv */
.a760x100{width:760px;height:100px}
.a200x100{width:200px;height:100px}
.a200x153{width:200px;height:153px}
.a200x205{width:200px;height:205px}
.a200x256{width:200px;height:256px}
.a200x263{width:200px;height:263px}
.a200x375{width:200px;height:375px}
/* detail */
#navi{width:942px;height:57px;padding:13px;top;border:1px #cccccc solid;background:url('http://www.tgbus.com/images/v4/bg.gif') repeat-x 0 22px #ffffff;overflow:hidden}
#navi ul{clear:both;height:22px}
#navi li{float:left;line-height:14px;padding:0px 10px;border-right:1px #989898 solid}
#navi .t{color:#024a73;padding-left:0px;border-right:0px}
#navi .e{border-right:0px}
#main{height:753px;overflow:hidden}
#main .p1{width:373px;height:268px;margin-top:10px}
#main .focus{border:1px #cfcfcf solid;overflow:hidden}
#main .focus .img{display:none;margin:1px}
#main .focus .img,.focus img{width:371px;height:237px;overflow:hidden;background:#ffffff;border:0px;padding:0px}
#main .focus ul{height:26px;border-top:1px #e0e0e0 solid;margin-top:4px;background:url('http://www.tgbus.com/images/v4/bg.gif') #f9f9f9 0px -61px}
#main .focus li{width:46px;height:26px;border-right:1px #e0e0e0 solid;line-height:26px;float:left;text-align:center;position:relative}
#main .focus li span{width:5px;height:4px;position:absolute;top:-3px;left:20px;background:url('http://www.tgbus.com/images/v4/icon.gif') 0px -89px;display:none}
#main .focus li.e{width:44px;border-right:0px}
#main .focus li a{color:#0965af;float:left;height:100%;width:100%}
#main .focus li.hover,.focus li.cur{background:#0965af}
#main .focus li.hover a,#main .focus li.cur a{color:#ffffff}
#main .focus li.hover span,#main .focus li.cur span{display:block}
#main .p2{height:635px;font-size:14px;margin-top:10px}
#main .p3{height:355px}
#main .p2 .head{width:353px;height:78px;margin:8px 10px 0px 10px;overflow:hidden}
#main .p2 .head a{display:block;text-decoration:none;color:#383838}
#main .p2 .head .title{font-weight:bold;display:block;color:#004ba6;cursor:pointer}
#main .p2 .head img{float:left;margin:6px 6px 0px 0px;width:70px;height:51px;cursor:pointer}
#main .p2 .head .desc{width:268px;float:right;display:block;padding-left:4px;margin-top:6px;font-size:12px;line-height:18px;cursor:pointer;background:#eeeeee}
#main .p2 .dot{margin-top:8px}
#main .p2 .s2{margin:6px 10px;width:353px;overflow:hidden}
#main .p2 .s2 li{height:25px;line-height:25px;background:none;padding-left:0px}
#main .p2 .s2 li span{float:left;width:33px;height:16px;text-indent:1px;background:url('http://www.tgbus.com/images/v4/icon.gif') #267abd;margin:5px 11px 0px 3px!important;margin-right:4px;overflow:hidden}
#main .p2 .s2 li span.elite{background-position:-34px 0px;background-color:#ff0000}
#main .p2 .s2 li span a{color:#ffffff;font-family:Arial;font-size:12px;float:left;width:100%;height:100%;line-height:16px;text-align:center}
#main .p2 .s2 li.sp{height:9px}
#main .p2 .hot{background:#f1f1f1;height:29px;line-height:29px;border-top:1px #cfcfcf solid;border-bottom:1px #cfcfcf solid;margin:10px 0px;overflow:hidden}
#main .p2 .hot a{color:#ff0000;font-family:Arial,΢���ź�,����;font-size:16px;font-weight:bold;margin:0px 15px;letter-spacing:1px}
#main .p3 .s1{margin:14px 5px 0px;height:80px}
#main .p3 .s1 li{width:90px}
#main .p3 .s1 li a{width:74px;height:80px}
#main .p3 .s1 li a:hover span{color:#ff0000}
#main .p3 .s1 span{width:74px;top:60px;color:#383838}
#main .p3 .s1 img{width:70px;height:51px}
#main .p3 .s3{height:72px}
#main .p3 .s3 li{height:24px;line-height:24px}
#main .p3 .s6{width:345px;height:115px;margin:14px 14px 0px;overflow:hidden}
#main .p3 .s6 ul{height:100%;width:100%;overflow:hidden}
#main .p3 .s6 li{float:left;width:172px;height:62px}
#main .p3 .s6 a.t{width:66px;height:49px;background:url('http://www.tgbus.com/images/v4/icon.gif') 0px -17px #acacac;text-align:center;color:#ffffff;float:left;position:relative;cursor:pointer;margin-right:6px}
#main .p3 .s6 img{width:45px;height:45px;padding:0px;border:0px;position:absolute;top:2px;left:19px}
#main .p3 .s6 span{width:16px;height:49px;display:block;line-height:20px;position:absolute;top:5px;left:0px}
#main .p3 .s6 b{font-size:14px;color:#004ba6;line-height:28px;margin-bottom:4px}
#main .p3 .et{margin:8px 0px 8px 10px}
#main .p3 .et li{float:left;width:180px;height:22px;line-height:22px}
#main .p6 .s1 tr.k{background:#eee}
#main .p6 .s1 thead td{color:#0965af}
#main .p6 .s1 tbody td{line-height:27px;height:27px}
#main .p6 .s1 b{text-indent:-10000px;width:21px;height:16px;display:block;cursor:pointer;background:url('http://www.tgbus.com/images/v4/icon.gif') 0px -71px;overflow:hidden;margin:0px auto}
#main .p6 .s1 .yk b{background-position:-44px -71px}
#main .p6 .s1 .tk b{background-position:-22px -71px}
#main .t2{background:url('http://www.tgbus.com/images/v4/bg.gif') 0px -61px}
#main .t2 a{color:#0965af}
#main .r .s{border:0px}
#main .r .p6{border:#cfcfcf 1px solid}
#tvgame{height:916px;overflow:hidden}
#tvgame .top{background:#0660cd}
#tvgame .p1,#tvgame .p2,#tvgame .p6{height:375px;overflow:hidden}
#tvgame .p1 .s2 a{margin-right:6px}
#tvgame .p2 .s1 li,#tvgame .p4 .s1 li{margin-bottom:12px}
#tvgame .p3{height:211px;overflow:hidden}
#tvgame .p3 .s5{height:163px}
#tvgame .p3 .s5 img{height:158px}
#tvgame .p3 .s5 a{height:162px}
#tvgame .p3 .s5 a cite,#tvgame .p3 .s5 a span{top:140px}
#tvgame .p4{height:375px;overflow:hidden}
#tvgame .p5{height:152px;overflow:hidden}
#tvgame .p5 .s1{margin-top:14px}
#tvgame .p5 .s1 a{display:inline}
#tvgame .p5 .s1 img{height:76px;margin-bottom:4px}
#tvgame .p6 .s1 tr.k,#tvgame .p7 .s1 tr.k{background:#e6eff9}
#tvgame .p6 .s1 thead,#tvgame .p6 .s1 thead a,#tvgame .p6 .s1 tfoot,#tvgame .p6 .s1 tfoot a{color:#005585}
#tvgame .p7 .s1 thead,#tvgame .p7 .s1 thead a,#tvgame .p7 .s1 tfoot,#tvgame .p7 .s1 tfoot a{color:#005585}
#tvgame .p7{height:218px;overflow:hidden}
#tvgame .p7 thead td{font-weight:normal}
#tvgame .p7 thead a{font-weight:bold;margin:0px 2px}
#tvgame .t2{background:#0660cd}
#tvgame .r .s{border-color:#a4c0e3}
#olgame{height:856px;overflow:hidden}
#olgame .top{background:#eb0601}
#olgame .top .name{background-position:28px -35px}
#olgame .p1,#olgame .p2,#olgame .p7{height:375px;overflow:hidden}
#olgame .p3{height:314px;overflow:hidden}
#olgame .p3 .dot{margin:4px 8px}
#olgame .p4,#olgame .p6{height:151px;overflow:hidden}
#olgame .p3 .s1,#olgame .p6 .s1{margin-top:18px}
#olgame .p7 .s1 thead,#olgame .p7 .s1 thead a{color:#eb0601}
#olgame .p7 .s1 tr.k{background:#ffeeee}
#olgame .t2{background:#eb0601}
#olgame .r .s{border:0px}
#olgame .r .p7{border:#eaa5a4 1px solid}
#digit{height:761px;overflow:hidden}
#digit .top{background:#0660cd}
#digit .top .name{background-position:28px -70px}
#digit .p1,#digit .p2,#digit .p3{height:352px;overflow:hidden}
#digit .p2 .s1 li{margin-bottom:12px}
#digit .p3 .s1 tr.k{background:#e6eff9}
#digit .p3 .s1 span{display:block;width:17px;height:13px;background:url('http://www.tgbus.com/images/v4/rank.gif') no-repeat;margin:6px auto;overflow:hidden}
#digit .p3 .s1 span.h1,#digit .p3 .s1 span.h2,#digit .p3 .s1 span.h3,#digit .p3 .s1 span.h4,#digit .p3 .s1 span.h5,#digit .p3 .s1 span.h0{width:46px;height:8px;margin:9px auto}
#digit .t2{background:#0660cd}
#digit .p3 .s1 thead,#digit .p3 .s1 thead a,#digit .p3 .s1 tfoot a{color:#005585}
#digit .p3 .s1 .n2{background-position:0px -13px}
#digit .p3 .s1 .n3{background-position:0px -26px}
#digit .p3 .s1 .n4{background-position:0px -39px}
#digit .p3 .s1 .n5{background-position:0px -52px}
#digit .p3 .s1 .n6{background-position:0px -65px}
#digit .p3 .s1 .n7{background-position:0px -78px}
#digit .p3 .s1 .n8{background-position:0px -91px}
#digit .p3 .s1 .n9{background-position:0px -104px}
#digit .p3 .s1 .n10{background-position:0px -117px}
#digit .p3 .s1 .h5{background-position:0px -130px}
#digit .p3 .s1 .h4{background-position:0px -138px}
#digit .p3 .s1 .h3{background-position:0px -146px}
#digit .p3 .s1 .h2{background-position:0px -154px}
#digit .p3 .s1 .h1{background-position:0px -162px}
#digit .p3 .s1 .h0{background-position:0px -180px}
#digit .flash_tit{background:#eeeeee;height:26px;}
#digit .flash_tit span{font-size:12px;font-weight:bold;line-height:26px;color:#000;text-indent:15px;float:left}
#digit .flash_tag{margin:auto;line-height:24px;padding:0px 0 0px 10px;}
#digit .flash_tag a{line-height:24px;padding:0 3px;}
#comic{height:485px;overflow:hidden}
#comic .top{background:#eb0601}
#comic .top .name{background-position:28px -105px}
#comic .p1,#comic .p2,#comic .p3{height:330px;overflow:hidden}
#comic .p3{height:440px}
#comic .p2 .s1 li{margin-bottom:12px}
#comic .p3 .s1 tr.k{background:#eeeeee}
#comic .xyx{height:420px;}
#comic .flash_tit{background:#eeeeee;height:26px;}
#comic .flash_tit span{font-size:12px;font-weight:bold;line-height:26px;color:#000;text-indent:15px;float:left}
#comic .flash_tag{margin:auto;line-height:24px;padding:0px 0 0px 10px;}
#comic .flash_tag a{line-height:24px;padding:0 3px;}
#link{line-height:26px;border-top:1px #cacaca solid;margin-top:10px}
#link .url{margin:10px}
#link .url a{margin:0px 6px}
#ico{text-align:center}
#adview{font:bold 16px Arial,����;margin:auto;color:#000000;text-align:center}
#adview .b{height:33px;line-height:33px;margin:10px;background:url('http://www.tgbus.com/images/1.jpg');position:relative}
#adview .b img{width:81px;height:33px;left:30px;top:0px;position:absolute}
#adview .b a{color:#000000}
#adview iframe{margin:10px}
/*beijing_ad*/
.center{width:970px;margin:0 auto;height:4265px;float:left;}
.ad1{width:200px;height:4260px;left:-200px;position:absolute;}
.ad2{width:200px;height:4260px;position:absolute;right:-200px;}
.bottom_ad{background-color:#99FFCC;width:970px;height:80px;overflow:hidden;margin:0 auto;margin-bottom:5px;}
.clearH12{height:12px;overflow:hidden;clear:both;}
#link .url{margin:0 10px;}
#league_1 a img{border:none;display:inline;float:left;height:30px;margin:4px 5px 0 14px;padding:0 0 5px 0;width:75px;}

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