javascript - 为表格单元格添加悬停显示

Question

我有一个表格，但它不是列表格式，这意味着不是列/行格式。我寻找特定的单元格以添加显示单元格描述的悬停事件。

$("#TableID td").hover(function(){
//ifCellThatIWant
   $(this).append("<span>Message that was brought in</span>");
   },
   function(){
    $(this).children().remove();
    });

现在的问题是悬停显示一个跨度(里面有信息)，当鼠标悬停时我使用jquery将跨度附加到单元格，这会扩展单元格，这是我不喜欢的效果或想要。我正在尝试从桌面上看，但仍然在触发事件的单元格旁边；因为如果跨度有很多信息。在其中，动态扩展单元格将开始看起来非常讨厌。如果我有某种类型的 css 指导，我将如何使鼠标悬停“描述”跨度的显示看起来不错，这也会有所帮助。我的想法是，实现我想要的方法的一种方法是在鼠标悬停时为鼠标光标的位置附加 span，但不确定它是否正确或语法是什么样子。

Answer 1

将跨度显示为 block 并将 z-index 设置为大于页面上的任何其他内容。然后就可以绝对定位了，设置left和top属性为鼠标所在位置的x和y位置。

编辑:

这是我的意思的演示 --> http://jsbin.com/odape .我建议不要附加跨度，而是建议在 html 底部创建一个占位符以用于每个单元格，然后更改要显示的文本(不确定你是如何引入它的，所以我没有将它添加到我的例子。