Juro que não é clickbait, existe uma nova funcionalidade no HTML que ainda é desconhecida por muitos que é o atributo popover, vou te ensinar a fazer a magia passo a passo, tomemos de exemplo essa tela:
class="no-margin">Hey, It's Iury Nogueira.
class="no-margin">Fullstack Developer
id="info">I've been working as a full stack web developer for 10 years
More details
e você quer que o texto no parágrafo com id=”info” apareça em um modal quando for clicado no botão de More details, para isso você só precisa informar quem vai ficar no modal com o atributo popover:
id="info" popover>I've been working as a full stack web developer for 10 years
ao fazer isso vai notar que ele sumiu da sua página, agora você só precisa “conecta-lo” a uma ação, para isso vamos usar o atributo popovertarget:
popovertarget="info">More details
com isso ele vai abrir o parágrafo que tem o id “info”, pronto! O resultado é esse:
se você clicar fora do conteúdo vai notar que ele fecha também assim como um modal. Espero ter contribuído com essa dica, se você acha que outra pessoa desconheça compartilha esse post com ela, vlw! 😀
