Question

我在我的WordPress插件中使用Colorbox来创建Flickr照片库。这就是典型的HTML代码 -

<a href='link/to/large/photo/on/flickr.jpg' title='Caption for the photo on Colorbox'>
    <img src='link/to/small/photo/on/flickr.jpg'>
</a>

Colorbox使用锚标记中的title值在彩色框视图中呈现图像的标题。

现在我想在图片的标题中包含照片的Flickr页面的链接。链接显示正常后效果非常好，但是当它显示HTML代码时，它会产生照片的工具提示文本问题。

所以问题是，如何为锚标记的标题和工具提示文本设置不同的值。

到目前为止，我已尝试使用onmouseover / onmouseout / onmousedown来更改title属性并将其设置回来。但这对我不起作用，因为多个图像被分组在一个Colorbox中，并且所有这些事件都不会触发所有图像。

我希望我的问题清楚明了。

更新：解决此问题的方法是使Colorbox使用alt标记的img属性，而不是title标记的anchor属性。

jQuery("a[rel^='example4']").colorbox({
    title: function(){ return jQuery(this).find('img').attr('alt');}
    });
});

Answer 1

我为它写了ColorBox而不是WordPress插件，所以我不确定如何用WordPress实现它。您将需要使用ColorBox的title属性来指定您自己的标题格式。例如：

$('.myphotos').colorbox({title:function(){
  var link;
  // do some to convert your image href to it's corresponding flickr URL
  return $(this).attr('title') + " <a href='" + link + "'>Flickr</a>";
}});

锚标记的标题和工具提示文本的不同值

1 个答案: