jquery - slideToggle no suave

Question

Tengo un problema con la función slideToggle en jQuery. No es suave en absoluto. Cada vez que hago clic en el botón "Ver más", el contenido que debería slideToggle, simplemente aparece sin efecto alguno.

Este es el código HTML:

<td class="third"> 
    <a href="javascript:void(0)" class="btn btn-primary upgrade1">See More</a> 
</td>       

<tr class="see_more" id="see_more"> 
     <td colspan="3" class="see_more_content">Hello! How are you doing</td> 
</tr> 

Este es el CSS:

.third{ 
    text-align:right; 
    padding-right:10px; 
} 
.see_more{ 
    display:none; 

} 
.see_more_content{ 
    text-align:center; 
} 

Y, por último, la javascript:

<script type="text/javascript"> 
      $(document).ready(function(){ 
       $(".upgrade1").click(function() { 
        $("#see_more").slideToggle("slow"); 
        }); 
       }); 
    </script> 

He leído el artículo "La animación Jump - consejo rápido ", pero no creo que ese sea el problema aquí. Dado que no he especificado ningún margin o padding al contenido que debería slideToggle.

Gracias de antemano por su ayuda.

Answer 1

Las filas de tabla no parecen deslizarse. Debería intentar encontrar una solución mediante el uso de DIV en su lugar. Se deslizan y animan mucho mejor. ¿También podría envolver el contenido en un div y deslizar eso? Tal vez eso empujaría la fila de la mesa para imitar una diapositiva.

Answer 2

Está ejecutando slideToggle en una fila de la tabla. Las filas de la tabla no funcionan bien con algunos CSS. Esto significa que, en algunos casos, no se deslizará, sino que aparecerá cuando esté finalmente visible.