我有一个带有标题的花哨的画廊,其中包含标题和图像编号:例如 Title 1/2
的右侧显示图像编号,在左侧显示标题。因此,我需要将 img 编号包装到一个单独的 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 数字生成如下:
$(".fancybox").fancybox({
afterLoad : function() {this.title = (this.index + 1) + ' / ' + this.group.length + (this.title ? ' - ' + this.title : '');}
});
我该怎么做?
谢谢
你可以做这样的事情:
$(".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