Question

我正在使用widgetkit插件（Joomla CMS），用于灯箱。由于widgetkit使用fancybox来显示灯箱，我在这里发布了一个问题。

当我不使用AJAX技术更新Joomla网站的内容时，FancyBox非常有用。当我启用AJAX，并使用ajax技术刷新或移动到另一个页面时，灯箱效果消失了 - 图像本身在新窗口中打开。我认为这是因为AJAX更新了DOM而FancyBox无法识别它。我确实在AJAX代码的插件中有一个区域，我可以在其中编写某些JavaScript代码，这将在AJAX完全加载网站后执行AJAX。我只是想知道我应该在那里输入什么，将FancyBox初始化为刚刚生成的AJAX的新DOM。

对于mootools灯箱（如果我有的话）我可以简单地写下这一行：window.fireEvent（'domready'）;

我不知道如何为jQuery FancyBox做到这一点。

我也在这里发布了同样的问题（如果有人需要更多信息）：http://skrij.me/Qv56

Answer 1

每次更改DOM时都可以调用fancybox（例如$(".fancybox").fancybox();），或者使用使用“live”附加点击处理程序的版本2

Answer 2

您需要创建用于初始化fancybox的功能，例如

function fancybox_init(){
        $("a[href*='.jpg'], a[href*='.png']").attr('rel', 'fancybox').fancybox({
            maxWidth  : 800,
            maxHeight : 600,
            fitToView : true,
            width     : '70%',
            height    : '70%',
            autoSize  : true,
            closeClick    : false,
            openEffect    : 'none',
            closeEffect   : 'none'
        });
    }

然后在ajax重新加载页面或添加新块之后简单地调用此函数成功回调ajax方法

如何在AJAX更新DOM后重新初始化（回忆）FancyBox？

2 个答案: