根据css属性设置效果持续时间

Question

$('.container').animate({ 'height': el.height()  }, { duration: 300});

所以el的身高可以小于或大于.container的身高。

如果当前高度与我动画的高度之间的差异较大，我怎样才能使效果持续时间更长？

Answer 1

var newHeight = el.height(),
    oldHeight = $('.container').height();
$('.container').animate({height: newHeight}, Math.abs(newHeight-oldHeight)*5);

将魔法常量5更改为任何看似合理的东西。您没有提供计算持续时间的标准;你可能用Math.min(/*above expression*/, maxDuration)绑定它，或者它可能不是线性的而是对数的。您可以非常轻松地自定义它。虽然这是一个很好的起点。

Answer 2

if ($(.container).height() - $(el).height() > 0)
{
    // Whatever you want to do if the container is higher than el
}
else
{
    // Other case
}

不确定它是否是正确的JS语法，但它应该可以工作。

http://api.jquery.com/height/

编辑：没关系，看看大卫的回答。

Answer 3

$('.container').animate({height:el.height()},($(this).height()-el.height()>el.height())?3000:100);