Fancybox：添加标题和其他东西

我想知道如何添加标题（例如标题或链接）到fancybox。我知道，如果我添加标题=“Bla”，它会显示在框中。但是，如果我在图片链接中添加了caption =“Blabla”之类的东西，我需要在jquery.fancybox.js中使用哪些代码来提取该标题标签？Fancybox：添加标题和其他东西

来源

2012-09-10 Jean

[Fancybox 2 Custom Titles and Captions \ [from A（title）and IMG（alt \]]）可能的重复（http://stackoverflow.com/questions/9058442/fancybox-2-custom-titles-and-字幕 - 从 - atitle和imgalt） – Ankur

由于您可以在自己定制的fancybox脚本中添加此选项，因此您不需要与原始jquery.fancybox.js文件混淆。

如果您正在使用HTML5 DOCTYPE，你可以为你添加字幕，所以你可以有这个HTML使用data-*属性：

<a class="fancybox" href="images/01.jpg" data-caption="This is the caption" >Open fancybox</a>

再设置自定义的fancybox脚本，并使用了beforeShow回调像

得到 data-caption

$(document).ready(function() { 
$('.fancybox').fancybox({ 
    beforeShow : function(){ 
    this.title = $(this.element).data("caption"); 
    } 
}); 
}); // ready

这将覆盖title并使用data-caption来代替。

在另一方面，你可能要保持title属性和建设的fancybox的title结合两种，title和data-caption属性的话，这个HTML

<a class="fancybox" href="images/01.jpg" title="This is the title" data-caption="This is the caption">Open fancybox</a>

使用该脚本

$(document).ready(function() { 
$('.fancybox').fancybox({ 
    beforeShow : function(){ 
    this.title = this.title + " - " + $(this.element).data("caption"); 
    } 
}); 
}); // ready

此外，您还可以从文档中的其他HTML元素（例如<div>）获取caption/title，该文档可以包含链接或其他呃HTML元素。检查这些职位代码示例：https://stackoverflow.com/a/9611664/1055987和https://stackoverflow.com/a/8425900/1055987

注意：这是对的fancybox v2.0.6 +

来源

2012-09-10 18:29:05 JFK

谢谢，这有很大的帮助！ – Jean

完美的优雅的解决方案。谢谢！ –

@JFK有没有办法保持/举行说明可见？在我的environmet，字幕消失后秒 –

老问题，但由于肯尼迪的答案，我发现，随着fancybox最新版本即可只需在title=""属性中输入一个值即可添加标题（默认情况下）。只要确保它包含在fancybox类的<a>元素中。

来源

2014-11-19 22:23:22

谢谢，这是我第一次阅读包括它的链接。 – tehlivi

很高兴我可以帮助@tehlivi –

这应该现在是一个收到答案。不幸的是，OP是M.I.A.自2013年起。 – Mike

Fancybox：添加标题和其他东西

回答

相关问题