检测文本溢出已经起作用并添加包含全文的工具提示

我有一个包含电子邮件地址的简单范围。

[e-mail] 

在我的CSS中，跨度设置为带有省略号溢出的固定宽度。

 #email { display: inline-block; width: 100px; overflow: hidden; text-overflow: ellipsis; } 

这很好用。 但是，我想检测它是否以某种方式工作并在span的title属性中显示全文。

我怎样才能做到这一点？ 纯CSS将是完美的，但如果这是不可能的，那么jQuery是下一个最好的东西。

Answer 1

您无法使用CSS检测溢出。 但是使用JavaScript就是这样：

JavaScript的

 var e = document.getElementById('email'); if (e.scrollWidth > e.clientWidth) { alert("Overflow"); } 

演示

买前先试试