动画完成时jQuery高度动画跳转

参见英文答案 > jQuery animate()                                    4个
我有一组按钮,当单击时,页面上的指令淡出,所需内容淡入.div也使用jQuery .animate()函数进行扩展.当div完成扩展时,高度跳跃得更短.我做了一个jsfiddle,但它在那里工作正常.所以,它必须与我的其他内容有关.

Here’s the site

http://northviewhigh.com/index/fbla/1213/eb/styles.css – CSS文件

[同上,不能发布更多链接] /eb/jquery/scripts.js jQuery文件

这是代码：

<div id="tixcontainer">

    <div class="tixinfo startinfo">
        Select a ticket type to begin ordering your graduation tickets. 
    </div>

    <div class="tixinfo hidden gradinfo">
        You selected "Graduate"
    </div>
</div>

#tixcontainer {
    width:100%;
    height:100px;
}

.tixinfo {
    position:absolute;
    top:629px;
}

.startinfo {
    height:100px;
}

.gradinfo {
    height:200px;
}

function expandtix(newHeight,cat) {
    $('.startinfo').fadeOut();
    $('#tixcontainer').animate({
        height: newHeight
    },'slow',function() {
        $('.'+cat+'info').fadeIn();
    });
}

$('.gradbutton').click(function() {
    dimAllBut('grad');
    expandtix(200,'grad');
});

解决方法

这看起来像是同一个问题：

jQuery animate()

并在示例页面上的#tixcontainer中添加overflow：hidden会停止跳转.