colorbox - 页面已加载，其中的图像不作为 colorbox 加载

Question

我对颜色框有疑问。

我有这个用于加载页面的脚本：

$(document).ready(function(){

    // ColorBox
    $("a[rel='colorbox']").colorbox({
        close: "Zavřít",
        current: "Obrázek {current} z {total}",
        next: "Další",
        previous: "Předchozí"
    });

    // ColorBox - Module
    $(".load").colorbox({
        close: "Zavřít",
        fixed: true,
        maxHeight: $(window).height() - 80,
        opacity: 0.75,
        top: 30,
        width: $(window).width() - 100
    });

});

它在彩盒中加载良好，但我在加载页面中有图像，我也希望它们在彩盒中加载。

有什么帮助吗？

非常感谢。

更新：

我试过了：

$(".load").colorbox({
    close: "Zavřít",
    fixed: true,
    maxHeight: $(window).height() - 80,
    opacity: 0.75,
    top: 30,
    width: $(window).width() - 100,
    onComplete: function(){
        $("a[rel='colorbox']").colorbox({
            close: "Zavřít",
            current: "Obrázek {current} z {total}",
            next: "Další",
            previous: "Předchozí"
        });
    }
});

这样更好。图片尝试加载，但有一些错误。当我单击图像以将其加载到颜色框中时，它开始加载但图像未加载（不显示，仍在加载图像）。如果我单击下一个或上一个，它可以工作（图像显示），但当前标题仍然相同，并且颜色框工作异常（位置，单击区域以关闭和快捷键不起作用）。

有一个例子（AKCE - SHOW）：http://rene-pastor.vf-fans.net/jitka-valkova/

Answer 1

由于加载页面颜色框内的图像是在 DOM 准备好后加载的，因此您需要在加载后使用 onComplete 回调将 $.colorbox() 附加到它们，如下所示：

$(".load").colorbox({
    close: "Zavřít",
    fixed: true,
    maxHeight: $(window).height() - 80,
    opacity: 0.75,
    top: 30,
    width: $(window).width() - 100,
    onComplete : function(){
        $("a[rel='colorbox']").colorbox({
            close: "Zavřít",
            current: "Obrázek {current} z {total}",
            next: "Další",
            previous: "Předchozí"
        });
    }
});

我希望这会有所帮助！