jQuery，动画高度从一个变量值到自动div div

Question

我想动画从一个变量值的div的高度动画与自动切换动画。我知道我没有正确地调用我的变量。试图看看如何做到这一点。

var scheight = $('.searchcontainer').height(); 
$('.searchcontainer').toggle(
    function() { 
     $(".searchcontainer").animate({ height: scheight + "px" }, 500); 
    }, 
    function() { 
     $(".searchcontainer").animate({ height: auto}, 500); 
    } 
); 

Answer 1

如果您将另一个容器放置在“searchcontainer”元素中，则更容易为两种方式设置动画效果。这种方法可以让你发现你的内容的高度，并具有像素值（而不是依赖于“自动”），给你一个目标，你现在可以动画到：

http://jsfiddle.net/XdPry/3/

HTML：

<div style="height:200px;border:1px solid #000000"> 
    <div class="searchcontainer" style="background-color:#aa22aa"> 
     <div>content</div> 
    </div> 
</div>​ 

的jQuery：

$('.searchcontainer:first').toggle(
    function() { 
     $(this).animate({ height: parseInt($(this).parent('div').height()) }, 500); 
    }, 
    function() { 
     $(this).animate({ height: parseInt($(this).children('div:first').height()) }, 500); 
    } 
);​