ecshop分类列表页面每个商品调取商品相册缩略图方法

在做天猫模板的时候列表页面需要调用商品相册缩略图，找了很多方法才到这简单实用的调用方法，现在由68ecshop技术来告诉你该怎么调用吧！

在category.php里搜索代码

if($display == ‘grid’)
{
if(count($goodslist) % 2 != 0)
{
$goodslist[] = array();
}
}

在代码上方添加如下代码调出小相册缩略图

//新增分类页商品相册
if(is_array($goodslist)){
foreach($goodslist as $key=>$vo){
$goodslist[$key][‘pictures’] = get_goods_gallery($key);// 商品相册
}
}
//新增分类页商品相册

然后打开goods_list.lbi库文件，在商品循环
<!–{foreach from=$goods_list item=goods name=name}–>
<!–{if $goods.goods_id} –>

里面，找到合适的位置添加如下代码

<!– {if $goods.goods_id} –>

<div class=”productThumb clearfix”>
<a style=”visibility: visible; color:#fff; position:relative; z-index:99999999999;” href=”javascript:;” class=”ui-slide-arrow-s proThumb-prev” title=”上一页” >&lt;</a>
<div style=”float:left; width:185px; overflow:hidden;” id=”goods_item{$smarty.foreach.goods_list.iteration}”>
<div  class=”proThumb-wrap” style=”position:relative;” >

<p class=”ks-switchable-content” style=”position:absolute; left:0px; width:300%;”>
<!–{if $goods.pictures}–>
<!– {foreach from=$goods.pictures item=picture name=picture}–>
<b  data=”pic_{$goods.goods_id}”>
<A href=”###” rev={$picture.img_url} rel=goodsPic ><img src=”{if $picture.thumb_url}{$picture.thumb_url}{else}{$picture.img_url}{/if}” alt=”{$goods.goods_name}” /></a>
<i></i>
</b>
<!–{/foreach}–>
<!–{/if}–>
</p>

</div>
</div>
<a  style=”visibility: visible; color:#fff;” href=”javascript:;” class=”ui-slide-arrow-s proThumb-next” title=”下一页”>&gt;</a>
</div>

<script>
//相册底部控制
function goods_gallery_control(){
var num01=0;
var gg_lis = $(‘.ks-switchable-content b’).length;
$(‘.proThumb-next’).click(function(){

gg_lis = $(this).siblings(‘#goods_item’).find(‘.ks-switchable-content b’).length;
num01++;

if(num01>(gg_lis-5)){
num01=gg_lis-5;
$(this).siblings(‘#goods_item’).find(‘.proThumb-wrap p’).css(‘left’,(gglis-num01)*35);

}
$(this).siblings(‘#goods_item’).find(‘.proThumb-wrap p’).animate({left:-num01*35},200);
})
$(‘.proThumb-prev’).click(function(){

gg_lis = $(this).siblings(‘#goods_item’).find(‘.ks-switchable-content b’).length;
num01–;
if(num01<0){

num01=0;
$(this).siblings(‘#goods_item’).find(‘.proThumb-wrap p’).css(‘left’,(gglis-num01)*35);

}
$(this).siblings(‘#goods_item’).find(‘.proThumb-wrap p’).animate({left:-num01*35},200);
})
}
goods_gallery_control();
</script>

<script type=”text/javascript”>
$(function(){
var pic_tab = $(‘.ks-switchable-content b’);
pic_tab.click(function(){
var pic_tab = $(this).attr(‘data’);
var pic_img = $(‘.item_’ + pic_tab);
var pic_goodsimg = $(this).find(‘img’).attr(‘src’);
pic_img.attr(‘src’, pic_goodsimg);
$(this).addClass(‘proThumb-img proThumb-selected’).siblings(‘.ks-switchable-content b’).removeClass(‘proThumb-img proThumb-selected’);
})
})
</script>

<div style=”display: none;” class=”productSize clearfix”></div>
<!–{/if}–>

简单的分类页面商品相册缩略图已经调出来了，有可能点击切换功能会有些不好使，就要大家自己动手好好调调了，建议所添加的部分另放在一个库文件里面