How to load new slides to fancybox 3 via AJAX?

Question

On my site there is a gallery with 20 photos to start with. When a visitor opens the fancybox gallery in popup mode and clicks on "next" arrow, all is OK, they can navigate through the gallery. But when the visitor is on next to last slide, using function beforeShow I call an AJAX function, which returns the next photo data (full image URL, thumbnail URL, caption text) from the server.

This is my problem: I haven't found any method to add the next slide in popup mode. I can add it as gallery item in thumbnails list, but for popup mode - no change.

How I can load slides via AJAX, one by one?

Answer 1

You can use addContent method for that. Example:

$.fancybox.getInstance().addContent({
  src : 'https://source.unsplash.com/i-FqQIkJMqg/1536x2304', 
  type : 'image'
});