Как сделать модальное окно с скроллом?

Question

[Даниил Касьянов]

Добрый день. Подскажите пожалуйста, как можно реализовать такое модальное окно, которое при открытии будет скроллиться. В модальном окне будет некое подобие статьи, с текстом и картинками (заказчик не хочет выносить это в новую страницу). Важно, чтобы окно открывалось на определенном расстоянии от верха экрана вне зависимости от того, в каком месте сайта находится пользователь. И ещё важно, чтобы при открытии окна скролл главной страницы отключался, т.к. пользователь будет скроллить окно.

Я знаю, что я должна была гуглить, а не задавать вопросы на Хабре, но в гугле все не то ((((

Может, у кого-нибудь есть ссылка на то, что мне надо?

Спасибо большое

Answer 1

[ReActor Дмитрий Вершанский]

Здравствуйте!
Ключевые моменты:

1. Сверстать popup-окно, использовав фиксированное позиционирование (fixed)
2. Задать параметр высоты этого окна (height)
3. Прописать свойство (overfoiw), со значение (auto)
4. Применить так же свойство overscroll-behavior, со значением contain, с целью предотвращения перехвата скроллбара нецелевым элементом.

Answer 2

[hzzzzl]

css overflow scroll и пофиг что там внутри

окна скролл главной страницы отключался, т.к. пользователь будет скроллить окно.

body { overflow: hidden; }

Comments

[Даша Циклаури]

lol

[Даниил Касьянов]

Примерно то, что мне нужно. Но как его открыть по нажатию, например, на кнопку? И как закрыть?