Angular Transition to the modal component UI $

Question

People,

I am using the $ modal component from Angular UI ( http://angular-ui.imtqy.com/bootstrap/ ). Whenever a modal opens it, scrolls down from above. I just want it to open instead of the spectacular roll-from-top effect that it has right now.

Plnkr: http://plnkr.co/edit/?p=preview

Does anyone know how to achieve this?

Answer 1

Changing the windowClass parameter to "modal fade in" deletes the animated slide.

 var modalInstance = $modal.open({ windowClass: "modal fade in" }); 

Plunker

In addition to this, removing the fade class will believe or not remove the fading effect.

Answer 2

The trick is to use css to turn off the animation. I achieved this by adding:

 .modal.fade .modal-dialog { -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); transform: translate(0, 0); } 

To the stylesheet. See This plunkr: http://plnkr.co/edit/43oCGtDb3CaP9bwgW5gm?p=preview