Fancybox将img编号包装到单独的span中

时间:2013-01-31 10:13:46

标签: jquery fancybox fancybox-2

我有一个带有标题的fancybox图库,其中包含标题和图片编号:例如Title 1/2

我想将图像编号放在图像的右侧,标题放在左侧。因此,我需要将img Number包装到单独的span标记中。我该怎么做?

现有的标记:

<div class="fancybox-title fancybox-title-float-wrap">
   <span class="child">5 / 7 - Soitinrakentajat pajalla, 2012</span>
</div

但应该是:

<div class="fancybox-title fancybox-title-float-wrap">
   <span class="child">Soitinrakentajat pajalla, 2012</span>
   <span class="text-right">5 / 7</span>
</div>

img numers是这样产生的:

$(".fancybox").fancybox({
        afterLoad : function() {this.title = (this.index + 1) + ' / ' + this.group.length + (this.title ? ' - ' + this.title : '');}
    });

我该怎么做?

谢谢

1 个答案:

答案 0 :(得分:2)

你可以这样做:

$(".fancybox").fancybox({
    helpers: {
        title: {
            type: 'inside'
        }
    },
    beforeShow: function () {
        this.title = "<span class='mySpanLeft'>" + (this.title ? this.title : '') + "</span>" + "<span class='mySpanRight'>Image " + (this.index + 1) + ' / ' + this.group.length + "</span>";
    }
});

参见 JSFIDDLE