jQuery中想要用animate方法将元素的height属性从其它值过渡到auto值,首先想到的就是
JavaScript代码
复制- $(this).animate({height:'auto'}, 300);
但是并不起作用。
这时需要换一种方法,思路是:
1、首先定义变量将当前的高度值保存下来。
JavaScript代码
复制- var curHeight = $(this).height();
2、将元素高度临时改变为auto。
JavaScript代码
复制- $(this).css('height', 'auto');
3、获取height为auto时的高度值。
JavaScript代码
复制- var autoHeight = $(this).height();
4、执行动画,将curHeight 过渡到 autoHeight。
JavaScript代码
复制- $(this).height(curHeight).animate({height: autoHeight}, 300);
连起来就是:
JavaScript代码
复制- var el = $(this),
- curHeight = el.height(),
- autoHeight = el.css('height', 'auto').height();
- el.height(curHeight).animate({height: autoHeight}, 300);
这样就实现了高度从其它值过渡到auto的效果。