Question

在fancybox示例中，您可以创建如下的fancybox图库：

$("#fancybox-manual-c").click(function() {
  $.fancybox([{
    href: '1_b.jpg',
    title: 'My title'
  }, {
    href: '2_b.jpg',
    title: '2nd title'
  }]);
});

在html中你应该像这样创建一个链接：

<a id="fancybox-manual-c" href="javascript:;">Open gallery</a>

但问题是，我的照片是BLOB的）并且我不知道我怎么能得到图片的路径..也许有人知道我该怎么做？

我需要点击该链接打开我的画廊。

我可以用ajax获取图片数据，然后尝试用它做一些事情，但这没效果：

$.get("imgView.php", {
  image_id: 5
}, function(data) {
  $.fancybox({ type: 'image' }, 
    [{
      href: data,
      title: 'My title'
    }, {
      href: '2_b.jpg',
      title: '2nd title'
    },{
      href: '3_b.jpg'
    }], {
    helpers: {
      thumbs: {
        width: 75,
        height: 50
      }
    }
  });
});

Answer 1

您是否尝试过base64源代码？这样的结果。

<img alt="Embedded Image" src="data:image/png;base64,iVBORwAAANSU...hJUSKmfmdfm" />

可以根据文件使用

data:image/jpeg;base64或data:image/png;base64。

$.fancybox({ type: 'image' }, 
    [{
      href: "data:image/png;base64," + data,
      title: 'My title'
    }, {
      href: '2_b.jpg',
      title: '2nd title'
    },{
      href: '3_b.jpg'
    }], {
    helpers: {
      thumbs: {
        width: 75,
        height: 50
      }
    }
  });

使用fancybox创建blob图库

1 个答案: