Позиционирование модального окна?

Question

[Sergey_5]

Помогите решить вопрос с позиционированием модального окна.

Есть блок с фиксированными размерами и overflow: scroll; (class="content").
Внутри блок по размеру больше, соответственно есть прокрутка (class="content__box").

Нужно чтобы модальное окно появлялось по клику в месте клика и не выходило за пределы первого блока (class="content").

Уже совсем запутался

Песочница
https://jsfiddle.net/SergeyA_/6kx84qa2/174/

Answer 1

[Alex]

1. В момент клика, перед тем как сделать всплывающее окно видимым вы считываете позицию указателя (координаты x, y). Это предварительные координаты для вашей модалки.
   
2. Далее вы вычисляете размер самой модалки. И проверяете не вылезет ли она за границы экрана. Например: если Х координата + Ширина модалки больше чем ширина контейнера -- сдвинуть мобалку в лево настолько чтобы она помещалась.
   
3. Применить полученные значения позиционирования к элементу и сделать его видимым.