隐藏<a> tag when hovered</a>上的标题

时间:2014-01-18 07:53:47

标签: php jquery html css lightbox2

我试图在悬停时隐藏标题标签,或者阻止其默认操作,我在google上研究了很多方法。是的,他们工作,他们隐藏标题,但隐藏后,我不能使用标题标题。我想隐藏它并在我的代码的后半部分使用它。

 <a  href=\"".$src."\" data-lightbox=\"example-3\" title=\"".$Tri_CAPTION."\">

4 个答案:

答案 0 :(得分:1)

您可以将其存储在节点内以进行恢复或参考,然后再删除:

$('a').data("title", $('a').attr("title")).removeAttr("title");

console.log($('a').data("title")); //retrieve the `data-title` which we're saving

Demo

答案 1 :(得分:1)

当悬停时隐藏小title弹出窗口不是你可以直接控制的东西,因为它是浏览器/操作系统级别的行为。

当您通过JavaScript进行悬停时,您可以删除 title属性,这样就无法在悬停时显示任何内容,并且可能会完全禁用悬停弹出窗口(它在Chrome 31上用于Win7我)。然后,当悬停停止时,您将重新添加title。使用jQuery的.hover()事件监听器函数的示例:

HTML

<a title="foobar">blarg</a>

的JavaScript

var title; // Need to cache the title to add back when hovering stops

$('a').hover(function() {
    title = $(this).attr('title');
    $(this).attr('title', '');
}, function() {
    $(this).attr('title', title);
});

显然,您需要更改适用于您自己的特定标记的选择器。不幸的是,我不确定这会对你的灯箱插件有多好,但是加入它可能会让一切都能在一起工作。

JSFiddle

答案 2 :(得分:1)

您可以使用自定义属性并将标题移至该属性;

<a href="#" title="lorem ipsum dolor" data-title="initial">Hover me</a>

$("a").hover(function() {
    $(this).prop("data-tite", $(this).attr("title"))
     $(this).removeAttr("title");
    console.log($(this).prop("data-tite"))
});

这是一个工作小提琴:http://jsfiddle.net/Y5kF2/

答案 3 :(得分:0)

  

为标题属性

编写display:none之类的css代码
a[title]{display:none;}