Skip to content

Latest commit

 

History

History
48 lines (28 loc) · 2.41 KB

README.md

File metadata and controls

48 lines (28 loc) · 2.41 KB
Raw

Site de Teste de Pop-ups

GitHub

Este site foi criado com o objetivo de testar a funcionalidade de pop-ups. Ele foi desenvolvido utilizando apenas HTML, CSS e JavaScript Vanilla, sem a importação de qualquer biblioteca externa.

Ele está hospedado em: https://tgentil.github.io/teste-pop-up/

Estrutura do Site

O site possui a seguinte estrutura:

  • Navbar: Uma barra de navegação com links para as seções do site, incluindo um link de teste para abrir o pop-up.
  • Seções: As seções do site incluem "Home", "Sobre" e um rodapé com informações de contato.
  • Pop-up: Ao clicar no link de teste na barra de navegação, um pop-up é exibido. O pop-up contém uma barra lateral com opções de menu e uma área de conteúdo que exibe diferentes seções conforme selecionado no menu lateral.

Tecnologias utilizadas

  • HTML
  • CSS
  • JavaScript (Vanilla JS)

Arquivos do Site

  • HTML: O código HTML define a estrutura do site, incluindo a navegação, as seções e o pop-up.
  • CSS: O arquivo CSS contém estilos personalizados para o site, incluindo o layout, cores, fontes e posicionamento dos elementos.
  • JavaScript: O arquivo JavaScript adiciona interatividade ao site, controlando o comportamento do pop-up e a exibição das seções correspondentes.

Como usar

  1. Clone este repositório em sua máquina local ou acesse https://tgentil.github.io/teste-pop-up/ para visualizar o site.
  2. Navegue pelas diferentes seções clicando nos links do menu de navegação.
  3. Para testar o pop-up, clique no link "Teste" e selecione uma opção no menu lateral.

Observações

Este site foi criado de forma simples e minimalista, utilizando apenas recursos básicos de HTML, CSS e JavaScript. O objetivo principal é aprender a utilizar a funcionalidade de pop-ups e fornecer um exemplo básico de implementação.

Sinta-se à vontade para modificar o código, adicionar estilos personalizados ou expandir as funcionalidades do site de acordo com suas necessidades.

Importante: Certifique-se de manter todos os arquivos (HTML, CSS, JavaScript) na mesma pasta e também verifique se os caminhos dos arquivos estão corretamente referenciados no código HTML.

Autor

  • Thiago da Silveira Gentil