v0.1.4 Add animation to the site - zhentian-wan/MEANAppsFiles GitHub Wiki
Using angular-animate for all ui-view:
[ui-view].ng-enter, [ui-view].ng-leave
position absolute
left 0
right 0
-webkit-transition all .3s ease-in-out
transition all .3s ease-in-out
[ui-view].ng-enter
opacity 0
[ui-view].ng-enter-active
opacity 1
[ui-view].ng-leave
opacity 1
[ui-view].ng-leave-active
opacity 0
Using TweenTimelite for the main ad:
$rootScope.$on('$viewContentLoaded', function() {
var tl = new TimelineLite();
tl.fromTo($('.jumbotron>h1'), 0.5, {marginLeft: '300px', alpha: 0}, {
marginLeft: 0,
alpha: 1,
ease: Ease.easeInOut
})
.fromTo($('.jumbotron>blockquote'), 0.5, {marginLeft: '200px', alpha: 0}, {
marginLeft: 0,
alpha: 1,
ease: Ease.easeInOut
});
});