Как убрать остающийся скролл от второго модального окна после его закрытия?

Question

[AlMayBee]

Есть модальное окно, в котором находится кнопка вызова второго модального окна с формой.
Первое окно скролится при необходимости без проблем.
Второе окно открывается и сколится без проблем (если необходимо, форма не маленькая).
Проблема возникает, когда закрываешь форму - остается скролл от второго окна, но первое окно больше не скроллится.
Если кто с таким сталкивался, подскажите.

Если это важно:
- кнопка закрытия модалки с формой работает при помощи js, а не data-dismiss (в этом случае закрывает оба окна, поэтому пришлось править);
- проблему с padding-right: 15px тоже пришлось решать при помощи padding-right: 0!important

Answer 1

[Павел]

Что то вроде:

$('.modal').on("hidden.bs.modal", function (e) {
    if($('.modal:visible').length)
    {
        $('.modal-backdrop').first().css('z-index', parseInt($('.modal:visible').last().css('z-index')) - 10);
        $('body').addClass('modal-open');
    }
}).on("show.bs.modal", function (e) {
    if($('.modal:visible').length)
    {
        $('.modal-backdrop.in').first().css('z-index', parseInt($('.modal:visible').last().css('z-index')) + 10);
        $(this).css('z-index', parseInt($('.modal-backdrop.in').first().css('z-index')) + 10);
    }
});

Ещё решение:

$(document).ready(function(){
    $('.modal').on('show.bs.modal', function () {
      if ($(document).height() > $(window).height()) {
        // no-scroll
        $('body').addClass("modal-open-noscroll");
      }
      else { 
        $('body').removeClass("modal-open-noscroll");
      }
    })
    $('.modal').on('hide.bs.modal', function () {
        $('body').removeClass("modal-open-noscroll");
    })
  })

И Css

body.modal-open-noscroll {
  margin-right: 0!important;
  overflow: hidden;
}
.modal-open-noscroll .navbar-fixed-top, .modal-open .navbar-fixed-bottom {
  margin-right: 0!important;
}

Comments

[AlMayBee]

Спасибо, реально выручили! Первый скрипт помог!