是否可以隐藏href标题?

时间:2009-08-24 14:47:30

标签: html css slimbox

<a href="link.html" title="Titletext">

...是代码。

由于slimbox,我需要使用title属性,但我想隐藏将鼠标悬停在链接上时显示的标题文字。

有什么想法吗?

16 个答案:

答案 0 :(得分:18)

一个简单的简单:

<a href="link.html" title="Titletext"><span title=" ">text</span></a>

(更好的是,在嵌套标题中添加实际有用的东西。)

答案 1 :(得分:17)

假设您在a标签中使用了图片标签,您可以使用图片的替代标题(甚至是空格),并且当您将鼠标悬停在链接上时会覆盖链接的标题。

答案 2 :(得分:9)

使用jQuery非常简单

$("li.menu-item > a").attr('title', '');

这将从li class菜单项的任何元素中删除标题 - 当然你可以看上去因为它们只是隐藏在鼠标上:)

答案 3 :(得分:7)

关于我在几个网站上列出的“如何简单”的建议,我个人不会建议这有两个原因。

  1. 屏幕阅读器和视障用户依赖于大声读出的标题属性。我相信这是他们在锚标签中的最初目的和原因,并且是美国州政府网站可访问性部分508的一个重要方面。我认为这个例子中的屏幕阅读器会读取所有标题;第一个,然后是第二个,对视障用户来说可能非常混乱。他们不明白为什么他们听到两个esp,如果它有不同的文字。他们听到的是两种不同的锚吗?如果是这样,为什么他们不能点击或选择他们听到的另一个并且只能获得一个网页(作为场景)。

  2. 如果你在标题的谷歌和许多其他搜索引擎中放置其他文字可能会将此操作视为黑帽seo并可能导致您的网站被禁止从该搜索引擎列表(也称为填充),这发生在宝马谷歌已经在德国。

  3. 我个人认为最好的方法是保留title属性,因为它意味着运行,然后使用Javascript或css以某种方式隐藏它。这些方法对屏幕阅读器,网络抓取工具和视障用户没有任何影响。

答案 4 :(得分:3)

我喜欢jquery ......;)我需要这个用于投资组合:灯箱的标题标签,但鼠标悬停没有。这对我有用,谢谢你的提示!

$(function(){
    $("li.menu-item > a").hover(function(){
        $(this).stop().attr('title', '');},
        function(){$(this).stop().attr();
        });
});

答案 5 :(得分:2)

// Suppress tooltip display for links that have the classname 'suppress'

var links = document.getElementsByTagName('a');
for (var i = 0; i < links.length; i++) {
    if (links[i].className == 'suppress') {
        links[i]._title = links[i].title;
        links[i].onmouseover = function() {
             this.title = '';
        }
        links[i].onmouseout = function() {
             this.title = this._title;
        }
    }}

引用Aron Rotteveel在我的评论中链接到问题的第一个骗局的答案( Disabling browser tooltips on links and <abbr>s

答案 6 :(得分:1)

您不必在Slimbox中使用title属性。请参阅本页顶部附近的多个图像示例:http://code.google.com/p/slimbox/wiki/MooToolsAPI

您只需从锚点中移除title属性,然后将title文字(图片说明)传递给Slimbox open函数,您可以使用{onclick函数调用该函数。 1}}你的锚的事件。

答案 7 :(得分:1)

最简单的方法是:

使用slimbox后,在其下方添加以下代码:

$('*[title]').removeAttr('title');

希望它可以帮助..

答案 8 :(得分:0)

无法保证,但根据Slimbox的工作方式,您可以在页面加载后几秒钟内包含标题,然后使用类似jQuery的内容删除。假设Slimbox为Title属性编制索引并在读取后将其存储在某处,您可以在发生这种情况后安全地删除它。

答案 9 :(得分:0)

你不能只循环遍历DOM中的链接并将title属性设置为空字符串。

var DOMlinks = document.links;
for(i=0;i<DOMlinks.length;i++){
DOMlinks[i].title = ""
}

答案 10 :(得分:0)

用空jQuery tooltip覆盖/覆盖它?

答案 11 :(得分:0)

如果您使用的是jquery,则可以执行以下操作

$("a").mouseover(function(e){ preventdefault();} );

(虽然没有测试过)

答案 12 :(得分:0)

使用David Thomas的想法,您可以使用jQuery创建更优雅的解决方案:

$('[title]').each(function(){
    $(this).data('original-title', $(this).attr('title'));
}).hover(
    function () { 
        $(this).attr('title','')
    }, function () { 
        $(this).attr('title',$(this).data('original-title'))
});

答案 13 :(得分:0)

jQuery解决方案 - 这应该是直截了当的:

var hiddenTitle; //holds the title of the hovered object
$("li.menu-item > a").hover(function() {
    hiddenTitle = $(this).attr('title'); //stores title
    $(this).attr('title',''); //removes title
}, function() {
    $(this).attr('title',hiddenTitle); //restores title
});

答案 14 :(得分:0)

这是我的jQuery解决方案,它可以完成您需要的一切并保持title属性的正确使用。只需根据需要更换选择器。

/*
 * jQuery remove title browser tooltip
 */
var removeTitleSelector = 'a.removeTitle';
jQuery('body').on('mouseover', removeTitleSelector, function () {
    jQuery(this).data('title', jQuery(this).attr('title'));
    jQuery(this).removeAttr('title');
}).on('mouseout', removeTitleSelector, function () {
    jQuery(this).attr('title', jQuery(this).data('title'));
});

答案 15 :(得分:0)

正如另一个问题所述,我建议将“标题”属性切换为某些“数据标题”,以便屏幕阅读器可供残疾用户使用。正如Lokin所说,在开发过程中,保持网站对受损和残疾用户的可用性也应该引起关注。