elhacker.net cabecera Bienvenido(a), Visitante. Por favor Ingresar o Registrarse
¿Perdiste tu email de activación?.

 

 


Tema destacado: Usando Git para manipular el directorio de trabajo, el índice y commits (segunda parte)


+  Foro de elhacker.net
|-+  Programación
| |-+  Desarrollo Web (Moderador: #!drvy)
| | |-+  [javascript] Redimensionar con un for un div (solucionado con JQuery)
0 Usuarios y 1 Visitante están viendo este tema.
Páginas: [1] Ir Abajo Respuesta Imprimir
Autor Tema: [javascript] Redimensionar con un for un div (solucionado con JQuery)  (Leído 4,572 veces)
moikano→@


Desconectado Desconectado

Mensajes: 572


Cultiva tu mente y cuerpo, son tu única propiedad


Ver Perfil WWW
[javascript] Redimensionar con un for un div (solucionado con JQuery)
« en: 14 Julio 2012, 23:00 pm »

Hola.

Estoy intentando redimensionar  una etiqueta "div" al cargar la página, el div debería ir de 0px a 500px en 5 segundos mas o menos.
Lo he intentado con la función "setTimeout" junto con un for y con las propiedades del div. El código es este.

Código:
function redim(){
for (i=0; i<=500; i++){
setTimeout("document.getElementById('cont').style.height=i+'px'",1000);
}
}

Es una prueba, si funcionara sería de 0px a 500px en 500 segundos. Pero me carga el div enseguida, no en 500 segundos, pasa de 0px a 500px en menos de un segundo.
Lo he probado en múltiples combinaciones anidando funciones con otras pero no he conseguido que lo haga.

Que hago mal?


« Última modificación: 15 Julio 2012, 21:41 pm por moikano→@ » En línea

Anvil

Desconectado Desconectado

Mensajes: 38



Ver Perfil
Re: [javascript] Redimensionar con un for un div
« Respuesta #1 en: 15 Julio 2012, 05:31 am »

Me imagino que en pseudocódigo podría quedar algo asi.

Código
  1. function redim(i)
  2. {
  3. // sacamos el tamaño actual
  4. var pixels = document.getElementById('div_id').style.height;
  5. // vemos si ya estamos en el tamaño que queremos
  6. if(pixels < 500)
  7. {
  8. // si no esta hacemos la redimensión
  9. document.getElementById('div_id').style.height = i + "px";
  10. // y volvemos a llamar la función
  11. setTimeout("redim("+i*10+")",1000);
  12. }
  13. }
  14.  
  15. // función que se ejecuta en onload
  16. function onLoad()
  17. {
  18. redim(1);
  19. }
  20.  


En línea

\\::_--__!!ss"1122
moikano→@


Desconectado Desconectado

Mensajes: 572


Cultiva tu mente y cuerpo, son tu única propiedad


Ver Perfil WWW
Re: [javascript] Redimensionar con un for un div
« Respuesta #2 en: 15 Julio 2012, 12:16 pm »

Citar
function redim(i)
{
   // sacamos el tamaño actual
   var pixels = document.getElementById('div_id').style.height;
   // vemos si ya estamos en el tamaño que queremos
   if(pixels < 500)
   {
      // si no esta hacemos la redimensión
      document.getElementById('div_id').style.height = i + "px";
      // y volvemos a llamar la función
      setTimeout("redim("+i*10+")",1000);
   }
}

Probado, y no funciona, se queda con 1px de tamaño sin cambiar. No se si es un error de sintaxis o de planteamiento. Solo he cambiado cosas en la sintaxis para ver si funcionaba.
« Última modificación: 15 Julio 2012, 12:19 pm por moikano→@ » En línea

Spider-Net


Desconectado Desconectado

Mensajes: 1.165


Un gran poder conlleva una gran responsabilidad


Ver Perfil WWW
Re: [javascript] Redimensionar con un for un div
« Respuesta #3 en: 15 Julio 2012, 21:25 pm »

Y no sería más fácil hacerlo en jquery?, vamos digo yo...

Código
  1. $('#div_id').animate( { height: "500px" }, { queue: false, duration: 5000 })
En línea

moikano→@


Desconectado Desconectado

Mensajes: 572


Cultiva tu mente y cuerpo, son tu única propiedad


Ver Perfil WWW
Re: [javascript] Redimensionar con un for un div
« Respuesta #4 en: 15 Julio 2012, 21:40 pm »

Citar
Y no sería más fácil hacerlo en jquery?, vamos digo yo...

Código

$('#div_id').animate( { height: "500px" }, { queue: false, duration: 5000 })

Si, mucho mas fácil y totalmente valido.
Muchas gracias, lo marco como solucionado.
En línea

Páginas: [1] Ir Arriba Respuesta Imprimir 

Ir a:  

Mensajes similares
Asunto Iniciado por Respuestas Vistas Último mensaje
Como hacer para redimensionar imagenes con javascript
Desarrollo Web
astinx 1 4,007 Último mensaje 7 Mayo 2012, 19:07 pm
por el-brujo
javascript feat. Jquery problem??
Desarrollo Web
TrashAmbishion 5 3,377 Último mensaje 21 Julio 2012, 15:36 pm
por Spider-Net
Jquery o javascript?
Desarrollo Web
ccrunch 7 3,763 Último mensaje 28 Octubre 2013, 22:45 pm
por ccrunch
poner codigos php, jquery,javascript etc en un textarea
PHP
herminio59 3 2,142 Último mensaje 7 Abril 2014, 04:45 am
por engel lex
MOVIDO: poner codigos php, jquery,javascript etc en un textarea
Scripting
Eleкtro 0 1,691 Último mensaje 7 Abril 2014, 09:58 am
por Eleкtro
WAP2 - Aviso Legal - Powered by SMF 1.1.21 | SMF © 2006-2008, Simple Machines