simply tooltip div - top position and hide

I would like help with http://jsfiddle.net/VmXU9/34/ .

$(".click").click(function() {
    var s = $(this).offset();
    left = s.left + $(this).width();
    $("#THREE").css({
        'opacity': 0.80
    });


    $("#THREE").css(s);
    $("#THREE").css({
        left: left
    });

});

I would like to modify the top and left positions of the yellow <div> to, for example, left: 10px, top: -20px. I would also like it to hide if I click outside it. How 开发者_StackOverflow社区can I approach this?

You could use something like:

$(function() {
   $(document).click(function(e)    {
        var $div = $("#yourDiv");

        // if the click was outside the div, hide it
        if(e.target != $div.get(0)) {
            $div.hide();
        }
   });
});