flickering effect happening when trying to use show() and hide()

I am trying to create a tooltip function for a webpage I am building. I have a table of elements and one of the columns contains a short description. I am trying to create an effect where a user hovers over the short description and I display the full description from a hidden div tag.

The hover effect is working however if I move down to the next row outside of the orginal div tag, the jquery gets into a confused state and flickers and doesnt allow me t开发者_如何学Co mouse over to view the description of the row below.

If I mouse upwards it works fine.

My jquery function looks like

$('.alarms-desc').live('mouseover mouseout', function (event) {
var target = $(this).find(".tooltip");
if (event.type == "mouseout") {
    target.hide("fast");
}
if (event.type == "mouseover") {
    target.show("fast");
}

});

My css looks like

.tooltip {
display:none;
margin:0 10px 1em 0;
padding:8px;
background:#fcfcfc;
border:1px solid #e1e1e1;
line-height:130%;
background-color: #DCDCDC;
border: solid 1px #DCDCDC;
border-radius: 4px;
-moz-border-radius: 4px;
max-width: 500px;
position: absolute;
}

.alarms-desc
{
display: block;
}

Some of the html

<div id="AD_40ba5b52-8a8e-40cf-99e3-fbb9cbea8863" class="alarms-desc">

My short descrip 1
<div id="tool_40ba5b52-8a8e-40cf-99e3-fbb9cbea8863" class="tooltip">This is my long    description that extends a long way.............................</div>
</div>
<div id="AD_40ba5b52-8a8e-40cf-99e3-fbb9cbea8864" class="alarms-desc">

 My short descrip 2
 <div id="tool_40ba5b52-8a8e-40cf-99e3-fbb9cbea8864" class="tooltip">This is my long description that extends a long way.............................</div>
 </div>
 <div id="AD_40ba5b52-8a8e-40cf-99e3-fbb9cbea8865" class="alarms-desc">

  My short descrip 3
 <div id="tool_40ba5b52-8a8e-40cf-99e3-fbb9cbea8865" class="tooltip">This is my long description that extends a long way.............................</div>
 </div>

Any suggestions what I need to change?

There's a jQuery plugin called hoverIntent - http://cherne.net/brian/resources/jquery.hoverIntent.html that might help. Rather than firing the mouseenter and mouseleave events immediately, it waits for the mouse cursor to stay still for a bit (you can adjust the sensitivity and timeout), so if you hover on each item quickly, only the last item that's hovered on will show the tooltip.