aumentar el tamaño de un div poco a poco

[staipi]

Buenos dias amigos, no encuentro la forma de aumentar el tamaño de un div poco a poco, yo se como hacerlo pero de una sola vez y me preguntaba de que manera puedo hacer para que un div al ejecutar una funcion valla aumentando su tamaño y luego pare a sierto tamaño pero no encuentro la forma.

yo imagine que seria algo asi

function agrandartama () {
document.getElementById(mydiv).style.height += 10;

}

setInterval("agrandartama ()", 200);

pero esto haria que mi div creciera cada vez y no pararia alguien q me de una idea la tomare en cuenta, a y escribi este tema aqui porque creo q tiene q ver mas por el lado de javascript y de las funciones

Gracias de antemano espero sus respuestas

[_cronos2]

Podrías usar una variable global que fuera 0, y cada vez que se ejecutara la función la aumentas. Sólo tienes que poner un while() y el setInterval() dentro.
Saludos (:

[staipi]

Iniciado por _cronos2

Podrías usar una variable global que fuera 0, y cada vez que se ejecutara la función la aumentas. Sólo tienes que poner un while() y el setInterval() dentro.
Saludos (:

osea quedaria algo como esto :
var tama;
function agrandartama () {
var tama +=10;
return tama;
}


function agrandartamaactua () {
if (tama<400) {
setInterval("agrandartama ()", 200);
}
}

luego la variable tama la usaria para el tamaño del div, es asi o explicame tu porfavor necesito tu ayuda gracias

[_cronos2]

Sí y no, supongo que de esa manera funcionaría aunque no me refería a eso. Voy a hacer algunas correcciones a tu código y luego te pongo el mío, y usas el que quieras:

Código Javascript:

var tama=0;
//supongo que la inicializaría a 0 si la declaras como 
//variable a secas, pero es más correcto ponerlo así
function agrandartama () {
tama +=10; 
/* si pones var aquí otra vez no funcionará,
 * es un poco difícil de explicar, si quieres
 * busca información sobre scope
 * (creo que se llama así)
 */
//no hace falta devolver la variable
}
 
function agrandartamaactua () {
if (tama<400) {
setInterval("agrandartama ()", 200);
}
}
/*
 *
 */
var veces = 0;
function aumentaDiv(id){
 var div = document.getElementById(id), h = div.style.height;
 div.style.height += 10;
 //div.style.height = parseFloat(h.substr(0,h.length-2))+10+'px';
 /* no estoy seguro de si sirve poner +10 así a pelo,
  * quizás hay que ponerlo con px (me imagino que sí),
  * prueba de las dos maneras.
  */
 return ++veces;
}
while(aumentarDiv('div')<10){
 setInterval("aumentarDiv('div')", 200);
}
 

Código HTML:

<div id='div'>Esto se agranda</div>
 

Saludos (:

[staipi]

Iniciado por _cronos2

Sí y no, supongo que de esa manera funcionaría aunque no me refería a eso. Voy a hacer algunas correcciones a tu código y luego te pongo el mío, y usas el que quieras:

Código Javascript:

var tama=0;
//supongo que la inicializaría a 0 si la declaras como 
//variable a secas, pero es más correcto ponerlo así
function agrandartama () {
tama +=10; 
/* si pones var aquí otra vez no funcionará,
 * es un poco difícil de explicar, si quieres
 * busca información sobre scope
 * (creo que se llama así)
 */
//no hace falta devolver la variable
}
 
function agrandartamaactua () {
if (tama<400) {
setInterval("agrandartama ()", 200);
}
}
/*
 *
 */
var veces = 0;
function aumentaDiv(id){
 var div = document.getElementById(id), h = div.style.height;
 div.style.height += 10;
 //div.style.height = parseFloat(h.substr(0,h.length-2))+10+'px';
 /* no estoy seguro de si sirve poner +10 así a pelo,
  * quizás hay que ponerlo con px (me imagino que sí),
  * prueba de las dos maneras.
  */
 return ++veces;
}
while(aumentarDiv('div')<10){
 setInterval("aumentarDiv('div')", 200);
}
 

Código HTML:

<div id='div'>Esto se agranda</div>
 

Saludos (:

Amigo ninguno de los dos ejemplo me funciona :/

ya he provado si es algo malo pruebo con .style.visibility y si funciona el ejemplo

pero cuando trato de hacerlo con el tamaño no funciona :/ que sucedera que crees tu ?