包括DOM与jquery FancyBox

Question

我想使用Fancy Box 2插件（fancyapps.com）。

一切都很好，除了我无法弄清楚如何正确包含DOM元素。

我在表单提交后通过ajaxform和验证返回信息后调用此方法。文档说为dom使用以下内容。

//DOM element: 

$.fancybox($("#inline"), { 
    title : 'Custom Title' 
}); 

现在，如果我在一个div在页面上创建一个ID它不会把它。也是div节目。

我尝试使用其他方法（自定义对象）

$.fancybox({ 
    href: 'example.jpg', 
    title : 'Custom Title' 
}); 

，它似乎并没有与PHP文件的工作。我正在尝试使用来自php文件的信息填充lightbox，但是我在加载内容时出错。

Answer 1

您应该在这里使用ajax()。

当我调查FancyBox插件时，它确实支持ajax。

$("#various3").fancybox({ 
    ajax: { 
     type: "POST", 
     data: 'mydata=test' 
    } 
});​ 

HTML

<li><a id="various3" href="/data/login.php">Ajax - passing custom data</a></li>

所有这些地方基于其演示的源代码。 Demo page & http://fancybox.net/js/。

UPDATE：

我没有使用fancyBox version 2快速测试，关于你的问题。

我实现拉AJAX内容：

$(document).ready(function() { 
    $('.fancybox').fancybox({ 
     title: 'Custom Title' 
    }); 
});​ 

HTML

<a class="fancybox fancybox.ajax" href="ajax.txt">Show content</a> 
<div id="content"> 
</div> 

我注意到，这里的重要组成部分，命名你的类class="fancybox fancybox.ajax"。

Answer 2

它似乎是你的选择器丢失到图片的ID。

即：$（ “＃内联”）

$.fancybox($("#inline"), { 
    href: 'example.jpg', 
    title : 'Custom Title' 
}); 

或

$("#inline").fancybox({ 
    href: 'example.jpg', 
    title : 'Custom Title' 
}); 

你也可以使用一个类，而不是一个id来匹配。

$(".inline").fancybox(
    href: 'example.jpg', 
    title : 'Custom Title' 
}); 

Answer 3

如果您是填充（通过PHP）与id="inline"一个div，那么这个脚本应该做的伎俩

$.fancybox({ 
href : "#inline", 
title : 'Custom Title' 
}); 

我假设你填充后，你将调用这个脚本回调div（也许在另一个脚本中），但是你没有提供fancybox如何被解雇的细节。