Mostrar división

[gustavo.morales]

Saludos amigos del foro del Web,

Estoy investigando como mostrar una división mediante un enlace, tal como lo hace Amazon al presionar el botón "See all 41 categories", o Yahoo cuando se hace clic en el enlace "More Yahoo Services!".

Estoy seguro que es con un div y ponerla la propiedad display: none y luego cambiársela a visible, pero me ocupa lugar en el html mientras esta oculto, pero tampoco se como moverla.

Gracias

[AlvaroG]

Hola,

Los objetos con display:none no ocupan espacio en la pantalla. Los que sí ocupan el espacio son los que tienen visibility:hidden.
Para mostrarlos no usás display:visible sino display:block (visible es el valor para mostrar un objeto modificando su visibility)

¿a qué te referís con "moverla"? esa parte no la entendí.


Saludos.

[gustavo.morales]

Gracias por tu respuesta, pero me refiero moverlo haci como muestra los dos ejemplos que cite, el de Amazon y el de Yahoo

[AlvaroG]

Pues no sé en detalle cómo se hace, pero sí me imagino que debe ser una combinación de varios atributos de CSS modificados con Javascript:

- float
- position
- width
- overflow
- display

O sea, en el caso de yahoo: se lo posiciona en el lugar donde lo quieras, con float y position. Originalmente le das display : none y ancho 0. También tenés que usar overflow : hidden para evitar que se muestren barras de desplazamiento.
Luego, cuando hay que mostrarlo, le das display:block y comenzás a agregarle ancho (por ejemplo, una función que cada 0,1 segundos agregue 10 px de ancho)

Sé que esto no te sirve de mucho, pero al menos creo que es un comienzo para saber cómo y qué buscar.


Saludos.