<!DOCTYPE html>
<html>
<head>
<body>
<!--------楼层-开始-------------->
<foreach name="cateList" item="v" key="k">
<!--商品楼层-s-->
<div class="layer-floor " id="floor{$k+1}">
<div class="w1224">
<div class="top_title_layer p">
<div class="part-title">{$v[name]}</div>
<div class="part-hot">
<ul>
<foreach name="v[tmenu]" item="v2" key="k2">
<li>
<a href="{:U('Home/Goods/goodsList',array('id'=>$v2[id]))}">{$v2[name]}</a>
</li>
</foreach>
</ul>
</div>
</div>
<div class="main_layer p">
<div class="hoste_le">
<a class="big_adve" href="">
<img src="{$v[image]}"/>
</a>
</div>
<div class="hoste_ri">
<ul>
<foreach name="v[hot_goods]" item="g" key="gk">
<if condition="$gk lt 8">
<li>
<a href="{:U('/Home/Goods/goodsInfo',array('id'=>$g[goods_id]))}">
<img class="picture_main" src="{$g[goods_id]|goods_thum_images=200,200}"/>
<span class="name_main">{$g[goods_name]}</span>
<!--<span class="intro_main">{$g[name]}</span>-->
<span class="price_main"><i>￥</i>{$g[shop_price]}</span>
</a>
</li>
</if>
</foreach> </ul> </div> </div> </div> </div> <!--商品楼层-e--> </foreach> <!--楼层导航-s--> <div class="floornav_left"> <ul> <foreach name="cateList" item="v" key="k"> <li class="elevators"> <a >{$k+1}F<span class="cofin_floor">{$v['mobile_name']}</span></a> </li> </foreach> </ul> </div> <!--楼层导航-e--> <!--------楼层-结束--------------> </body></html><script>//楼层按钮$('.showfloornav ul li').click(function(){ $(this).addClass('darkshow').siblings('li').removeClass('darkshow'); _index = $(this).index()+1; //通过拼接字符串获取元素。再取得相对于文档的高度 var _top = $('#floor'+_index).offset().top; //scrollTop滚动到对应高度animate(位置,时间) $('body,html').animate({scrollTop:_top},500);})//楼层按钮（加了鼠标滚动效果）$(function(){ $(window).scroll(function(){ var main_brand = $('.adv3').offset().top; var scr = $("body").scrollTop(); if(scr >= main_brand){ $('.floornav_left').addClass('showfloornav'); }else{ $('.floornav_left').removeClass('showfloornav'); } }) var _index=0; var scr = $("body").scrollTop(); $(".floornav_left ul li").click(function(){ $(this).addClass("darkshow").siblings().removeClass("darkshow"); _index=$(this).index(); //通过拼接字符串获取元素，再取得相对于文档的高度 var _top=$("#brand_"+_index).offset().top; //scrollTop滚动到对应高度 $("body,html").animate({scrollTop:_top},500); }); $(window).scroll(function(){ var tj = []; var strlength = $('.layer-floor').length; var stheigh = $('.layer-floor').eq(strlength - 1).height();//最后一个楼层的高度 var scr = $(document).scrollTop(); $('.layer-floor').each(function(i){ var sthei = $(this).offset().top; tj.push(sthei);//楼层距离顶部的高度添加进数组 }) for(var n = 0;n < strlength;n++){ if(scr >= tj[n] && scr <= tj[n] + stheigh){ $(".floornav_left ul li").eq(n).addClass("darkshow").siblings().removeClass("darkshow"); } } });})</script></script>