A criação de uma janela pop-up em HTML é feita por meio da biblioteca jQuery, que permite integrar um manipulador de eventos a uma página da web e, assim, possibilitar a exibição do conteúdo ativo do site.
Instruções
Passo 1
Abra a página do seu site HTML no editor de texto que você usa para escrever o código que deseja. Você também pode usar o utilitário Windows Notepad padrão para inserir uma janela pop-up. Para fazer isso, clique com o botão direito no arquivo HTML e selecione "Abrir com" - "Bloco de notas".
Passo 2
Na seção do documento, crie uma camada que manipulará jQuery:
etapa 3
Em seguida, você precisa definir o nome da janela pop-up. Para fazer isso, você pode usar os cabeçalhos HTML em camadas:
Título da janela
Passo 4
Depois disso, defina o texto que será exibido na janela usando o script para criar um parágrafo:
Texto
Etapa 5
Em seguida, crie uma camada com a classe close_win para fechar o pop-up, antes de fechar o identificador anterior:
Feche uma janela
Etapa 6
Inclua a biblioteca jQuery no arquivo adicionando a tag necessária entre os descritores do documento. Por exemplo:
Etapa 7
Depois disso, digite o código para exibir o pop-up:
$ (function () {
$ ('# Mostrar'). Hide ();
Etapa 8
Em seguida, você precisa controlar o evento em que o usuário pressionou o botão do mouse para invocar a janela pop-up e controlar o fechamento da janela. Para fazer isso, digite o seguinte código:
$ (‘# Click-me’). Click (function () {$ (‘# show’). Fadein (300);})
$ (‘# Close_win’). Clique em (function () {$ (‘# show’). FadeOut (300);})
& lt / script>})
Este programa trata o usuário pressionando os botões para chamar a janela pop-up e clicando no link para fechá-la.
Etapa 9
Para exibir a janela pop-up na página, você pode usar o link da classe click-me que foi especificado no código acima. Para fazer isso, insira o seguinte código no corpo do documento:
Clique para mostrar o pop-up