Culinária | Detonados | Internet | Poesias | Wallpapers | Web Tools |
Veja como editar aquelas janelinhas que às vezes tornam-se muito necessárias para expor algum conteúdo extra-página como ajuda, mensagens programadas, ou qualquer outra informação que nelas se tornam mais eficazes. Veja também como criar função js para exibir popup's através de formulários.
VEJA AQUI o exemplo de modêlo de popup.
Primeiramente crie um pasta no servidor local com o nome de popups, em seguida crie outra pasta dentro desta primeira com o nome de php. Este será o caminho http://localhost/popups/php/.
Crie ainda uma outra pasta chamada de images dentro da pasta popups e dentro dela adicione um imagem com o nome de button.webp (a extensão da imagem deve ser .webp). Este será o caminho completo para a imagem: http://localhost/popups/images/button.webp.
Agora copie o código abaixo e salve-o na pasta php, atribua a este arquivo o nome de popup.html
<html>
<head><title>Editar Pop'Ups - Exemplos de Popup</title>
<meta-name="robots" content="noindex">
<style type="text/css">
body{width:98%;padding:1%;margin:0px;background:#ff0;color:#00f;font-size:80%;}
img{98%;border:0px;margin:1%;float:center;}
h1{text-align:center;}
p{text-align:center;margin:0px;}
</style>
<body>
<h1>Teste de Popup</h1>
<img src="../images/button.webp" alt="Teste" title="Teste">
<p>Isto é um teste - Isto é um teste - Isto é um teste - Isto é um teste - Isto é um teste - Isto é um teste - Isto é um teste - Isto é um teste - Isto é um teste - Isto é um teste - Isto é um teste - Isto é um teste - Isto é um teste - Isto é um teste - Isto é um teste - Isto é um teste .</p>
</body>
</html>
Em seguida copie o código abaixo, cole em Bloco de Notas e salve-o como teste.html dentro da pasta popups.
<a href="#" onclick="window.open('php/popup.php','popup','width=300,height=300,left=700,top=100');"><img src="images/button.webp" alt="novidades100.com.br" title="novidades100.com.br"></a>
Copie o código abaixo e cole no arquivo já salvo teste.html - Não é necessário cobrir o primeiro código, cole abaixo dele.
<button onclick="window.open ('php/popup.php','popup','width=468,height=530,left=300,top=20');">Botão de Pop'Up</button>
Copie o código abaixo e cole em teste.html - Abaixo dos outros salvos anteriormente.
<p><a href="#" onclick="window.open('php/popup.php','popup','width=280,height=600,left=700,top=0');"> Isto é um exemplo de popup…</a></p>
Copie o código abaixo e salve no arquivo teste.html.
<button onmouseover="window.open('php/popup.php','popup','width=280,height=640,left=700,top=0');"> <h1>button</h1></button>
Para abrir uma página simultaneamente em um popup copie o código a seguir e salve no arquivo teste.html - Click no botão abaixo para ver exemplo.
<Click no Link>
LINK COM POPUP
Abaixo o código do exemplo acima. Copie e cole no arquivo teste.html.
<a href="php/popup.php" onclick="window.open('php/popup.php','popup','width=500,height=500,left=100, top=100');"><img src="images/button.webp" alt="novidades100. com.br" title="novidades100.com.br"></a>
Veja abaixo um exemplo de como editar popup's em formulários, fazendo com que a janela fique de acordo com suas pretenções de posicionamento, tamanho e aparência.
Faça um Teste Abaixo - Digite seu Nome
Para executar este tipo de popup é necessário que o Servidor Local trabalhe com extensões .php.
Se este for o seu caso, copie o código abaixo e salve-o dentro da pasta php com o nome de myname.php.
<!DOCTYPE HTML>
<html>
<head><title>Resposta Form Popup</title>
<meta name="robots" content="noindex">
<meta charset="UTF-8">
<style type="text/css">
body{width:98%;background:#ff0;padding:1%;color:#00f;margin:0px;font-size:130%;}
</style>
</head>
<body>
<?php
$nome = $_POST['nome'];
echo "Olá ".$nome." você aqui no site? Espero que goste e volte sempre!";
?>
</body>
</html>
Agora copie o código a seguir e salve no arquivo teste.html.
<script>
function openForm(popup,myPopup,features) {
window.open(popup,myPopup,features);
}
</script>
<b>Digite seu Nome</b><br>
<form id="myForm" method="POST" action="php/myname.php" name="myPopup" target="popup" onSubmit="openForm ('about:blank','popup','width=600,height=300')">
<input type="text" size="25" name="nome" maxlength="20">
<input type="submit" value="Enviar">
</form>
Estes são são alguns exemplos de popups que devem ser usados com cautela já que não são muito bem aceitos pelos usuários, além do que os navegadores costumam bloqueá-los por padrão.
Pop'Up, Pop'Ups, Página Web, Janelinhas, Conteúdo
Pressione CTRL + D para Adicionar Esta Página aos Seus Favoritos
Nosso site utiliza cookies para melhorar sua experiência ao utilizar nosso conteúdo, além de personalizar publicidades de acordo com seus interesses.
Política de Privacidade