Lo que tengo de inicio es un formulario, en el cual, entre otras cosas, tengo un elemento <select> y dos <tr> en la tabla con un id propio cada uno, del tipo
<tr style="display:none;" id="muestraAutor">.
Con el método onChange del select mando a llamar a una función con la cual dependiendo de la opción elegida quiero cambiar la propiedad display del <tr> a "block".
El problema es que en Firefox al hacer el cambio, me muestra los elementos, pero al elegir otro elemento y esconder los <tr> queda el hueco, mismo que se vá acumulando al elegir nuevamente la opción que debe mostrarlos, pues aparecen nuevamente, pero el hueco que dejaron sigue manteniendose y se incrementa con cada oportunidad en que decido esconderlos.
Además de esto, las línea salen completamente desubicadas de la posición original.
En Opera no sucede el efecto del hueco pero igualmente salen las líneas completamente desconfiguradas.
Solo en IExplorer hace el efecto tal y cual lo deseo ya que solamente aparecen y desaparecen y su ubicación conserva la posición original.
busca.htm
Código HTML:
<script type="text/javascript" language="javascript"> function muestraLineas() { seccion = document.getElementById('seccion').value; autor = document.getElementById('muestraAutor'); editorial = document.getElementById('muestraEditorial'); if(seccion == 3) { autor.style.display = "block"; editorial.style.display = "block"; }else{ autor.style.display = "none"; editorial.style.display = "none"; } } </script> ... <select name="seccion" id="seccion" onChange="muestraLineas();"> <option>....</option> </select> <tr id="muestraAutor" style="display:none;"> <td> elementos del formulario...</td> </tr> <tr id="muestraEditorial" style="display:none;"> <td> elementos del formulario...</td> </tr>
Saludos!
