fancybox ajax图片库

我正在尝试通过ajax加载fancybox图库。 这是我第一次使用fancybox，我的jquery知识有限。 这是我到目前为止所做的。 画廊链接;

galleryAj.php回显了如下图像链接列表;

这是javascript

 $(document).ready(function() { $(".fancybox") .attr('rel', 'gallery1') .fancybox({ type: 'ajax', padding : 0 }); }); 

当我单击图库链接时，所有图像都显示在彼此相邻的单个窗口中，而不是幻灯片放映。 我已经搜索谷歌和堆栈溢出的答案没有成功。 希望有人能提供帮助。 提前致谢。

Answer 1

删除类型ajax然后只需$(".fancybox").fancybox(); 像这样把它们展示在画廊里，

Explantion

HTML

脚本

 $(".fancybox").fancybox(); 

有关详细信息，请查看此处

Answer 2

使用php页面显示图像

有点像

/images/thumbnail.php?file=this/is/my/path.jpg&w=100&h=100

所以，如果你去那个url，它会显示图像本身

imagecreatefromstring($file); 键入设置编码和东西的东西。

然后只是正常调用fancybox ..

JS

$(".fancy").fancybox({type:'image'});

HTML

您传递给thumbnail.php页面的任何文件都将被渲染（我添加w和h得到你可能会在发送到客户端之前使用php端resize）

---

在你的情况下像

JS

 $("#galary_area").load("/galaries.php",function(){ $("a",this).fancybox({type:'image'}); }) 

并使用上面的东西发布调用图像的php页面

---

还要指出使用ajax调用html是一种不是最佳实践。 你可能想考虑使用一个javascript templting框架（胡子等），只通过ajax将JSON传递给模板。