带动态内容的动态div动画包装 - 没有固定的高度
问题描述:
我是新来角度和建设一个项目。我已经正确地设置了所有的视图/路线,现在正试图“美化”视图之间的转换。我见过的很多演示都使用绝对定位的元素,这使得轻松过渡。带动态内容的动态div动画包装 - 没有固定的高度
我的内容将永远是动态的。有人可以帮助我使包装过渡的高度顺利以及淡化。淡入淡出正在按预期
答
用类似这样的标记
<div class="wrapper">
<div class="wrapper-inner">
{CONTENT}
</div>
</div>
你可以看包装,内高度的变化,并设置包装的高度
scope.$watch(
function() {
return innerElement[0].offsetHeight;
},
function(value, oldValue) {
element.css('height', value+'px');
}, true);
然后用css过渡动画变化的高度
.wrapper {
overflow: hidden;
transition: height ease .3s;
}