我可以依赖显示为工具提示的标题属性吗？

发布于 2024-12-05 01:39:12 字数 222 浏览 1 评论 0原文

我们在网站中编写简单的工具提示已经有一段时间了，并且刚刚意识到我们可以通过简单地使用“标题”属性来完成同样的事情。我们有什么理由不应该使用 title 属性作为工具提示吗？是否有不支持此功能的浏览器？（w3schools 似乎表明所有主流浏览器都支持这一点。）

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

太阳哥哥 2024-12-12 01:39:12

这是一个标准，你应该很安全。

请参阅http://www.w3.org/TR/ html4/struct/global.html#h-7.4.3

回复收藏 0 原文

吐个泡泡 2024-12-12 01:39:12

所有主流浏览器都支持 title。但是您无法显示这种自定义工具提示： http://www.dreamcss.com/2009/03/list-of-25-javascriptajax-css-tooltip.html

您是否见过用户将卡片悬停在 SO 上（此地点）？如果他们使用了标题，那么可能无法显示如此精彩的工具提示。

回复收藏 0 原文

美人骨 2024-12-12 01:39:12

所有主流浏览器确实都支持工具提示，因此请随意使用它们的 title 属性。我要提醒您的是，您还提供了一个 alt 属性来镜像标题，以实现可访问性（主要针对低视力和盲人用户）和容错（例如，如果图像无法加载或用户正在使用图像阻止用户）来自慢速连接的代理）。

回复收藏 0 原文

独守阴晴ぅ圆缺 2024-12-12 01:39:12

它的显示速度非常慢（Chrome 上为 1 或 2 秒），我怀疑现代互联网用户是否有那么大的耐心等待它的显示。

您可以使用第三方插件或使用 jQuery 的“mouseenter”和“mouseleave”事件自行对其进行硬编码（我大部分时间都是这样做的）。虚拟代码如下：
html:

<button id="button-awesome">Awesome</button>

<div class="tooltip" style="display:none">
This is a button
</div>

JavaScript/jQuery：

$('#button-awesome').on('mouseenter', function () {
  show Tooltip // toggle, or slideToggle, or .css("display","block") or .removeClass('hidden')
}).on('mouseleave', function () {
  // undo what you've just done. 
});

It's really slow to show up(1s or 2 on Chrome) and I doubt modern internet users have that much patience waiting for it to show.

You could use third party plugins or hard code it yourself(what I do most of the time) using jQuery's "mouseenter" and "mouseleave" events. Dummy code as below:
html:

<button id="button-awesome">Awesome</button>

<div class="tooltip" style="display:none">
This is a button
</div>

JavaScript/jQuery:

$('#button-awesome').on('mouseenter', function () {
  show Tooltip // toggle, or slideToggle, or .css("display","block") or .removeClass('hidden')
}).on('mouseleave', function () {
  // undo what you've just done. 
});

回复收藏 0 原文