jquery - fancybox 3 添加缩略图标题

Question

我在我的应用程序中使用 fancybox 3，我想为每个缩略图添加标题，我已经有了图像的标题。 但我想将这些标题添加为缩略图的标题，以便当我将鼠标悬停在每个缩略图上时可以看到标题。 fancybox 缩略图是否有任何选项可以添加标题或工具提示？

view fancybox thumbnail

我只找到这些选项

thumbs: {
  autoStart: false,
  hideOnClose: true, 
  parentEl: '.fancybox-container',
  axis: 'y'
},

Answer 1

我认为没有合适的解决方案。我必须自己把它拼凑起来。基本上，只需在 data-caption 属性中添加一些 HTML，然后使用 CSS 对其进行样式设置即可。您应该也可以通过 JS 添加标题。

  .fancybox-inner .slide-title {
    position: fixed;
    top: 11px;
    left: 50%;
    transform: translate(-50%, -0%));
  }

<a href="img.jpg" data-fancybox="gallery" data-caption="<span class='slide-title'>MY Title</span> My Caption Text">
  My fancybox init text
</a>