В Bootstrap есть классы, которые можно использовать для создания затемненного фона, подобного тому, который используется в модальных окнах. Один из таких классов - modal-backdrop.
modal-backdrop - это класс, который добавляется к элементу body при открытии модального окна, чтобы создать затемненный фон. Этот класс применяет непрозрачность и цвет фона, чтобы создать визуальный эффект затемнения на заднем плане.
Чтобы использовать modal-backdrop, следует добавить этот класс к элементу body в момент открытия модального окна, например:
<body>
<!-- Ваш HTML-код -->
<div id="myModal" class="modal">
<!-- Разметка модального окна -->
</div>
<script>
function openModal() {
// Открыть модальное окно
$('#myModal').modal('show');
// Добавить класс modal-backdrop к элементу body
$('body').addClass('modal-backdrop');
}
function closeModal() {
// Закрыть модальное окно
$('#myModal').modal('hide');
// Удалить класс modal-backdrop из элемента body
$('body').removeClass('modal-backdrop');
}
</script>
</body>
В приведенном выше примере, функция openModal() открывает модальное окно и добавляет класс modal-backdrop к элементу body, чтобы создать затемненный фон. Функция closeModal() закрывает модальное окно и удаляет класс modal-backdrop из элемента body.
Обратите внимание, что класс modal-backdrop должен быть добавлен после вызова метода modal('show') для модального окна и удален после вызова метода modal('hide').
Надеюсь, это помогает! Если у вас есть дополнительные вопросы, не стесняйтесь задавать.