jQuery event "looping"
<p>I´m trying to code a tooltip (Yes I know, I have my reasons to avoid plugins in this case) in jQuery.</p>

<p>Whe I show the tooltip and leave the mouse in the same place the show and hide repeats forever. It´s like the element triggers the hover event again and again and again.</p>

<p>I try unbind for the event but it does not work neither.</p>

<pre><code>$("td.with-tooltip").mouseover( function() {

 var offset = $(this).offset();
 var baseX = offset.left;
 var baseY = offset.top;
 var inputWidth = $(this).width();
 var baseX = baseX + 50;
 var baseY = baseY - $(".desc").height();

 $(".desc div").html($(this).attr("title"));
 $(".desc").css({"position":"absolute", "left": baseX, "top": baseY }).fadeIn();

 $(this).unbind("mouseover");

}).mouseleave( function() {

 $(".desc").fadeOut();

});
</code></pre>

<p>What can I do?</p>

<p>thanks.</p>

<p>I solved with this code, thanks for everybody, really.</p>

<p><code><pre>
    var t;
    var xOffset;
    var yOffset;</p>

<pre><code>$("td.with-tooltip").hover(function(e){ 

    t = $(this).attr("title");
    $(this).attr("title", "");

    $(".desc div").text(t);

    xOffset = $(".desc").height() + 30;
    yOffset = -20;

    $(".desc").css("position","absolute")
                .css("botton",(e.pageY + xOffset) + "px")
                .css("left",(e.pageX + yOffset) + "px").fadeIn("fast");
},
function(){
    $(this).attr("title", t);
    $(".desc").fadeOut("fast");
}); 
$("td.with-tooltip").mousemove(function(e){
    $(".desc")
        .css("top",(e.pageY - xOffset) + "px")
        .css("left",(e.pageX + yOffset) + "px");
});         
</code></pre>

<p></pre></code></p>
