tooltip position near the mouse click
<p>My scenario is described and partially solved here <a href="http://stackoverflow.com/questions/13421563/simple-tooltips-created-using-jquery-1-3-2">simple tooltips created using jquery 1.3.2</a>
I want to show simple tooltip after click on a html element. However, on my page the html code for tooltip (.tooltip) is on different place of my page (bottom).
Now I need it to show right under the clicked html element.
So far the code looks like this:</p>

<pre><code>$(document).ready(function(){

$('.somefield').click(showBox).mouseleave(hideBox);

function showBox(e){
    var x = e.pageX + 20;
    var y = e.pageY + 20;
    $('.tooltip').fadeIn();
    $('.tooltip').offset({ left: x, top: y });
}

function hideBox(){
    $('.tooltip').fadeOut();
}
});
</code></pre>

<p>And it works on my page like this <a href="http://jsfiddle.net/HUG2Z/15/" rel="nofollow">http://jsfiddle.net/HUG2Z/15/</a>
How can I achieve to show it right under mouse click in jquery 1.3.2? Thank you very much. </p>
