Fancybox 2 - 显示图像计数为标题

时间:2021-11-29 20:25:39

I would like to have "Image 1 of 3" (relating to the images position inside it's linked gallery) inside the title of the Fancybox popup, something like so:

我希望在Fancybox弹出窗口的标题内有“Image 1 of 3”(与其链接图库中的图像位置相关),如下所示:

$(document).ready(function() {
    $(".fancybox-button").fancybox({
        prevEffect      : 'none',
        nextEffect      : 'none',
        closeBtn        : false,
        helpers     : {
            title   : { type : 'inside'},
            buttons : {}
        },
        afterLoad : function() {
                this.title = 'Image ' + (this.index + 1) + ' of ' + this.group.length + (this.title ? ' - ' + this.title : '');
            }
    });
});

I've searched far and wide, but can't find it anywhere.

我搜索得很远,但在任何地方找不到它。

EDIT

I managed to get it working on the first click using afterLoad however can't find similar functions for next and previous click.

我设法让它在使用afterLoad的第一次点击时工作但是找不到下一次和上一次点击的类似功能。

1 个解决方案

#1


1  

if you are using fancybox v2.0.6+ use the API option beforeShow like :

$(document).ready(function(){
 $(".fancybox").fancybox({
   helpers : { 
title : { type : 'over' }
}, // helpers
beforeShow : function() {
this.title = (this.title ? '' + this.title + '' : '') + 'Image ' + (this.index + 1) + ' of ' + this.group.length;
} // beforeShow
}); // fancybox
}); // ready`

#1


1  

if you are using fancybox v2.0.6+ use the API option beforeShow like :

$(document).ready(function(){
 $(".fancybox").fancybox({
   helpers : { 
title : { type : 'over' }
}, // helpers
beforeShow : function() {
this.title = (this.title ? '' + this.title + '' : '') + 'Image ' + (this.index + 1) + ' of ' + this.group.length;
} // beforeShow
}); // fancybox
}); // ready`