click con posizione relativo

[iacoposk8]

Ho creato questo script di esempio, cliccando sul quadrato vorrei ricavare la posizione x e y del mouse. Il punto 0,0 deve essere l'angolo in alto a sinistra del quadrato e invece ora lo script mi tiene come punto 0 l'angolo in alto a sinistra della finestra del browser... come risolvo? grazie.

<div id="test" style="width:100px; height:100px; background:#cdcdcd; position:absolute; top:10%; left:50%; margin:0 0 0 -50px;">

<script src='http://code.jquery.com/jquery-latest.js'></script>
<script>
$("#test").click(function(e){
        alert(e.pageX+", "+e.pageY);
});
</script>

[br1]

<div id="test" style="width:100px; height:100px; background:#cdcdcd; position:absolute; top:10%; left:50%; margin:0 0 0 -50px;">

<script src='http://code.jquery.com/jquery-latest.js'></script>
<script>
$("#test").click(function(e){
        alert(e.offsetLeft+", "+e.offsetTop);
});
</script>

[iacoposk8]

mi stampa undefined, undefined

[Xinod]

sottrai l' offset del contenitore da pageX/Y

[iacoposk8]

se avete voglia dateci un occhiata veloce, ma così sembra funzionare

<div id="test" style="width:100px; height:100px; background:#cdcdcd; position:absolute; top:10%; left:50%; margin:0 0 0 -50px;">
    
<script src='http://code.jquery.com/jquery-latest.js'></script>
<script>
    $("#test").click(function(e){
        ofs=$(this).offset();
        alert((e.pageX-ofs.left)+", "+(e.pageY-ofs.top));
    });
</script>