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