在图像右侧有多个标题的fancybox

Question

我需要在图片的右侧显示图片标题，日期和链接。

类似于此example

的内容

默认情况下，fancybox允许我们使用少量选项，例如inside，outside，top但不是left或right一侧的图像。并使用导航按钮< >

$(".fancybox").fancybox({
    helpers : {
        title: {
            type: 'inside',
            position: 'top'
        }
    },
    nextEffect: 'fade',
    prevEffect: 'fade'
});

我们是否有办法像

中的图片所示

小提琴示例http://jsfiddle.net/JYzqR/

Answer 1

您可以使用fancybox tpl（模板）选项并像afterLoad一样在回调中添加信息，如下所示：

$(".fancybox").fancybox({
    helpers : {
        title: {
            type: 'inside',
            position: 'top'
        }
    },
    nextEffect: 'fade',
    prevEffect: 'fade',
    afterLoad: function() {
        var html = '<span>Date, File Type, Download</span>';
        $('.fancybox-sidebar').append(html);
    },
    tpl: {
        wrap     : '<div class="fancybox-wrap" tabIndex="-1"><div class="fancybox-skin"><div class="fancybox-outer"><div class="fancybox-inner"></div><div class="fancybox-sidebar"></div></div></div></div>'
    }
});

<强> DEMO