1

我遇到了这个灯箱插件，并想在我的项目中实现它。我可以选择在我的应用程序中导出数据。当我单击导出链接时，我希望灯箱出现一些文本和按钮，例如导出到 excel、导出到文本文件等。

但是灯箱插件会只覆盖图像吗？如果没有，我怎样才能覆盖文本和 div 元素？

这是导出链接：

<a class="button" id="export_entries">Export</a>

这是我希望出现在灯箱中的 div 元素。

<div id="lightboxContent">
<div class="info">
    <h2>Export Options</h2>
    <div>How would you like that?</div>
</div>

<div class="stuff">
    <p class="center">
        <a class="button" title="Excel Document" href="#">Excel(.xls)</a>

        <a class="button" title="Tab Delimited"  href="#">Text(.txt)</a>


    </p>
</div>

编辑 1

我尝试了另一个名为 facebox 的灯箱插件，它可以选择在灯箱中加载 html 文件。但对我来说，html 文件作为新页面加载。谁能帮我？

我给出了下面的代码：

<script type="text/javascript" src="/FormBuilder/app/webroot/js/jquery.js"></script>
<script type="text/javascript" src="/FormBuilder/app/webroot/js/facebox/facebox.js"></script>
 <link type="text/css" rel="Stylesheet" href="/FormBuilder/app/webroot/css/facebox/facebox.css" media="screen,projection" />

<a class="button" rel="facebox" id="export_entries" href="/lightbox.html" >Export</a>
4

2 回答 2

1

您可以调整灯箱以包含任何 HTML。它所做的只是清除背景并将一些 HTML 放入前景的一个分区中。

您可以通过查看 Expose 来节省一些时间，它是 jQuery 工具的一部分：

http://flowplayer.org/tools/demos/index.html

于 2009-08-21T10:02:36.223 回答
1

LightBox 插件仅用于叠加图像。所以我选择了Thickbox插件，它可以用来覆盖图像、文本、html和Ajax内容。

于 2009-08-25T04:01:46.967 回答