Foros del Web » Programando para Internet » Javascript »

Desplegar div en horizontal

Estas en el tema de Desplegar div en horizontal en el foro de Javascript en Foros del Web. Hola chic@s! Como puedo hacer con js el mismo efecto que muestra el link pero en vez de desplegarse hacia abajo que lo haga hacia ...
  #1 (permalink)  
Antiguo 17/09/2011, 12:08
 
Fecha de Ingreso: junio-2011
Mensajes: 478
Antigüedad: 13 años, 1 mes
Puntos: 13
Desplegar div en horizontal

Hola chic@s!
Como puedo hacer con js el mismo efecto que muestra el link pero en vez de desplegarse hacia abajo que lo haga hacia el costado, es decir horizontalmente hacia la derecha?


http://www.diariothc.com/wp-content/...ble/index.html

O que me recomiendan sencillo para desplegar al hacer clic sobre un link se despliegue o aparezca (no se bien cual es la palabra correcta para ese efecto) un div.

Muchas gracias! :)

Última edición por rapuig; 17/09/2011 a las 12:22
  #2 (permalink)  
Antiguo 17/09/2011, 14:10
 
Fecha de Ingreso: junio-2011
Mensajes: 478
Antigüedad: 13 años, 1 mes
Puntos: 13
Respuesta: Desplegar div en horizontal

Gente, estaba probando y me surgio otra duda... :/
En realidad lo que yo quiero es al igual que en el ejemplo se despliega un div con contenido pero es posible que dentro de ese mismo div se vuelva a desplazar otro contenido?
Me explico mejor por las dudas, lo que yo quiero es: tengo img en miniaturas y que cuando hagas clic en cada una de ellas se desplieguen de la forma del ejemplo (o si es despliegue en forma horizontal mejor) dentro del mismo div.

Lo que intente pero no funciona es lo siguiente:

<a href="javascript:collapse1.slidedown()"><img src="miniatura1.jpg" /></a>
<a href="javascript:collapse2.slidedown()"><img src="miniatura2.jpg" /></a>

<div id="galeria">
<img src="img1.jpg" />
<img src="img1.jpg" />
</div>

<script type="text/javascript">
var collapse1=new animatedcollapse("galeria", 800, false)
var collapse2=new animatedcollapse("galeria", 800, false)
</script>

Obviamente esta mal eso, pero no se me ocurre muy bien como arreglarlo. O si se puede hacer algo asi.

Gracias!


</div>

<script type="text/javascript">
var collapse1=new animatedcollapse("galeria1", 800, false)

</script>
  #3 (permalink)  
Antiguo 17/09/2011, 18:49
Avatar de KoswiDigital  
Fecha de Ingreso: abril-2011
Ubicación: Galicia - España
Mensajes: 220
Antigüedad: 13 años, 3 meses
Puntos: 37
Respuesta: Desplegar div en horizontal

Hola.

Esos efectos los logras con relativa facilidad utilizando jQuery (http://jquery.com). Hay mucha información acerca de esto en estos foros.


Un saludo.
__________________
http://www.koswidigital.com - Diseño web, Programación web, Fotografía profesional, Retoque digital.
  #4 (permalink)  
Antiguo 17/09/2011, 20:05
 
Fecha de Ingreso: junio-2011
Mensajes: 478
Antigüedad: 13 años, 1 mes
Puntos: 13
Respuesta: Desplegar div en horizontal

Gracias, por responder.
Conozco jquery pero no se muy bien como buscar este efecto :S

Saludos
  #5 (permalink)  
Antiguo 18/09/2011, 04:07
 
Fecha de Ingreso: febrero-2009
Mensajes: 580
Antigüedad: 15 años, 5 meses
Puntos: 13
Respuesta: Desplegar div en horizontal

pues podrías usar la función animate

Darle un ancho inicial al <div="galeria"> (por ejemplo) de 0px;
Cita:
$('#galeria').animate({ width: '500px' }, 1000}); //para mostrar
$('#galeria').animate({ width: '0px' }, 1000}); //para ocultar
No lo he usado nunca, pero debería funcionar: tal vez tengas que combinarlo con display:none/block.

Prueba a ver y dinos cosas,

Salud
__________________
¿ya conoces la red social de cocina? descubre y comparte recetas de cocina
TONIWEB, un programador web freelance
  #6 (permalink)  
Antiguo 18/09/2011, 08:42
Avatar de KoswiDigital  
Fecha de Ingreso: abril-2011
Ubicación: Galicia - España
Mensajes: 220
Antigüedad: 13 años, 3 meses
Puntos: 37
Respuesta: Desplegar div en horizontal

Efectivamente, con la función animate() puedes lograrlo. Infórmate acerca de ella en la documentación de la web de jquery.

Un saludo.
__________________
http://www.koswidigital.com - Diseño web, Programación web, Fotografía profesional, Retoque digital.
  #7 (permalink)  
Antiguo 18/09/2011, 10:48
 
Fecha de Ingreso: junio-2011
Mensajes: 478
Antigüedad: 13 años, 1 mes
Puntos: 13
Respuesta: Desplegar div en horizontal

Gracias chicos! Luego les cuento como me fue :)

Etiquetas: desplegar, horizontal, html, js
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta

SíEste tema le ha gustado a 1 personas




La zona horaria es GMT -6. Ahora son las 13:05.