javascript - 使用 “onmouseover”的描述框

我正在玩javascript中的onmouseover事件

我想弹出一个小盒子，直到没有onmouseover为止

我认为它称为描述框，但我不确定。

将鼠标放在某些文本上时如何得到一个带有自定义文本的小框，当将鼠标移到其他对象上时消失。

最佳答案

假设popup是您的“说明框”的ID:

HTML

<div id="parent"> <!-- This is the main container, to mouse over -->
<div id="popup" style="display: none">description text here</div>
</div>

JavaScript

var e = document.getElementById('parent');
e.onmouseover = function() {
  document.getElementById('popup').style.display = 'block';
}
e.onmouseout = function() {
  document.getElementById('popup').style.display = 'none';
}

另外，您可以完全摆脱JavaScript并仅使用CSS:

CSS

#parent #popup {
  display: none;
}

#parent:hover #popup {
  display: block;
}