Как лучше всего сделать кнопку по нажатию которой будет выезжать модалка?

Question

[Максим Иванов]

https://imgur.com/a/eOxKXz4
Как по мне, то кнопку туповато в таком случае будет делать с помощью тега <button> или<a>. Не проще будет сделать всё в одном диве и для этого дива дать cursor: pointer; , а модальное уже c js по нажатию?
Да и как в моём случае вообще разумней сделать?

Comments

[Ankhena]

туповато в таком случае будет делать с помощью тега <button> или <a>

Туповато не использовать теги специально для этого предназначенные.

Кнопка
<a href="#idмодалки">открыть модалку</a>
Модалка
<div id="idмодалки">модалка</div>
На js

убираете действие по умолчанию для кнопки event.preventDefault()
добавляете модалке класс, который её скрывает

по клику на кнопку убираете скрывающий класс

Если js отвалится, модалка будет показана в потоке и ссылка перенесет пользователя к якорю.

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

[Сергей delphinpro]

Для размещения картинок есть специальная кнопка

Answer 1

[Alex]

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

Answer 2

[Юрий Литвиненко]

Разумно так:
тег button, на эту кнопку обработчик события, в котором делаете показ модального окна.