Подтвердить что ты не робот

Отключить анимацию, модальный, angular -ui

Можно ли отключить анимацию для модальной директивы в angular -ui? http://angular-ui.github.io/bootstrap/

Невозможно найти в настройках. Должен ли я изменить источник? Или есть какая-либо передовая практика, когда вы хотите настроить?

4b9b3361

Ответ 1

В настоящее время классы bootstrap встроены в директиву и должны быть переопределены. Если вы хотите, чтобы этот вертикальный "дрейф" находился в положении модального окна, поместите следующие 2 класса в ваш 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);
}

То, что вы делаете здесь, - это отрицание существующих переводов. Не идеальный, однако будет делать трюк.

Ответ 2

animation (Тип: boolean, По умолчанию: true) - Установите для false, чтобы отключить анимацию на новом модальном/фоновом изображении. Не переключает анимацию для модальных изображений/фонов, которые уже отображаются.

var modalInstance = $uibModal.open({
  animation: false

Ответ 3

Легкий способ отключить анимацию - добавить стили ! important в модальный.

Для всех модалов

Вы можете сделать это глобально для всех модалов с помощью этого класса CSS (поместите его в любом месте в css):

.modal {
   top: 25% !important;
   opacity: 1 !important;
}

Он исключит анимацию "слайд сверху", а также анимацию непрозрачности. Лично я предпочитаю только исключать первое и использовать только top: 25%! Important;

Вы также можете удалить анимацию заднего фона глобально с помощью этого класса (поместите его в любом месте вашего css):

.modal-backdrop {
   opacity: 0.8 !important;
}

Для конкретного модального

Вы можете исключить анимацию определенного модального параметра, используя параметр windowClass.

.no-animation-modal {
  top: 25% !important;
  opacity: 1 !important;
}

Использование windowClass:

var modalInstance = $modal.open({
  templateUrl: 'myModalContent.html',
  controller: ModalInstanceCtrl,
  windowClass: 'no-animation-modal'
});

Ответ 4

У меня нет полного ответа, но у меня есть аналогичная проблема, и я думал, что буду звонить. Я знаю, что это было возможно в angular -ui/bootstrap 0.5. Там могут быть изменения в 0.6, и я пытаюсь найти ответ, но документации довольно не хватает.

Здесь приведен пример в 0.5. Обратите внимание, что вы можете установить такие параметры, как backdropFade, но я не могу найти эквивалент в 0.6. Возможно, это связано с удалением $dialogProvider.