Angular UI $modal component transition

Question

Folks,

I am using the $modal component from Angular UI (http://angular-ui.github.io/bootstrap/). Whenever the modal opens it sort of scrolls down from the top. I simply want it to open instead of the fancy roll-from-top effect that it has right now

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

Anyone know how to achieve this ?

Answer 1

Changing the option windowClass to "modal fade in" removes the animated slide.

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

Plunker

In addition to that removing the fade class will believe it or not remove the fade effect.

Answer 2

The trick is to use css to disable the animations. I've achieved it 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