花式盒子3.0标题在顶部

Fancybox 3.0 title at the top

本文关键字：标题 顶部 盒子      更新时间：2023-09-26

我正在使用fancybox 3.0 Beta 1，标题有问题。我希望标题在顶部而不是底部。

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

我已经用过这个 http://jsfiddle.net/JYzqR/但它不起作用，因为它适用于 fancybox 2.0（我认为它也适用于 3.0，但它不会）。

你能帮我把标题移到顶部而不是底部吗？

谢谢！

Fancybox 3中的"title"称为"caption"。您可以将其作为 data-caption 属性传递给 HTML 元素： 

<a href="image.jpg" data-fancybox data-caption="My caption">
    <img src="thumbnail.jpg" alt="" />
</a>

或作为 JS API 的选项：

$.fancybox.open([
    {
        src  : 'image.jpg',
        opts : {
            caption : 'My caption',
            thumb   : 'thumbnail.jpg'
        }
    }
]);

似乎不再支持"标题"选项（例如写在内容上方的文本）。根据开发人员的说法，它看起来"过时了"。

根据文档，您应该能够通过覆盖花哨的框css规则来"完全改变模态的外观"。但是，这似乎并不可行，因为用于为标题创建空间的padding-bottom似乎是由JS核心设置的。

相关文章：