描述框使用"onmouseover"

Question

我onmouseover在javascript中玩这个事件

我想要一个小盒子弹出并保持不动,直到没有onmouseover了

我认为它被称为描述框,但我不确定.

当我将鼠标放在某些文本上时,如何使用自定义文本弹出一个小框,并在将鼠标移动到另一个对象后消失.

Answer 1

假设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;
}

Answer 2

虽然不一定是JavaScript解决方案,但还有一个"标题"全局标记属性可能会有所帮助.

<a href="https://stackoverflow.com/questions/3559467/description-box-on-mouseover" title="This is a mouseover title">Mouseover me</a>

抓住我

Answer 3

好吧,我为此制作了一个简单的两个班轮脚本,它很小,可以做你想要的.

检查一下 http://jsfiddle.net/9RxLM/

它是一个jquery解决方案:D