Jquery Fancybox中的Div-fired画廊

我使用的是Fancybox 2，而不是使用

标记来启动Fancybox，我使用的是

div

标记，在我的Javascript中，我使用以下代码：

$('#portfolio>#project').click(function(){
    $background_image = $(this).css("background-image");
    $background_image = $background_image.replace('url(','').replace(')','');
    $.fancybox({
        href: $background_image
    });
});

---

但是，通过遵循Fancybox文档创建图库（通过将

rel=“gallery1”

添加到您的图像中，或者在我的例子中添加

div

s），没有幻灯片，当启动Fancybox并显示图像时，您无法从一个图像导航到另一个图像。

您始终可以使用Fancybox的特殊

数据Fancybox-*

属性将任何html元素绑定到Fancybox，而不是

标记（并创建没有

rel

属性的图库），如：

<div data-fancybox-group="gallery" data-fancybox-href="#inline1" class="fancybox">open first fancybox item</div>

---

由于没有人真正知道我的问题的答案，我决定坐下来仔细研究我的代码；我决定我需要创建一个插件来让它工作

当我开发我的公文包（）时，我开发了它，这样Fancybox就不再是来自

$(".fancybox").click(function(){
    // populate the target inline element here
}).fancybox();

$.fn.fancyGallery = function($gallery_name){
    $(this).each(function(){
        $background_image = $(this).css("background-image");
        $background_image = $background_image.replace('url(','').replace(')','');

        $(this).attr({
            "data-fancybox-group": $gallery_name,
            "data-fancybox-href": $background_image
        });     
    });
};