1

我正在尝试制作一个包含 90 张图片的画廊，并且每张图片都必须有一组按钮：（i）打开一个包含详细图片的 fancybox 画廊；(ii) 用大图打开一个花式框；(ii) 激活/停用提升缩放。我认为提升缩放动作/取消动作可能在带有大图像的幻想框内，但我也无法管理。激活/停用 elevatezoom 正在工作，然后坏了，图库按钮显示所有带有 rel="gallery" 的图像，这是正确的，但不是我想要的。我不知道如何为不同的按钮制作不同的画廊，以及如何将全屏按钮定位到特定的图像。

小提琴

$(".fancybox").fancybox();
$(".launchergallery").on("click", function(){
$(".fancybox").eq(0).trigger("click");
});

$(".fancyboxfull").fancybox();
$(".launcherfull").on("click", function(){
$(".fancyboxfull").eq(0).trigger("click");
});

$(document).on('click','.elevatezoom-gallery',function(e){
  e.preventDefault();
  var dataZoomImg = $(this).attr('data-zoom-image');
  var dataImg = $(this).attr('data-image');
  //alert(dataImgg + dataZoomImg);
  var mainImg = $('.imgzoom');
  //mainImg.attr('src',dataImg).attr('data-zoom-image',dataZoomImg).elevateZoom();
// $("#img_01").data('zoom-image',dataZoomImg).elevateZoom();
  mainImg.attr('src',dataImg);
 mainImg.data('zoom-image',dataZoomImg).elevateZoom();
});

$(document).on('click','.zoomin',function(e){
  e.preventDefault();
  $("#main01").elevateZoom();
    $("#main02").elevateZoom();
})

$(document).on('click','.zoomout',function(e){
  e.preventDefault();
         $('.zoomContainer').remove();
         })
4

0 回答 0