<{import file="common.html" title='产品分类'}>
<style type="text/css">
body{ background:#fff;} 
.cnav{ width:100%; position:fixed; float: left; } 
.cbox{ width:100%; border-top:1px solid #efefef; position:fixed; padding-bottom:50px; float:left; }
.clft{ width:6rem; position:fixed; left:0; top:45px; bottom:0; z-index:0; overflow-y:scroll; background:#f8f8f8; float:left; }
.clft ul{ float:left; }
.clft a{ width:100%; padding:1.2rem 0 1rem 0.9rem; border-bottom:1px solid #eee; color:#555; font-size:1rem; float:left; }
.clft a.ch{ background:#fff; border-left:0px solid #f00; padding-left:0.9rem; } 
.scrollbar-none::-webkit-scrollbar { width:0px; height: 0; } 

.crit{ margin-left:6rem; margin-top:0; background:#fff; display:none; position:fixed; right:0; left:0; top:50px; bottom:0; overflow-y: scroll; }
.crit .name{ width:100%; background:#fff; padding:1.2rem 0 0; float:left; } 
.crit .name span{ padding:0 0 0 0.3rem; margin:0 0 0 0.6rem; line-height:0.6rem; font-size:1rem; float:left; }
.crit .name a{ padding-right:15px; margin:-5px 0 0 0; color:#999; font-size:0.8rem; float:right; }
.crit .name a i{ font-size:0.8rem; color:#999; font-family:Arial, Helvetica, sans-serif; }

.crit .ccon{ padding:0.8rem 0 1rem 0; float:left; }
.crit .ccon a{ width:26.333%; margin:0 3%; padding:0 0 1.2rem 0; float:left;}  
.crit .ccon a i{ overflow:hidden; float:left; }
.crit .ccon a span{ width:100%; line-height:13px; text-align:center; vertical-align:middle; padding-top:12px; font-size:0.9rem; color:#777; float:left; }
</style>
<body>
<div class="cnav"> 
	<a class="back">&nbsp;</a>产品分类<a href="javascript:;" class="thome">主页</a>
</div> 
<{uqcms m="category" v="cats" c="get_list"}>
<{if $cats}>
	<div class="cbox">
		<aside>
			<div class="clft">
				<ul>
					<{foreach item=c key=k from=$cats}> 
						<a href="javascript:;" data-cid="<{$c.cid}>" <{if $k == '0'}>class="ch"<{/if}>><{$c.name}></a>
					<{/foreach}>
				</ul>
			</div> 
		</aside> 
		<{foreach item=c key=k from=$cats}>
			<div class="crit" id="tc_<{$c.cid}>" <{if $k==0}>style="display:block;"<{/if}>> 
				<{foreach item=i from=$c.parent}>
					<div class="name">
						<span><{$i.name}></span>
						<a href="?m=goods&cid=<{$i.cid}>">查看更多 <i>〉</i></a>
					</div>
					<div class="ccon">
						<{foreach item=ii from=$i.pparent}> 
							<a href="?m=goods&cid=<{$ii.cid}>" title="<{$ii.name}>" <{if $ii.hot == '1'}>class="hot"<{/if}>>
								<{if $ii.images != ''}>
									<i><img src="<{$__IMG__}><{$ii.images|img_size:120x120}>"/></i>
								<{else}>
									<i><img src="<{$__APP__}>public/images/cats_dft.png?ds"/></i>
								<{/if}> 
								<span><{$ii.name}></span>
							</a>
						<{/foreach}>	
					</div>
				<{/foreach}> 
			</div>
		<{/foreach}> 
	</div>
<{/if}>
<{import file="btm_tab.html"}>
<{import file="footer.html"}> 
<script type="text/javascript">
$(function(){	
	$(".ccon i").css('height', $('.ccon i img').width()); 
	$('.clft a').click(function(){
	 	$this = $(this);
		cats_id = $this.attr('data-cid');
		$this.addClass('ch').siblings('a').removeClass('ch');
		$("#tc_"+cats_id).show().siblings('.crit').hide();
	});
}); 
</script>