<!--{include file="<!--{$tplpath}-->block_header.tpl"}-->
<!-------------------------------------- 头部结束 -------------------------------------->
		<link rel="stylesheet" href="<!--{$skinpath}-->assets/css/index.min.css">
<!-------------------------------------- 主体开始 -------------------------------------->
		<div class="home-hero-container container">
			<div class="home-hero">
				<div class="home-hero-slider">
					<div class="ui-wrapper" style="max-width: 100%;">
						<div class="ui-viewport" style="width: 100%; overflow: hidden; position: relative; height: 460px;">
							<script type="text/javascript">
								$(function() {
									// 首屏轮播图
									var f = 0;

									function runsp() {
										f++;
										// 判断
										if (f == 5) {
											f = 0;
										}
										// 图片显隐变化
										$('#J_homeSlider>.slide').eq(f).fadeIn().siblings().fadeOut();
										// 数字图标的变化
										$('.ui-pager-item>a').eq(f).addClass('active').stop().parents('.ui-pager-item').siblings().find('a').removeClass('active');
									}
									// 启动定时器
									times = setInterval(runsp, 3000);
									//2. 移入左右键显隐，定时器停止
									$('#J_homeSlider,.ui-prev,.ui-next').hover(function() {
										// 停止定时器
										clearInterval(times);
									}, function() {
										// 启动定时器
										times = setInterval(runsp, 3000);
									});
									// 移入数字图标切换背景图和小图标
									$('.ui-pager-item').mouseover(function() {
										f = $(this).index();
										// 背景图显隐
										$('#J_homeSlider>.slide').eq(f).fadeIn().siblings().fadeOut();
										// 数字图标背景色变化
										$('.ui-pager-item>a').eq(f).addClass('active').parents().siblings().find('a').removeClass('active');
									});
									// 3左右点击切换背景图片和数字图标
									// 点击右侧按钮
									$('.ui-prev').click(function() {
										f++;
										if (f == 5) {
											f = 0;
										}
										// 背景图显隐
										$('#J_homeSlider>.slide').eq(f).fadeIn().siblings().fadeOut();
										// 数字图标背景色变化
										$('.ui-pager-item>a').eq(f).addClass('active').parents().siblings().find('a').removeClass('active');
									})
									// 点击左侧按钮
									$('.ui-next').click(function() {
										f--;
										if (f == -1) {
											f = 4;
										}
										// 背景图显隐
										$('#J_homeSlider>.slide').eq(f).fadeIn().siblings().fadeOut();
										// 数字图标背景色变化
										$('.ui-pager-item>a').eq(f).addClass('active').parents().siblings().find('a').removeClass('active');
									})
								})
							</script>
							<div id="J_homeSlider" class="xm-slider" data-stat-title="焦点图轮播" style="width: auto; position: relative;" m-id='met_banner' m-type="myads">
			    			<!--{assign var='indexzone' value=get_zone('index_slide_banner')}-->     
								<!--{foreach $indexzone.ads as $key=>$item}-->
								<div class="slide loaded" style="float: none; list-style: none; position: absolute; width: 1226px; z-index: 0; <!--{if $key==0}-->display: block;<!--{else}-->display: none;<!--{/if}-->">

									<a href="<!--{$item.url}-->"><img src="<!--{$item.uploadfiles}-->" ></a>
								</div>
								<!--{/foreach}-->
							</div>
						</div>
						<div class="ui-controls ui-has-pager ui-has-controls-direction">
							<div class="ui-pager ui-default-pager">
								<div class="ui-pager-item"><a href="javascript:;" data-slide-index="0" class="ui-pager-link active">1</a></div>
								<div class="ui-pager-item"><a href="javascript:;" data-slide-index="1" class="ui-pager-link">2</a></div>
								<div class="ui-pager-item"><a href="javascript:;" data-slide-index="2" class="ui-pager-link">3</a></div>
								<div class="ui-pager-item"><a href="javascript:;" data-slide-index="3" class="ui-pager-link">4</a></div>
							</div>
							<div class="ui-controls-direction"><a class="ui-prev" href="javascript:;">上一张</a><a href="javascript:;" class="ui-next">下一张</a></div>
						</div>
					</div>
				</div>

				<div class="home-hero-sub row">
					<div class="span4">
						<ul class="home-promo-list clearfix" style="margin-left: -17px;" m-id='banner_5' m-type="myads">
							<!--{assign var='indexzone' value=get_zone('index_banner_gt')}-->
							<!--{foreach $indexzone.ads as $k=>$item}-->
							<li>
								<a class="item" href="<!--{$item.url}-->" target="_blank"><img alt="" src="<!--{$item.uploadfiles}-->"  style="width: 234px;" ></a>
							</li>
							<!--{/foreach}-->
						</ul>
					</div>
					<div class="span16" id="J_homePromo" data-stat-title="焦点图下方小图">
						<ul class="home-promo-list clearfix"  m-id='met_xia_banner' m-type="myads">
							<!--{assign var='indexzone' value=get_zone('index_banner_gg')}-->
							<!--{foreach $indexzone.ads as $k=>$item}-->
							<!--{if $k == 0}-->
							<li class="first">
								<!--{else}-->
							<li>
								<!--{/if}-->
								<a class="item" href="<!--{$item.url}-->" target="_blank"><img alt="" src="<!--{$item.uploadfiles}-->" ></a>
							</li>
							<!--{/foreach}-->
						</ul>
					</div>
				</div>
			</div>

			<div class="home-star-goods xm-carousel-container" id="J_homeStar">
				<div class="xm-plain-box">
					<script type="text/javascript">
						$(function() {
							// 服装轮播
							//1.自动播
							var page = 1;

							function runfz() {
								var fin_ul = $('#J_homeStar .xm-carousel-wrapper').find('ul');
								var page_wid = 1240;
								page++;
								// 判断
								if (page == 3) {
									page = 1;
									fin_ul.css('right', '-1240');
									fin_ul.animate({
										right: '0'
									}, 500);
								} else {
									fin_ul.animate({
										right: '-=' + page_wid
									}, 500);
								}
								// 图片显隐变化
							}
							// 启动定时器
							timett = setInterval(runfz, 3000);
							$('.xm-carousel-wrapper,.control-prev,.control-next').hover(function() {
								clearInterval(timett)
							}, function() {
								timett = setInterval(runfz, 3000);
							});
							$('.control-prev').click(function() {
									var fin_li = $('#J_homeStar .xm-carousel-wrapper').find('li');
									var fin_ul = $('#J_homeStar .xm-carousel-wrapper').find('ul');
									var page_wid = 1240;
									if (page <= 1) {
										page = 1;
										fin_ul.css('right', '1240');
										return false;
									} else {
										fin_ul.animate({
											right: '+=' + page_wid
										}, 500);
										page--;
									}
								})
								// 左边按钮
							$('.control-next').click(function() {
								var fin_li = $('#J_homeStar .xm-carousel-wrapper').find('li');
								var fin_ul = $('#J_homeStar .xm-carousel-wrapper').find('ul');
								var page_wid = 1240;
								if (page >= 2) {
									page = 2;
									fin_ul.css('right', '1240');
									return false;
								} else {
									fin_ul.animate({
										right: '-=' + page_wid
									}, 500);
									page++;
								}
							})
						})
					</script>

				</div>
			</div>
		</div>

		<div class="page-main home-main">
			<div class="container">
				<div id="around" class="home-brick-box home-brick-row-2-box xm-plain-box J_itemBox J_brickBox is-visible loaded">
<!-- 产品模块下的二级栏目 -->
<!--{assign var='productcategory' value=vo_category("type={treecat} rootid={2}")}-->
<!--{foreach $productcategory as $key=>$parent}-->
					<div class="box-hd">
						<h2 class="title editable-click" met-type="category"  met-id="<!--{$parent.catid}-->" met-content="0"><!--{$key+1}-->F <!--{$parent.catname}--></h2>
						<div class="more J_brickNav">
							<a class="tab-list J_brickTabSwitch zhoubian"  href="<!--{$parent.url}-->" target="_blank">
								浏览更多
							</a>
						</div>
					</div>
					<script type="text/javascript">
						$(function() {
							$('.zhoubian>li').mouseover(function() {
								$(this).addClass('tab-active').siblings('.zhoubian>li').removeClass('tab-active');
								var index = $(this).index();
								$('#around-content>.brick-list').eq(index).addClass('tab-content-active').removeClass('tab-content-hide').siblings('.brick-list').removeClass('tab-content-active').addClass('tab-content-hide');
							});
						})
					</script>
					<div class="box-bd J_brickBd">
						<div class="row">
							<div class="span4 span-first">
								<ul class="brick-promo-list clearfix">
								<!--{assign var='padimg' value=vo_category("type={adimg} adcatid={<!--{$parent.catid}-->}")}-->
									<!--{foreach $padimg as $k=>$v}-->
										<!--{if $k == 2 }-->
										<li class="brick-item brick-item-m" style="margin-top: 318px;">
											<a href="<!--{$v.url}-->" target="_blank"><img class="editable-click" met-type="myads"  met-id="<!--{$v.id}-->" met-content="1" src="<!--{$v.uploadfiles}-->" style="height: <!--{$v.height}-->px;" alt=""></a>
										</li>
										<!--{else}-->
										<li class="brick-item brick-item-m">
											<a href="<!--{$v.url}-->" target="_blank"><img class="editable-click" met-type="myads"  met-id="<!--{$v.id}-->" met-content="1"	 src="<!--{$v.uploadfiles}-->" style="height: <!--{$v.height}-->px;" alt=""></a>
										</li>
									<!--{/if}-->
									<!--{/foreach}-->
								</ul>
							</div>
							<div class="span16">
								<div id="around-content" class="tab-container">
								<ul class="brick-list tab-content clearfix  tab-content-active J_recommendActive"   m-id='<!--{$parent.catid}-->' m-type='product'>
								<!--{assign var='product' value=vo_list("mod={product}  num={80} ")}-->
								<!--{assign var='kyi' value=0}-->
								<!--{foreach $product as $kx=>$vx}-->
								<!--{if $vx.catid==$parent.catid }--> 
									<!--{if $kyi < 8 }-->
											<li class="brick-item brick-item-m editable-click" met-type="product"  met-id="<!--{$vx.productid}-->" met-content="1">
												<div class="figure figure-img">
													<a href="<!--{$vx.url}-->">
													<img src="<!--{$vx.uploadfiles}-->" width="150" height="150" alt="">
												</a>
												</div>
												<h3 class="title"> <a href="<!--{$vx.url}-->" target="_blank" ><!--{$vx.productname}--></a></h3>
												<p class="price"> <span class="num"><!--{$vx.oprice}--></span>元 </p>
											</li>
									<!--{else}-->
									<div class="col-xs-1 col-sm-1 col-md-1 removediv" style=" display: none;" ></div>
									<script type="text/javascript" >
									  $('.removediv').remove();
									</script>
									<!--{/if}-->
								<!--{/if}-->
								<!--{/foreach}-->
											
										</ul>
								</div>
							</div>
							
						</div>
					</div>
<!--{/foreach}-->
				</div>
			</div>
		</div>
<!-------------------------------------- 主体结束 -------------------------------------->
<!-------------------------------------- 尾部开始 -------------------------------------->
<!--{include file="<!--{$tplpath}-->botton.tpl"}-->