Just a quick note as this is my first post here. I’ve been playing with this awesome framework for the last 48 hours and I really love it. I’m building and application prototype with it to see if it’s good for our needs!
Here’s the question:
I’ve got the modal working with animation slide-in-up, it looks really good. I would like to have a fade-in modal. I’ve tried both fadeIn and fade-in.
Is it possible to have a modal fade in? Is there a list of available animations somewhere, I pretty much made my own list from the CSS but maybe I missed something in the documentation.
Hey guys, this is something we definitely need to expand on. It’s currently possible to do this, but the way the animations work with Angular, the slide-in-up is the only built in one that Angular’s ngAnimate works correctly with. I’ll put this on the list of things to expand on, but if you copy the format of slide-in-up including the keyframe animations and the slide-in-up-add and remove, it would work fine.
also interested in new animations like “slide-left-right-ios7” on modal views. This would be awesome for my “fancy select” directive that open a list of items within an ionic modal view. BTW, even if it’s a really small piece of code, I can share it if someone is interested.
The only animation class defined in the the ionic css for this is “slide-in-up”. It’s easy enough to implement your own animations for modal animations in your app’s css file. Here’s an example of a zooming effect I have used for modals (without vendor prefixes for simplicity):
inspired and learning about .ng-leave by you I thought it’d be easy to just use animate css and achieve the same with many other modal transitions.
You can check the demo and description here for animated modals…Let me know your thoughts on improving it. Feel free to open an issue on github