Autocomplemete position absolute

[patilanz]

Hola, como posisionan los creadores de plugins como los de autocompletar los divs debajo del input. Osea como lo ponen exactamente debajo del input?

Como aqui: http://www.devbridge.com/projects/autocomplete/jquery/

[quimfv]

Como puedes ver facilmente cada linea del formulario de esa demo es un div con su clase

<div class="form-row">

Si observas donde aparece el auto complete veras que tambien es un juego de div con sus clases

<div id="AutocompleteContainter_d95cd" style="position: absolute; z-index: 9999; top: 412px; left: 650px;">
<div class="autocomplete-w1">
<div id="Autocomplete_d95cd" class="autocomplete" style="width: 514px; max-height: 300px;">

(Usa firebug para verlo)

Luego simplemente usa css para que esas divs se alineen como quieras.

Es decir AJAX en este caso no hace nada mas que cargar una nueva div en el documento, esta div se regirá por el mismo archivo de estilos que el documento original, luego puedes definir en ese documento de estilos como debe comportarse la div que cargará ajax.

Soy consciente que no te estoy dando la solución solo te digo como lo enfocaría yo.

[patilanz]

Iniciado por quimfv

Como puedes ver facilmente cada linea del formulario de esa demo es un div con su clase

<div class="form-row">

Si observas donde aparece el auto complete veras que tambien es un juego de div con sus clases

<div id="AutocompleteContainter_d95cd" style="position: absolute; z-index: 9999; top: 412px; left: 650px;">
<div class="autocomplete-w1">
<div id="Autocomplete_d95cd" class="autocomplete" style="width: 514px; max-height: 300px;">

(Usa firebug para verlo)

Luego simplemente usa css para que esas divs se alineen como quieras.

Es decir AJAX en este caso no hace nada mas que cargar una nueva div en el documento, esta div se regirá por el mismo archivo de estilos que el documento original, luego puedes definir en ese documento de estilos como debe comportarse la div que cargará ajax.

Soy consciente que no te estoy dando la solución solo te digo como lo enfocaría yo.

Hola gracias, pero no te entendi muy bien. Lo vi con chrome (los divs con las clases) pero como puedes saber la posision absoluta de

Código ASP:

top: 412px; left: 650px;
 

En la div AutocompleteContainter_d95cd ??

Esto es lo que no se como lo hacen.

Se puede usar para el formulario y para el div con las sugerencias position absolute pero no creo que es la mejor forma de hacear lo .

Gracias de todas formas

[quimfv]

Yo creo que lo que tienes que hacer es crear el css y el html estatico, ajustas la div que contendrá el auto complete a la div del input. Una vez tienes definido el css ene estatico, lo usas en dinámico. ¿?

[Reedyseth]

Hay metodos en javascript y mas precisamente en jQuery donde puedes obtener el left, top, o margen, en si los atributos reales css del objeto y basados en esos posicionas tu elemento.

Hay un metodo que se llama css(), con ese obtienes tales propiedades.

[caricatos]

Hola:

Aparte del posicionaamiento absoluto, la ubicación se obtiene con offsetLeft para la coordenada x y offsetTop para la y... luego deberías sumar la altura... supongo que offsetHeight.

Saludos