Ver Mensaje Individual
  #11 (permalink)  
Antiguo 03/06/2005, 15:29
Avatar de Holden
Holden
 
Fecha de Ingreso: enero-2002
Ubicación: Buenos Aires
Mensajes: 326
Antigüedad: 22 años, 10 meses
Puntos: 4
Acà hice una funcion que calcula las distancias con respecto al eje 0,0

Código HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
<style>
#myLayer{width:297px; height:111px; z-index:1; background-color: #FF0000; layer-background-color: #FF0000; border: 1px none #000000;}

#cont{position:relative; left:135px; top:24px; }
	
body {
	margin-left: 0px;
	margin-top: 0px;
}
</style>
<script language="JavaScript" type="text/JavaScript">
<!--
function Coordenadas(obj)
{
    objOriginal = obj;
    var Yo = 0;
    var Xo = 0;
    while(obj.nodeName != "BODY")
    {
        Yo += parseInt(obj.offsetTop);
        Xo += parseInt(obj.offsetLeft);
       
        obj = obj.parentNode;
        
   }
   
	var X1 = parseInt(Xo) + parseInt(objOriginal.offsetWidth);
	var Y1 = parseInt(Yo) + parseInt(objOriginal.offsetHeight);

	alert("Xo= "+Xo+"\n X1="+X1+"\n Yo= "+Yo+"\n Y1= "+Y1);

}


//-->
</script>

</head>

<body>

<div id="cont" >

<div id="myLayer" onClick="Coordenadas(this)"></div>

</div>
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <table cellpadding="0" cellspacing="0">
        <tr>
            <td style="width: 100px">
            </td>
            <td style="width: 100px">
            </td>
            <td style="width: 100px">
                <div align="center"><img src="http://img.clarin.com/suplementos/informatica/2005/06/01/homesimple.jpg" onClick="Coordenadas(this)" /></div></td>
        </tr>
        <tr>
            <td style="width: 100px">
            </td>
            <td style="width: 100px">
            </td>
            <td style="width: 100px">
            </td>
        </tr>
        <tr>
            <td style="width: 100px">
            </td>
            <td style="width: 100px">
            </td>
            <td style="width: 100px">
            </td>
        </tr>
    </table>
    <br />
    <br />

</body>
</html> 
Hay algunos factores que influyen y mucho...

1- si el layer tiene valor absoluto hay que tocar la funciòn para que calcule de otra manera. Para cualquier otro objeto (ej images) funciona bien porque usa referencias relativas.

2- El punto es que si no se setea el:
body {
margin-left: 0px;
margin-top: 0px;
}

se pierde precisiòn.

habria que buscar la vuelta para corregir esas desviaciones. voy a seguir mirandolo en mi casa sobre todo tema compatibilidad de browsers.
Saludos
__________________
Holden-@r
http://www.hvaldez.com.ar

Última edición por Holden; 04/06/2005 a las 14:46