0

我正在尝试使用 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 文件中的信息填充灯箱,但加载内容时出错。

4

3 回答 3

0

你可能应该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>

所有这些都基于其演示的源代码。演示页面http://fancybox.net/js/

更新

我使用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".

于 2012-04-27T03:57:46.913 回答
0

看来您缺少图片ID的选择器。

即:$("#inline")

$.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'
});
于 2012-04-27T03:57:54.260 回答
0

如果您正在(通过 php)填充 a divid="inline"那么这个脚本应该可以解决问题

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

我假设您将在填充div(可能在另一个脚本中)之后将此脚本作为回调调用,但您没有提供有关如何触发fancybox 的详细信息。

于 2012-04-27T05:12:47.923 回答