AngularUI Modal - предотвращение как смещения тела, так и прокрутки

5

Я использую последние версии angularjs, angularui, jquery и bootstrap и сталкиваются с проблемой. Содержимое тела сдвигается влево, а затем вправо, когда используется мода angularui. Это можно увидеть на главной странице angularui.

Я прочитал эту проблему (https://github.com/twbs/bootstrap/issues/9855) и попытался расширить это решение (http://jsbin.com/oHiPIJi/8/edit) к угловому модальному случаю, но, похоже, это не работает. Мои знания jquery довольно ограничены/минимальны. Я боюсь, но я подозреваю, что bs.modal события не запускаются для angularui, хотя я не уверен.

Любые указатели в правильном направлении для решения этой проблемы будут высоко оценены! Благодарю.

Теги:
angular-ui

1 ответ

9

Может быть полезно следующее:

<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
<style>
  .modal-open {
  overflow: auto;
}
</style>

Перезаписать класс modal-open overflow в auto после загрузки загрузочного css. Вот вам плукер, чтобы проверить, является ли это желаемым результатом: http://plnkr.co/edit/Jz6Pd08v7dkkdRUKg8FK?p=preview

Вам нужно открыть предварительный просмотр в новом окне (синий X в правом верхнем углу). Измените размер окна на разную ширину, чтобы увидеть, работает ли он с помощью полосы прокрутки или нет. Протестировано это в Firefox. другие браузеры могут иметь разные результаты.

  • 0
    Большое спасибо за ваш ответ mainguy. К сожалению, это не решает проблему для меня. Я раздвоил плункер для демонстрации ( plnkr.co/edit/wZ7BSIIKBy850fR4Vxs0?p=preview ). Это решает проблему смещения контента, но вводит прокрутку фона (как только вы прокрутите до нижней части модального окна). Это то, что я обнаружил, пытаясь справиться с этим - вы можете либо избавиться от сдвига контента с помощью CSS, такого как выше, но иметь фон прокрутки или остановить прокрутку фона и сдвиг контента. Конечно, вы можете решить обе проблемы - возможно, с помощью JS.
  • 1
    Что плохого в прокручиваемом фоне? Может быть, вы должны попробовать ng-dialog. Я использую его очень часто, и он намного меньше и проще в обращении, чем модальный бутстрап. Прекрасно работает с начальной загрузкой 3. github.com/likeastore/ngDialog
Показать ещё 2 комментария

Ещё вопросы

Сообщество Overcoder
Наверх
Меню