Как открыть второе bootstrap окно без лишних бликов?

Question

[nepster-web]

Открываем бутстрап модальное окно, в нем есть кнопка, которая должна открыть новое окно.
Логика такая: если открывается новое окно, все остальные открытые окна закрываются.

Когда открывается бутстрап модальное окно, на body вешается: .modal-open и padding-right.

Когда я использую любой вариант закрытия окна (https://stackoverflow.com/questions/16493280/close...), то при открытии нового окна на body уже не вещаются .modal-open и padding-right.

если я делаю это сам принудительно, то появляется эффект дерганного скрола на секунду.

можно ли как-то закрыть модальное окно не трогая body ?

Answer 1

[Danny Arty]

Никаких дерганных скролов и бликов, или я что-то не понимаю

Comments

[nepster-web]

https://i.imgur.com/D5VtYhV.png

- окно на окне
- одно окно смещено левее
- 2 темных экрана накладываются друг над друга
- текст дергается при закрытии/открытии 2 окна
- если будет переленковка между окнами, то вероятно черная область будет бесконечно накладываться

так-же это подход противоречит изначальному условию: одно окно открывается, остальные закрываются.

[nepster-web]

Вам, в любом случае спасибо.
Пока я реализовал "временное" решение примерно такое:

let paddingScroll = null;
    let $modal = $('.modal');

    $modal.on('hidden.bs.modal', function (e) {
        if ($('.modal.show').length) {
            $('body').addClass('modal-open').css('paddingRight', paddingScroll + 'px');
        }
    });
    $modal.on('show.bs.modal', function (e) {
        $('.modal.show').not(e.target).modal('hide');
    });
    $modal.on('shown.bs.modal', function (e) {
        let $body = $('body');
        if (paddingScroll === null) {
            paddingScroll = parseInt($body.css('paddingRight'));
        }
    });

В этом случае из всех побочных эффектов есть небольшой посекундный блик при открытии нового окна.