Fancybox переносит номер img в отдельный диапазон

У меня есть галерея fancybox с заголовком, содержащим заголовок и номер изображения: например. 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 : '');}
    });

Как мне это сделать?

Спасибо


person KSPR    schedule 31.01.2013    source источник


Ответы (1)


Вы можете сделать что-то вроде:

$(".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.

person JFK    schedule 31.01.2013