Detectar posición de una capa
Me parece que esta pregunta será bastante sencilla:
¿Sabes cómo detectar la posición de una capa?
Tengo un scroll montado con las típicas flechitas up y down, pero
me interesa saber una vez movida la capa del scroll, en que posición
está.
¿Sabes cómo detectar la posición de una capa?
Tengo un scroll montado con las típicas flechitas up y down, pero
me interesa saber una vez movida la capa del scroll, en que posición
está.
1 respuesta
Respuesta de bruckner
1
No es tan fácil si quieres una respuesta compatible para todos los navegadores. Para averiguar la posición de una capa (llamémosla capa1), tienes que hacer...
Capa1. OffsetTop (devuelve la distancia del borde superior de la capa al borde superior del documento).
Capa1. OffsetLeft (devuelve la distancia del borde izquierdo de la capa al borde izquierdo del documento).
Pero eso funciona en Explorer. En Netscape 4, existen las propiedades pageX y pageY que hacen la misma función que offsetLeft y offsetTop respectivamente. A continuación te doy una solución para todos los navegadores.
if (document.getElementById) {
var capa1=document.getElementById('capa1');
alert('X:'+capa1.offsetLeft+',Y:'+capa1.offsetTop);
} else if (document.all) {
alert('X:'+document.all.capa1.offsetLeft+',Y:'+document.all.capa1.offsetTop);
} else if (document.layers) {
alert('X:'+document.layers['capa1'].pageX+',Y:'+document.layers['capa1'].pageY);
} else alert('Su navegador no está soportado.');
Espero que con ese código te hagas a la idea de lo que hace falta hacer para soportar a los navegadores más usados (Explorer 5/Netscape 6, Explorer 4 y Netscape 4, en ese orden). Pregúntame de nuevo si te surge cualquier duda.
Capa1. OffsetTop (devuelve la distancia del borde superior de la capa al borde superior del documento).
Capa1. OffsetLeft (devuelve la distancia del borde izquierdo de la capa al borde izquierdo del documento).
Pero eso funciona en Explorer. En Netscape 4, existen las propiedades pageX y pageY que hacen la misma función que offsetLeft y offsetTop respectivamente. A continuación te doy una solución para todos los navegadores.
if (document.getElementById) {
var capa1=document.getElementById('capa1');
alert('X:'+capa1.offsetLeft+',Y:'+capa1.offsetTop);
} else if (document.all) {
alert('X:'+document.all.capa1.offsetLeft+',Y:'+document.all.capa1.offsetTop);
} else if (document.layers) {
alert('X:'+document.layers['capa1'].pageX+',Y:'+document.layers['capa1'].pageY);
} else alert('Su navegador no está soportado.');
Espero que con ese código te hagas a la idea de lo que hace falta hacer para soportar a los navegadores más usados (Explorer 5/Netscape 6, Explorer 4 y Netscape 4, en ese orden). Pregúntame de nuevo si te surge cualquier duda.
