Angular Animation - Improve reflow with animations

Asked Mar 10 '17 at 02:31

Active Mar 14 '17 at 02:20

Viewed 161 times

I'm using ngFx for my animations in an angular app (and new to the world of angular)

ngFX is great - seems very easy to use, but I want to improve how it deals with resizing the containing element.

Easy to see below, upon removal of the image the containing div instantly resizes - I want that to be smooth, i.e. it takes 1 sec to resize instead of that instant jump.

Not sure where to start fixing this issue.

Thanks

<div class="well well-lg">
    <h1 style="margin-bottom: 20px">NG SHOW</h1>
    <button style="margin-bottom: 20px" type="button" class="btn btn-primary btn-sm" ng-click="showdog = !showdog">TOGGLE</button>
    <br>

    <img class="fx-fade-up-big" ng-show="showdog" src="http://vignette4.wikia.nocookie.net/simpsons/images/7/77/200px-SantasLittleHelper.png/revision/20090712224020" >
</div>

edited Mar 14 '17 at 02:20

asked Mar 10 '17 at 02:31

DogCoffee

19,820
10
87
120

have you checked this ? http://stackoverflow.com/questions/21143702/how-to-animate-a-div-height-change-with-angularjs – Gonzalo.- Mar 14 '17 at 22:15
@Gonzalo.- yeah tried that - cannot get it to work with ngFx. – DogCoffee Mar 14 '17 at 22:17
can you provide a fiddle so we can play with it ? – Gonzalo.- Mar 14 '17 at 22:17
Its all good - I don't think it possible. – DogCoffee Mar 15 '17 at 00:18

Angular Animation - Improve reflow with animations

0 Answers0