javascript - JQuery.animate();不适用于固定高度

Question

我已经处理过很多次了，没有遇到任何问题。通过 width/height: 'toggle' 或将 'toggle' 替换为指定的宽度/高度，为 DIV 的高度和/或宽度设置动画。

setTimeout( function(){
    $('.input-group .Advanced').animate({
       height: 'toggle'
    }, {
        duration: 500,
    });
} , 500);

高度:'toggle' - Demo on JSFiddle
高度:'400px' - Demo on JSFiddle

代码片段工作得很好，但我需要将其设置为特定高度并将我的 'toggle' 替换为固定高度，例如 '400px'绝对没有...

Answer 1

$('.form-control' ).click(function(e) {

    $(this).addClass('InputFreezeFocus');

    $(this).animate({
       width: '400px'
    }, {
        direction: 'left',
        duration: 500,
    });
    setTimeout( function(){
        $('.input-group .Advanced').animate({
           height: '400px',
           opacity: 'toggle'
        }, {
            duration: 500,
        });
    } , 500);
});

.animate() 方法不会使隐藏元素作为效果的一部分可见，因此您必须切换不透明度。

Link to fiddle