Estoy tratando de usar jQuerys slideToggle en un div que tiene una altura mínima. esto hace que la animation salte y no se mueva suavemente. Pasé un time buscando una solución, pero no puedo hacer nada para que funcione. He hecho un ejemplo en jsfiddle y agradecería si alguien pudiera ayudarme a resolver este problema.
mi CSS para el div que se alterna:
#selected-display{ height:calc(100vh - 50px); display:none; min-height: 750px; }
mi javascript:
$(document).ready(function(){ $(".toggle-display").click(function(){ $("#selected-display").slideToggle("slow"); }); });
https://jsfiddle.net/4y3q27mh/
https://jsfiddle.net/rqkt58L1/
Puede desactivar la altura mínima durante la animation y luego volver a encenderla cuando finalice la animation:
$(document).ready(function () { $(".toggle-display").click(function () { var minHeight = $("#selected-display").css('min-height'); $("#selected-display").css('min-height',0).slideToggle("slow", function() { $(this).css('min-height', minHeight); }); }); });