Question

我正在使用colorbox创建一个弹出式图库，效果很好。现在，我正在尝试将pinterest pinit按钮添加到图库中。这是最好的javascript，如下所述：

https://developers.pinterest.com/on_hover_pin_it_buttons/

在图库照片上，pinit按钮确实出现在悬停状态，但它使用html页面的元数据作为引脚说明。我看了一下pinterest的javascript，这就是我认为描述设置的方式：

encodeURIComponent方法（a.getAttribute（＆＃34;数据管脚描述＆＃34）|| || a.title || a.alt d.d.title

我已尝试设置数据引脚说明，标题和替代文字（标签中的alt，标签中的标题），但我不认为其中任何一个正在填充colorbox gallery因为我总是得到meta html标题。

这是我正在使用的颜色框javascript：

<script type="text/javascript">
$(document).ready(function(){
var $gallery = $('a[rel=gallery]');
$gallery.colorbox();
$('a#openGallery').click(function(e){
$gallery.eq(0).click();
e.preventDefault();
});

这是html：

<a href="/Images/3406_lg.jpg" rel="gallery" title="My link title"><img src="/Images/Thumbs/FC-3406_lg.jpg" border="0" alt="my large alt text" width="70" height="70" class="thumb" data-pin-description="my data pin description" /></a>

我是否需要以某种方式在javascript中使用setAttribute才能在colorbox弹出时填充它？我试过了，它没有用，但可能语法已关闭。

谢谢，

比尔

Answer 1

我终于找到了一种让它工作的方法，但我必须直接编辑colorbox js。我在photo.onload = null

之后直接添加了这一行

photo.alt = $（element）.attr（'data-description'）;

这允许我在html中的标签上使用数据描述属性，并且当图像被固定时，pinterest会选择它。

在Pinterest的jQuery颜色框库中设置变量

1 个答案: