获取灯箱(或其替代品)以在单击链接时动态显示库

时间:2011-09-28 19:44:42

标签: jquery lightbox

注意:我已经使用了lightbox及其许多替代方案来尝试修复此问题并暂时使用clearbox。

问题:目前我有javascript代码,根据点击的元素,灯箱的模态弹出窗口应向用户显示不同的图像集。以下是我目前正在修改的代码。

$("download").html(" \
<span style='color:white'> \
    <a href='img/26.jpg' rel='clearbox' title='Caption'>View Screenshots</a> \
</span><br /> \

然而,链接没有启动灯箱(适用于页面上已有的链接),我花了两天的时间浏览google和stackoverflow试图找到修复程序。

我想要实现的概要:展示我的工作,其中一个图像将通过javascript动态添加为超链接,具体取决于所选择的工作。当用户点击它时,它们将允许它们浏览隐藏但是部分图库的所有其他图像。将有多个画廊。谢谢你的阅读。

编辑1:请原谅mspaint工作 http://i.stack.imgur.com/rN8q1.jpg

1 个答案:

答案 0 :(得分:0)

问题是您必须在通过ajax拉入页面的任何链接上调用clearbox。当你最初调用clearbox时,jQuery会从你的选择器中获取所有元素,并为它们添加功能。如果你那么,通过ajax拉入其他链接(或者甚至将它们添加到dom中),然后clearbox还没有为这些元素实例化。

jQuery .live()函数修复了添加到dom的元素,但是clearbox不是为了使用.live()而构建的。因此,您必须在分别添加到页面的任何其他链接上调用clearbox。

http://api.jquery.com/live/


修改 我已经快速浏览了clearbox文档页面:http://www.clearbox.hu/index_en.html

它声明您可以致电CB_Init()将clearbox添加到新项目中:

  

将脚本与AJAX一起使用   如果您使用AJAX加载新内容   网页没有刷新你想要的,clearbox工作   使用新内容,你必须调用CB_Init();功能后   你的AJAX内容加载。

所以你可以这样做:

$("download").html(" \
        <span style='color:white'> \
           <a href='img/26.jpg' rel='clearbox' title='Caption'>View Screenshots</a> \
        </span><br /> \ ");
CB_Init();