centered hover bubbles with jquery
<p>I'd like to display pop-up bubbles with jquery when user hovers on red boxes. The problem is the code I meshed together just by experimenting... it makes no sense!</p>

<p><a href="http://jsfiddle.net/PKzsS/" rel="nofollow">http://jsfiddle.net/PKzsS/</a></p>

<pre><code>$(window).load(function() {
    $("#headloginuser ul li a").hover(function() {
        divW = $(this).next("div").width()/4;
        $(this).next("div").css({marginLeft: -divW }).animate({ opacity: "show" }, "fast");
    }, function() {
        $(this).next("div").animate({opacity: "hide"}, "fast");
    });
});
</code></pre>

<p>This centers it, more or less, not perfect of course :) but I'm dividng width by 4! shouldn't I just divide it by 2? So I've half the width of the hidden div and I move it exactly that length on to the left?</p>

<p>I'm confused :)</p>

<p>S.</p>
