onmouseover不正确

Question

我想将鼠标悬停在文字 ＆＃34;我＆＃34; 上，然后弹出 ＆＃34;你和＃34;

<div class="relative"> 
<p onmouseover="document.getElementById('toolTipDiv').className='activeToolTip'"
onmouseout="document.getElementById('toolTipDiv').className='idleToolTip'">Me<p/>
<div id="toolTipDiv" class="idleToolTip">You.</div>
</div>

Answer 1

我建议使用jQuery！

你的tooltipDiv应该有display: none作为CSS属性，然后使用：

<p onmouseover="$('#toolTipDiv').show();"
onmouseout="$('#toolTipDiv').hide();">Me<p/>

如果您的tooltipDiv显示在“我”文本上，则表示您遇到问题，因为触发了onmouseout事件。不知道你的工具提示出现在哪里！

Answer 2

的 HTML 的

<p class="me">Me</p>
<div id="activeToolTip">You</div>

的的jQuery 的

$('.me').hover(function() {
  $('#toolTipDiv').removeClass('idleToolTip').addClass('activeToolTip');
}, function(){
  $('#toolTipDiv').removeClass('activeToolTip').addClass('idleToolTip');
});

或 的

只需显示隐藏即可：

$('.me').hover(function() {
  $('#toolTipDiv').toggle()
});