使用百分比时，高度不动画

Question

我希望在单击时展开一个框，这是我已经实现的。但是，如果我使用百分比作为高度，则过渡效果不起作用，即使过渡在像素中定义时也是如此。

我在此codepen中保存了该网站的片段：https://codepen.io/anon/pen/JZGWBW

这有效：

function height(ev, thisElement){
    thisElement.style.height = "200px";
}

这不是：

function height(ev, thisElement){
    thisElement.style.height = "100%";
}

关于为什么会发生这种情况的任何想法？