creating a blob image gallery with fancybox

Question

In the fancybox examples you can create a fancybox gallery like so:

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

and in html you should create a link like so:

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

But the problems is, that my pics are BLOB's ) and i don't know how can i get that path of the picture.. Maybe someone knows how can i do that ?

I need my gallery to be opened by click on that link.

I can get data of picture with ajax and then try to do something with it, but that did not worked:

$.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

Did you try base64 source? Result like this.

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

data:image/jpeg;base64 or data:image/png;base64 can be used based on the file.

$.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
      }
    }
  });