Чтобы узнавать первыми о новых модификациях — подпишитесь на мой телеграмм-канал. Также вы сможете общаться, задавать вопросы и помогать другим дизайнерам.
Добавляем в zero-блоке шейпы или изображения, которые у нас будут вариантами ответа, сколько вариантов, столько и шейпов
Задаем классы этим шейпам. Верный ответ — класс dragtrue, неверный — dragfalse
Создаем область, куда будем перетаскивать наши варианты ответа, это также может быть шейп или изображения, задаем ей класс drag-container
Попапу, который должен появится при перемещении правильного ответа в область задаем класс uc-popuppromocode
Также в моём примере появляется верный вариант ответа, это отдельный шейп, у которого класс true-answer, и кнопка при нажатии на которую открывается повторно попап с промокодом, у которой класс promocode
В коде прописаны дополнительные комментарии, по которым вам будет проще ориентироваться, также есть дополнительная таблица, с помощью которой можете немного расширить функционал кода