Question

我在我的网站上使用了以下漂亮的照片代码：

     <ul class="gallery clearfix">
            <li><a href="images/fullscreen/2.jpg" rel="prettyPhoto"     title="&lt;a href=&#x27;http://www.google.ca&#x27; target=&#x27;_blank&#x27; &gt;This will    open Google.com in a new window&lt;/a&gt;"><img src="images/thumbnails/t_2.jpg" width="60"   height="60" alt="Picture alone 1" /></a></li>
        </ul>

然而，当我将鼠标悬停在网页上时，它会显示标题attributte中的内容

      <a href="http//www.google.ca" target="_blank" />This will open Google.com in a new window</a>

当我将图片悬停时，如何摆脱这些内容，但我仍然希望在我的代码中保留它，只是在悬停图片时不想看到它，有没有办法做到这一点，我不要不介意使用php，jquery，javascript那里有各种技巧来解决问题。任何人都可以提供帮助，非常感谢！

Answer 1

$(".gallery.clearfix a").each(function(){
    $(this).data("title",this.title);
}).hover(function(){
    $(this).attr("title","");
},function(){
    $(this).attr("title",$(this).data("title"));
}).mousedown(function(){
    $(this).attr("title",$(this).data("title"));
});

编辑：

http://jsfiddle.net/yAa7L/

这将用于清除和重置它...但不知道为什么这是必要的。

Answer 2

实际上，更好的解决方案是编辑PrettyPhoto的源代码并使其使用数据标题属性而不是标题。对于版本3.1.5，您可以通过编辑第155行并更改标题＆＃39;来完成此操作。到＆＃39;数据标题＆＃39;：

pp_descriptions = (isSet) ? jQuery.map(matchedObjects, function(n, i){ if($(n).attr(settings.hook).indexOf(theRel) != -1) return ($(n).attr('title')) ? $(n).attr('title') : ""; }) : $.makeArray($(this).attr('title'));

之后看起来像这样：

pp_descriptions = (isSet) ? jQuery.map(matchedObjects, function(n, i){ if($(n).attr(settings.hook).indexOf(theRel) != -1) return ($(n).attr('data-title')) ? $(n).attr('data-title') : ""; }) : $.makeArray($(this).attr('data-title'));

漂亮照片中的标题属性

2 个答案: