jQuery,Animate从变量值到div的自动高度

时间:2012-06-12 19:59:21

标签: jquery html jquery-animate toggle

我想使用切换动画将div的高度从变量值设置为auto。我知道我没有正确地调用我的变量。试着看看如何做到这一点。

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

1 个答案:

答案 0 :(得分:0)

如果在“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);
    }
);​