Turn off animation, modal, angular-ui

Question

Is it possible to turn off the animation for the modal directive in angular-ui? http://angular-ui.github.io/bootstrap/

Can't find any in the options. Should I modify the source? Or is there any best practice when you want to customize?

Answer 1

Currently, the bootstrap classes are embedded in the directive and need to be overridden. If you want to prevent that vertical 'drift' into position of the modal window, place the following 2 classes in your css :

.modal.fade {
  opacity: 1;
}

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

What you would be accomplishing here is the negation of the existing translations. Not ideal, however will do the trick.