通过AJAX提供Fancybox

在Fancybox's home page上有一个示例（页面底部的最后一个），Fancybox通过直接列表进行馈送。通过AJAX提供Fancybox

现在我想建立一个画廊，您只看到第一个缩略图，然后你点击后，一个PHP脚本发送回相同的格式提供的图像的列表作为例子显示：

'http://example.com/img1.jpg','http://example.com/img2.jpg'

现在我的问题是图像没有显示，因为Fancybox正在做我的网址列表（即图像给404的）。

链接（当直接打开时）工作正常。
将PHP的直接输出直接插入到脚本中一切都很好。
什么的fancybox不被覆盖我的列表，如：

http://example.com/'http://example.com/img1.jpg','http://example.com/img2.jpg'

当然，这将失败。

我的问题是如何通过AJAX正确提供Fancybox（或任何其他灯箱库）？

来源

2011-02-16 fabrik

没有必要修改Fancybox的源代码本身我所需要的就是重新组合通过AJAX为AJAX提供图片的数组。

... 
var _items = []; 
$.getJSON('ajax/gjson.php', {dir: $(this).attr('rel')}, function(response){ 

    $.each(response, function(key, val) { 
     _items.push({'href' : val.href, 'title' : val.title}); 
    }); 

    $.fancybox(_items, { 
     'padding'   : 0, 
     'transitionIn'  : 'none', 
     'transitionOut'  : 'none', 
     'type'    : 'image', 
     'changeFade'  : 0 
    }); 
}); 
...

来源

2011-03-16 09:25:19 fabrik

请问您可以看看[this]（http://stackoverflow.com/questions/31351626/jquery-fancybox-with-ajax/31352383）的问题吗？提前致谢。 – 2015-07-11 13:55:24

我只是搞乱了这一点，发现fancybox只处理一个图像在一次从ajax，它需要在HTML。那么，什么是希望看到的是：

<a href="#" title="image1 title"><img src="image1.jpg"></a>

另外，我刚才已经回答this question有关加载了这实际上需要对插件本身的两个小的变化新的Ajax加载数据的画廊。

来源

2011-03-05 04:15:21 Mottie

通过AJAX提供Fancybox

回答

相关问题