Question

我在此页面上有一个非常简单的Photoswipe图库：http://neighborhoodpets.wink1733.com

如何为主页上没有拇指的照片添加标题？

我只希望它在激活Photoswipe图库时显示。

现在是第二张＆＃34; Snoop Ray＆＃34;没有标题。

感谢您对解决此问题的任何建议。

Answer 1

您可以在第二个Snoop Ray data-title元素上添加a属性，如下所示：

<a data-title="Snoop Ray 4877 Jewell" href="images/snoopRay02_lg.jpg" itemprop="contentURL" data-size="750x1334" data-med="images/snoopRay02_med.jpg" data-med-size="750x1334" title="Snoop Ray" data-author="Todd Ray" alt="Snoop Ray"></a>

然后，在您的脚本中，更改此：

// create slide object
item = {
    src: el.getAttribute('href'),
    w: parseInt(size[0], 10),
    h: parseInt(size[1], 10),
    author: el.getAttribute('data-author')
};

到此（仅插入title行）：

// create slide object
item = {
    src: el.getAttribute('href'),
    w: parseInt(size[0], 10),
    h: parseInt(size[1], 10),
    author: el.getAttribute('data-author'),
    title: el.getAttribute('data-title')
};

就是这样！

对于第二个Snoop Ray图像，标题现在为Snoop Ray 4877 Jewell加上作者，而不会更改其他图片标题。

确实（如果您想知道），在您的脚本中，这会将其标题设置为位于figure元素中的图片标题：

if(childElements.length > 0) {
  item.msrc = childElements[0].getAttribute('src'); // thumbnail url
  if(childElements.length > 1) {
      item.title = childElements[1].innerHTML; // caption (contents of figure)
  }
}

Photoswipe：如何在显示页面上显示没有拇指的照片的字幕

1 个答案: