CODEWITHSUNDEEP
javascriptcssangularjsng-animateng-view
RiesvGeffen
RiesvGeffen

Reputation: 1589

Why is my ng-view animation not working?

I'm trying to give my ng-view an animation, I have exactly the same code as the example and I so no error or anything.

This is my html code:

<div ng-view class="slidedown">
    <!--Insert templates-->

</div>

, css code:

.slidedown {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.slidedown.ng-enter,
.slidedown.ng-leave {
    -webkit-transition: all 1s ease;
    transition: all 1s ease;
}
.slidedown.ng-enter {
    top: -100%;
}
.slidedown.ng-enter-active {
    top: 0;
}
.slidedown.ng-leave {
    top: 0;
}
.slidedown.ng-leave-active {
    top: 100%;
}

and yes I have defined the source files:

<!-- CSS -->
<link href="assets/Css/ng-view.css" rel="stylesheet" type="text/css">
<!-- JS -->
<script src="componenten/bower_components/angular-animate/angular-animate.min.js"></script>
<script src="componenten/bower_components/angular-route/angular-route.min.js"></script>

So I really don't get it why it isn't working. Am I missing something?

Upvotes: 1

Views: 346

Answers (1)

RiesvGeffen
RiesvGeffen

Reputation: 1589

In my case the problem was that I forgot to include module dependency ['ngAnimate'].

Upvotes: 1

Related Questions