Как сделать много одинаковых по дизайну, но разных по контенту всплывающих окон?

Question

[Яна Егорова]

На сайте портфолио есть список работ, при клике на каждую открывается модальное окно.
Как сделать так чтобы модальное окно было одно, а контент подставлялся в зависимости от того по какой работе кликнули? Сайт делаю без сборки.

Comments

[Максим]

Ну, как вариант, сохраняете данные в каком-нибудь скрытом диве (в списке работ), ему даете дата-атрибут.
По открытию окна берете данные из этого дива по атрибуту и вставляете в модальное окно.

[Ankhena]

А смысл перемещать блоки, если любому можно задать нужный класс и открыть как модалку?

Answer 1

[kocherman]

Так чтоли?

Answer 2

[Keliorw]

Так можно же сделать несколько блоков контента внутри модального окна выставить у них display: none; потом накинуть на каждый тег кнопки атрибут onclick="имя вызываемой функции ()" и уже в js настроить функцию которая меняет display: none; на display: block;

Вот переделал пример выше под мой вариант: https://codepen.io/keliorw/pen/ExKmPbj