鼠标悬停以显示数据

Question

经理的第一个名字显示在页面上。我想在将鼠标悬停在“眼睛”图标上时显示经理的全名。是否有可用于执行此操作的JavaScript？以下是我的代码。谢谢

<td><span class="eye"></span><s:property value="managerfullname" /></td>

Answer 1

您不需要JS将${...}属性与data-*伪和:after

一起使用

:hover

[data-surname]:hover:after{
  content: " " attr(data-surname);
}

如果你想要“弹出”而不是

<span data-surname="C. Buljan">Roko</span>

[data-surname]{
  position:relative;
}
[data-surname]:hover:after{
  position: absolute;
  white-space: nowrap;
  top: 100%;
  left:0;
  background: #eee;
  padding: 4px 8px;
  content: attr(data-surname);
}