Question

在mouseover上可以将此div附加到鼠标指针，以便鼠标悬停时显示其内容吗？

<div id='show' style='display:none;'></div>

如果是这样，这是怎么做到的？

Answer 1

<div onmousemove="position();" onmouseout="hide();">abc</div>
<div id="tip" style="position: fixed; visibility: hidden;">that's abc!</div>
<script type="text/javascript">
  function position() {
    var d = document.getElementById('tip');
    d.style.visibility = 'visible';
    d.style.left = event.screenX + 'px';
    d.style.top = event.screenY + 'px';
  }
  function hide() {
    document.getElementById('tip').style.visibility = 'hidden';
  }
</script>

当用户将鼠标悬停在“abc”div上时，“那就是abc！” div显示在鼠标光标旁边（并跟随它）。

Answer 2

试试这个：

<div id='show' onmouseover="this.style.display = 'block';"></div>

但为了工作，div应该首先可见。但是，如果div是hiddne（显示：无），则无论何时事件都无法找到div，也不会触发任何事件。话虽如此，请尝试使用可见性属性。

<div id='show' onmouseover="this.style.visibility = 'visible';"  onmouseout="this.style.visibility = 'hidden';"></div>

在MouseOver上显示DIV

2 个答案: