[Problema]
Comenzando con un script de ésta web (
Agrandar Tabla en Tiempo Real)
decidí crear una barra al estilo activex en donde puedo mandarle mensajes predeterminados por medio de la funcion agrandar, a continuación les dejo el primer código, con el cual tenía el problema
Código:
function achicar(minimo,id){
contenido = document.getElementById(id);
contenido.innerHTML = '';
altura = contenido.style.height;
altura = parseFloat(altura);
if(altura > minimo){
altura--;
contenido.style.height = altura;
}
if(altura > minimo){
Rminimo = minimo;
setTimeout("achicar(Rminimo)",1);
}
}
function agrandar(maximo,minimo,ID,msj){
ID2=ID;
msjX=msj;
contenido = document.getElementById(ID);
altura = document.getElementById(ID).style.height;
altura = parseFloat(altura);
if(altura < maximo){
altura++;
document.getElementById(ID).style.height = altura;
AgregarTexto = altura+1;
if(AgregarTexto == maximo){
contenido.innerHTML = msj;
}
}
if(altura < maximo){
Rmaximo = maximo;
Rminimo = minimo;
setTimeout("agrandar(Rmaximo,Rminimo,ID2,msjX)",1);
}
}
<div id="barra" style="background:#CC0000; color:#FFFFFF; height:0px; width:100%;"></div>
El problema fué que en explorer dentro del div hay un espacio lo cual no se consigue el efecto al achicar la "barra" ni al agrandar ya que son alrededor de 20 px los que en mi caso agrando...
una de las primeras soluciones que encontré fué agregar ésto al div
Código:
<div id="barra" style="background:#CC0000; color:#FFFFFF; height:0px; width:100%;"><!-- --></div>
hasta ahí todo bien, paracía una solución buena ya que ahora al ejecutar el script no aparecía espacio alguno en el div, al agrandar el div aparece el mensaje y luego al achicarlo apareció nuevamente el espacio
[Solución]
La solucion la consiguió
Mikel quedando finalmente de ésta forma el código
Código:
function achicar(minimo,id){
contenido = document.getElementById(id);
contenido.innerHTML = '';
altura = contenido.style.height;
altura = parseFloat(altura);
if(altura > minimo){
altura--;
contenido.style.height = altura;
QuitarTexto = altura-1;
if(QuitarTexto == minimo){
contenido.style.display = "none";
}
}
if(altura > minimo){
Rminimo = minimo;
setTimeout("achicar(Rminimo)",1);
}
}
function agrandar(maximo,minimo,ID,msj){
ID2=ID;
msjX=msj;
contenido = document.getElementById(ID);
altura = document.getElementById(ID).style.height;
altura = parseFloat(altura);
if(altura < maximo){
altura++;
contenido.style.display = "block";
document.getElementById(ID).style.height = altura;
AgregarTexto = altura+1;
if(AgregarTexto == maximo){
contenido.innerHTML = msj;
}
}
if(altura < maximo){
Rmaximo = maximo;
Rminimo = minimo;
setTimeout("agrandar(Rmaximo,Rminimo,ID2,msjX)",1);
}
}
y el div así
Código:
<div id="barra" style="background:#CC0000; color:#FFFFFF; height:0px; width:100%; overflow: hidden;"><!-- --></div>