NOVIDADES100 Tem de Tudo

Como Editar Popup's

Várias Formas de Popup's, Inclusive em Formulários

Veja como editar aquelas janelinhas que às vezes tornam-se muito necessárias para expor algum conteúdo extra-página, anúncios, ajuda 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.
Como já recebi reclamações de que eu enrolo muito com informações adicionais, vamos direto à dica:

Para editar com Imagem

novidades100.com.br

Para Editar (Com Imagem)

Copie o script abaixo, cole em Bloco de Notas e salve-o como popup-imagem.htm.

<a href="#" onclick="window.open('http://www.novidades100.com.br/dicas/htm/300x250-buscap.htm','popup','width=300,height=250,left=700,top=0');"> <img src="http://www.novidades100.com.br/images/imag/favicon1.jpg" alt="novidades100.com.br" title="novidades100.com.br"> </a>

Para editar com Botão

Para Editar (com Botão)

Copie o script abaixo, cole em Bloco de Notas e salve-o como popup-button.htm.

<button onclick="window.open('http://www.novidades100.com.br/dicas/htm/bloco_468x60.htm', 'popup','width=468,height=530,left=300,top=20');"><h1>Button</h1></button>

Para editar com Texto

Para Editar (com Texto)

Copie o script abaixo, cole em Bloco de Notas e salve-o como popup-texto.htm.

<p><a href="#" onclick="window.open('http://www.novidades100.com.br/dicas/htm/150x350-submar.htm','popup','width=180,height=400,left=700,top=300');"> Isto é um exemplo de popup…</a></p>

Para Abrir sem Clicar, Apenas Passando o Mouse sobre a Imagem, Botão ou Texto

Para Editar (com botão, abrindo quando o mouse passa sobre ele)

Copie o script abaixo, cole em Bloco de Notas e salve-o como popup-button2.htm.

<button onmouseover="window.open('http://www.novidades100.com.br/dicas/htm/160x600-submar.htm','popup','width=180,height=640,left=700,top=0');"> <h1>button</h1> </button>

Abrir Página Simultâneas com Popop's

Para abrir uma página simultaneamente com popup, copie o script abaixo, porém antes click no link a seguir para verificar como ficaria.

<Click no Link> LINK COM POPUP

Para Editar

Copie o script abaixo, cole em Bloco de Notas e salve-o como link-com-popup.htm.

<a href="../dicas/htm/exemplo-de-banners.htm" onclick="window.open('../dicas/htm/300x250-mercad.htm','popup','width=300,height=250,left=300,top=300');"> LINK COM POPUP </a>

Explicando

Em todos os links (imagem, botão e texto), o url que fica entre aspas simples e parênteses, é o que vai aparecer no popup, logo em seguida, separado por vírgula, a indicação de popup, depois a altura e largura do popup e em seguida aonde exatamente ele vai ser exibido na tela.

Abrir Popup's em Formulários

Veja abaixo um exemplo de como editar popup's em formulários, fazendo com que a janela fique de acordo com suas intenções de posicionamento, tamanho e aparência.
Faça um Teste Abaixo - Digite seu Nome

Copie o código abaixo, salve em Bloco de Notas, e execute no seu navegador.

<script type="text/javascript">
function openForm(popup,myPopup,features) {
window.open(popup,myPopup,features);
}
</script>
<b>Digite seu Nome</b><br> <form id="myForm" method="POST" action="http://www.novidades100.com.br/dicas/script/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>

Atenção: A função js, no início do código, você deve aplicá-la na head da sua página que irá chamar esta função ou em um arquivo js separado.


Veja como Construir Gadgets
Editar Popup's
Criar Slides com JQuery
Redirecionar Url's em Php, JavaScript e Html
Algumas Funções do Formidável JQuery
Criar Banners para Sites e Blogs
Editar Legendas Ocultas em Videos do You Tube
Atributos e Propriedades de Marquee
Criando Páginas Html
Editar e Enviar Sitemaps para Sites e Blog do Blogspot