Javascript 鼠标悬停时显示类似于jQuery的div工具提示 考虑休眠场景 <p>jhony</p> <p>ram</p> <p>lilly</p> <div id="about"></div> <script> $(function() { $('p').hover(function() { $('#about').show(); }, function() { $('#about').hide(); }); });

jhony

公羊

礼来

$（函数（）{ $（'p'）.hover（函数（）{ $（'#about'）.show（）； }，函数（）{ $（'#about'）.hide（）； }); }); 知道鼠标悬停在p标记上div将显示，但它始终处于固定/绝对位置，但我想显示它相对于悬停元素的位置

例如：

如果我把鼠标放在'jhony'上，那么about div应该显示在它的左边， 如果我把鼠标放在“ram”上，那么关于div应该显示在它的左边， 若我把鼠标放在“lilly”上，那个么它的左边应该显示about div

---

最后，它应该像jQuery工具提示一样工作。

为什么要使用jQuery？你只能使用css

p:hover span{display:block}

或者，若要使用jQuery/js，则必须计算从窗口顶部到p的高度，并将其设置为div：

$（函数（）{
$（'p'）.hover（function（）{$（'about'）.css（'top'，this.offset（）.top
)}

为什么不使用jQuery工具提示？看看这个，工具提示显示在项目的右侧。请查看jQuery网站，你可以在那里找到很多信息检查这个问题，同样的问题使用offset.top。