Такая проблема с "зависанием" скроллинга в модальных окнах с iframe действительно может возникать — особенно если одновременно работают скроллинг модального окна и вложенного iframe. Давай разберёмся по шагам и подберём варианты решений.

🚨 В чём проблема?

Когда в модальном окне Bootstrap одновременно:

1. Прокручивается основной контент модального окна.

2. Внутри есть iframe, у которого тоже включён скроллинг (overflow: auto или scroll).

3. Иногда скролл как будто "зависает", и модальное окно не реагирует на скролл мыши/тачпада.

4. Но после наведения мыши или какого-то "толчка" всё возвращается в норму.

Это поведение связано с конфликтом событий scroll, pointer, wheel и focus, которые пересекаются между документом в iframe и родительским окном (модальным).

✅ Возможные решения

1. Отключить прокрутку iframe по умолчанию

Если это допустимо, убери прокрутку из iframe, а сделай так, чтобы его контент был автоматически подстраивающимся по высоте.

Как вариант:

html
Копировать код
<iframe src="..." style="width:100%; height: auto;" scrolling="no"></iframe>

Или с JavaScript:

js
Копировать код
// Автоматически подгонять высоту iframe под контент
const iframe = document.getElementById('your-iframe-id');
iframe.onload = () => {
    try {
        const doc = iframe.contentWindow.document;
        iframe.style.height = doc.body.scrollHeight + 'px';
    } catch (e) {
        // Если iframe с другого домена — будет ошибка, поймать её
        console.warn("Не удалось получить доступ к iframe из-за политики CORS");
    }
}

2. Изоляция скроллинга только внутри iframe

Если iframe обязательно должен скроллиться, то:

• Убедись, что он не перехватывает scroll-события, когда не в фокусе.

• Попробуй добавить в iframe CSS:

css
Копировать код
html, body {
    overscroll-behavior: contain;
}

Это остановит "провал" скролла наружу (в родительское окно).

3. Добавить pointer-events: none во время прокрутки

Можно временно отключать события мыши на iframe, когда прокручивается модалка.

Пример на JavaScript:

js
Копировать код
const modal = document.querySelector('#myModal');
const iframe = modal.querySelector('iframe');

modal.addEventListener('wheel', () => {
    iframe.style.pointerEvents = 'none';
    clearTimeout(iframe._scrollTimeout);
    iframe._scrollTimeout = setTimeout(() => {
        iframe.style.pointerEvents = 'auto';
    }, 300); // 300 мс после последнего события скролла
});

4. Попробовать overflow: hidden на родителе во время фокуса в iframe

js
Копировать код
const modalBody = document.querySelector('.modal-body');
const iframe = document.querySelector('iframe');

iframe.addEventListener('mouseenter', () => {
    modalBody.style.overflow = 'hidden';
});
iframe.addEventListener('mouseleave', () => {
    modalBody.style.overflow = 'auto';
});

💡 Идея: Использовать <div> вместо iframe

Если контент можно загрузить через AJAX (fetch / axios), лучше встроить его в модалку напрямую, без iframe. Это уберёт все проблемы со скроллингом.

🤖 Итог

Зависание скроллинга — частая проблема при работе с iframe внутри Bootstrap-модалок. Она решается одним из способов:

• Отключить скролл в iframe, если можно.

• Управлять фокусом и событиями (mouseenter, wheel).

• Добавлять pointer-events: none временно.

• Подгонять высоту iframe под содержимое.

• Заменить iframe на обычную подгрузку контента.

Если покажешь HTML/JS-код модального окна и iframe — смогу предложить более точную адаптацию.