的onmouseover不正確

Question

我想文本將鼠標懸停在「我」以及它與「你」彈出。

<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'); 
}); 

OR

僅供展示你可以做：

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