JavaScript onmousemove 显示 div 并跟随鼠标
我的应用程序中有一个客户记录列表（表中的 tr）。
当用户将鼠标悬停在记录 (tr) 上时，我想显示一个 div，该 div 悬停在其他记录上并显示有关该记录的更多详细信息。
我希望 div 随鼠标移动 - 即，如果他们将鼠标向右移动 20 像素，以便他们可以看到记录上的不同字段（tr），那么现在未隐藏的 div 应该向右移动 20 像素跟随光标。
这可以用 Javascript/CSS 实现吗？
I have a list of customer records (tr in a table) in my app.
When the user hovers their mouse over a record (tr), I want to show a div which hovers over the other records and shows more detailed information about the record.
I want the div to then move with the mouse- i.e. if they move the mouse 20 pixels to the right so they can see a different field on the record (the tr), the now unhidden div should then move 20 pixels to the right to follow the cursor.
Is this do-able with Javascript/CSS?
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（3）
是的。使用 CSS 属性
visiblility:visible/hidden执行可见/不可见部分，将position设置为absolute，然后将值赋给top（y 坐标）和mousemove元素上的left（x 坐标）。Yes. Do the visible/invisible part with the CSS property
visiblility:visible/hidden, setpositiontoabsoluteand then assign values totop(y-coordinate) andleft(x-coordinate) onmousemoveelements.很可能，它们被称为“工具提示”，其中可能有大量的工具提示。看起来这里有一个轻量级的工具，可以满足您的需求。
如果您使用框架（jQuery/prototype/mootools 等），那么很可能会有插件可以执行此操作。
Very possible, they're called "Tooltips" which there are probably a vast array of them out there. Looks like there's one here that is lightweight and does what you want.
If you're using a framework (jQuery/prototype/mootools etc), then there will most likely be plugins that will do this too.
对于预打包的 jquery 解决方案： http://jquery.bassistance.de/tooltip/demo/ 。
查看启用了跟踪的示例。
For a prepackaged jquery solution: http://jquery.bassistance.de/tooltip/demo/.
Check out the example that has tracking on.