In Angular I'm having trouble animating the transition of an objects position after an Angular filter completes.
I've created a codepen to demo the functionality.
Now the opacity transitions to fadeinout those objects work fine once the filter is run but then they jump into their new position, and I would much rather prefer to apply a smooth transition to this as well.
ul.nav li { transition: all ease 2s ;
}
.animate.ng-enter,
.animate.ng-leave
{ transition: all 500ms;
}
.animate.ng-leave.animate.ng-leave-active,
.animate.ng-enter { opacity: 0; width: 0px; height: 0px;
}
.animate.ng-enter.ng-enter-active,
.animate.ng-leave { opacity: 1; width: 150px; height: 30px;
}Any ideas?
Joe