Не допускайте прокрутки тела при открытии модального прыжка и прыжка наверх - PullRequest
Новая
       6

Не допускайте прокрутки тела при открытии модального прыжка и прыжка наверх

0 голосов
/ 19 марта 2019

Я пробовал много решений, и я не могу заставить эту работу.

Я нашел решение, которое предотвращает прокрутку тела при открытом модале: 

body.modal-open {
    overflow: hidden;
    position: fixed;
    width: 100%;
    height: 100%;
}

Это отлично работает. Проблема в том, что когда я открываю модальное тело, оно прокручивается вверх. Я не хочу этого поведения, и я понимаю, что это связано с позицией: исправлено. Я попробовал родственник, и это не сработало.

Заранее спасибо.

Ответы [ 2 ]

0 голосов
/ 19 марта 2019

В итоге я понял это. Что я сделал, так это удалил css, который я разместил на вопросе, а затем следующий jquery, добавив класс к элементу html, и в стиле css этот класс:

Jquery: 

$(".modal").on('show.bs.modal', function(event) {

    $('html').addClass('no-scroll');

})
$(".modal").on('hide.bs.modal', function(event) {

    $('html').removeClass('no-scroll');

})

CSS: 

.no-scroll{
    overflow: hidden;
}
0 голосов
/ 19 марта 2019

Если я вас хорошо понял, вы можете сделать что-то подобное с Bootstrap: 

// Avoid scrolling
body.modal-open, .modal-open .modal {
  overflow: hidden;
}

А затем добавьте .modal-dialog-centered к .modal-dialog для вертикального центрирования модала.

https://jsfiddle.net/4938ek6q/

Пожалуйста, измените размер окна результатов в приведенном выше примере, чтобы убедиться, что это то, что вы ищете.

Надеюсь, эта помощь или, по крайней мере, направит вас в правильном направлении:)

...