Posicionar una capa dependiendo de otro objeto

[salvador86]

Hola, me gustaria poder obtener este resultado en mis paginas


Tengo un formulario que esta dentro de un cuadro rojo en la imagen, y oculto una capa (cuadro verde en la imagen) que al hacer clic en el boton azul se cambie la propiedad visible de la capa de hidden a visible, y se monte exactamente al formulario ocultandole, mas exactamente me gustaría que la parte inferior de la capa oculta coincida con el del boton del formulario.

Intente colocar la posición de esta capa manualmente, pero por la información que contienen las paginas varian en tonces la posición también. Aqui un ejemplo real http://www.peru-expeditions.com/c-es...o-yana9-3.html (El formulario esta en medio).

Intente con un js mide el tamaño de la pagina y la descuenta desde el inferior con el valor bottom de la capa, pero igual tendria que medir la posición del formulario así que no resulta, tambien probe con un codigo que originalmente al pasar el mouse por un boton mostraba una capa pero lo que hace es desplazar la ventana segun el puntero. Espero su ayuda, muchas gracias.

Aqui tengo un codigo que he encontrado y estoy analizando pero no lo comprendo mucho esta en este link
http://www.gurx.net/index.php?sec=do...cio&element=32 por favor les pido una ayuda.

<script language="JavaScript" type="text/javascript">
function findPos(obj) {
var curleft = curtop = 0;
if (obj.offsetParent) {
curleft = obj.offsetLeft
curtop = obj.offsetTop
while (obj = obj.offsetParent) {
curleft += obj.offsetLeft
curtop += obj.offsetTop
}
}
return [curleft,curtop];
}
var coors = findPos(document.getElementById('imagen_calendario '));
var div_fl = document.createElement('DIV');
div_fl.style.position = 'absolute';
div_fl.id = 'calendario';
div_fl.className = 'div_fl';
div_fl.innerHTML = 'Prueba Calendario';
div_fl.style.left = coors[0] +'px';
div_fl.style.top = coors[1] +'px';
document.body.appendChild(div_fl);
</script>

[salvador86]

Malos nadie me contesto, jajaja pero aqui esta la solución

<script language="JavaScript" type="text/javascript">
function posicion(element) {
if (typeof element == "string")
element = document.getElementById(element)

if (!element) return { top:0,left:0 };

var y = 0;
var x = 0;
while (element.offsetParent) {
x += element.offsetLeft;
y += element.offsetTop;
element = element.offsetParent;
}
return {top:y,left:x};
}
function verposicion() {
var elemento = document.getElementById('miboton');
var pos = posicion(elemento)
document.getElementById('win').style.visibility="v isible";
document.getElementById('win').style.top=pos.top;//aqui es donde le digo su posición
document.getElementById('win').style.left=pos.left ;
alert("top="+pos.top+" left="+pos.left);
}
</script>

Y despues se le llama en el objeto html como un identificador miboton y el js

[Larenz]

Es que nadie contestó porque queríamos ver si podrías lograrlo por ti mismo... Un poco de esfuerzo valió la pena... jejejejeje!!!

[salvador86]

buuuuuuu!!

[Larenz]

jajajajaja!!!