Question

我在之前的帖子中找不到任何可以解决我问题的内容，所以这是我的问题：

我正在使用Fancybox图片库，当我将鼠标悬停在主页面上的缩略图上时，他们会从灯箱中弹出的每个集合中的第一张大图片中获取标题。我不希望发生这种情况 - 我不希望鼠标悬停在缩略图上。

有没有办法阻止这种情况发生？

<div class="imglist"> 
<div align="center">
<a class="fancybox" rel="set1" href="images/Arch/OVAL/entry.jpg" 
    title="Richmond Olympic Oval - Entry">
<img src="images/headers/1.jpg" width="150" height="150" border="0">
</a>
</div>

Answer 1

目前，无法使用CSS设置（或隐藏）默认的title属性。在jQuery中实现它的一种方法是在悬停时将其删除：

$('[title]').on('mouseenter', function() {
    var $this = $(this);
    $this.data('title', $this.attr('title')).prop('title', null);
}).on('mouseleave', function() {
    var $this = $(this);
    $this.attr('title', $this.data('title')).data('title', null);
});

或者您可以永久删除

(function($) {
    $('.i-dont-want-title').each(function() {
        var $this = $(this);
        $this.data('title', $this.attr('title')).prop('title', null);
    });
})(jQuery);

并将其用于自定义工具提示。

Answer 2

我修好了！我找到了三个attr实例（js中的'title'，将它们更改为attr（'data-title'，现在我在灯箱中的图像上获得了标题，但是没有任何内容悬停在缩略图上。它似乎工作在所有浏览器上也是如此。

感谢你的建议，Thew。

防止标题在鼠标悬停时出现

2 个答案: