使用jQuery将元素动画化为自动高度

一尘不染

使用jQuery将元素动画化为自动高度

javascript

我想动画一个<div>从200px到auto的高度。我似乎无法使其工作。有人知道吗？

这是代码：

$("div:first").click(function(){
  $("#first").animate({
    height: "auto"
  }, 1000 );
});

阅读 564

2020-05-05

共1个答案

一尘不染

保存当前高度：

var curHeight = $('#first').height();

暂时将高度切换为自动：

$('#first').css('height', 'auto');

获取自动高度：

var autoHeight = $('#first').height();

切换回curHeight并设置动画autoHeight：

$('#first').height(curHeight).animate({height: autoHeight}, 1000);

并在一起：

var el = $('#first'),
    curHeight = el.height(),
    autoHeight = el.css('height', 'auto').height();
el.height(curHeight).animate({height: autoHeight}, 1000);

2020-05-05