ShoWT图片放大镜效果 - ShopWT官网-php多用户商城系统-在路上

<div id="ncs-goods-picture" class="ncs-goods-picture image_zoom"></div>

复制代码

<div id="ncs-goods-picture" class="ncs-goods-picture image_zoom">
<div class="box">
<div class="tb-booth tb-pic tb-s310" id="thumbview">
</div>
<ul class="tb-thumb" id="thumblist">
</ul>
<script type='text/javascript'>
var imglist;
<?php if (!empty($output['goods_image'])) {?>
imglist= [<?php echo implode(',', $output['goods_image']);?>];
<?php }?>
for(var i in imglist){
if($("#thumbview").find("img").size()<=0){
$("#thumbview").append('<a href="javascript:void(0);" target="_blank"></a>');
}
$("#thumblist").append('<li><div class="tb-pic tb-s40"><a href="javascript:void(0);"></a></div></li> ');
}
$(".jqzoom").imagezoom();
$("#thumblist li a").click(function () {
$(this).parents("li").addClass("tb-selected").siblings().removeClass("tb-selected");
$(".jqzoom").attr('src',$(this).find("img").attr("mid"));
$(".jqzoom").attr('rel',$(this).find("img").attr("big"));
});
</script>
</div>

复制代码

jQuery(function($){
//产品图片
$.getScript('<?php echo BASE_STATCS_URL?>/js/ImageZoom.js', function(){
var
zoomController,
zoomControllerUl,
zoomControllerUlLeft = 0,
shell = $('#ncs-goods-picture'),
shellPanel = shell.parent(),
heightNcsDetail = $('div[class="ncs-detail"]').height();
heightOffset = 60,
minGallerySize = [360, 360],
imageZoom = new ImageZoom({
shell: shell,
basePath: '',
levelASize: [60, 60],
levelBSize: [320, 320],
gallerySize: minGallerySize,
onBeforeZoom: function(index, level){
if(!zoomController){
zoomController = shell.find('div.controller');
}
var
self = this,
duration = 320,
width = minGallerySize[0],
height = minGallerySize[1],
zoomFx = function(){
self.ops.gallerySize = [width, height];
self.galleryPanel.stop().animate({width:width, height:height}, duration);
shellPanel.stop().animate({height:height + heightOffset}, duration).css('overflow', 'visible');
zoomController.animate({width:width-22}, duration);
shell.stop().animate({width:width}, duration);
};
if(level !== this.level && this.level !== 0){
if(this.level === 1 && level > 1){
height = Math.max(480, shellPanel.height());
width = shellPanel.width();
zoomFx();
}
else if(level === 1){
zoomFx();
shellPanel.stop().animate({height:heightNcsDetail}, duration);
}
}
},
onZoom: function(index, level, prevIndex){
shell.find('a.prev,a.next')[level<3 ? 'removeClass' : 'addClass']('hide');
shell.find('a.close').css('display', [level>1 ? 'block' : 'none']);
},
items: [
<?php if (!empty($output['goods_image'])) {?>
<?php echo implode(',', $output['goods_image']);?>
<?php }?>
]
});
shell.data('imageZoom', imageZoom);
});
});

复制代码