AS JANELAS POP-UP
As janelas pop-up são aquelas janelas que aparecem geralmente em tamanho menor, quando visitamos alguns sites, geralmente poluídas com propagandas excessivas que irritam o utilizador. Apesar de parecer desnecessário dizer que deve evitar de usar esse tipo de recurso para fazer propaganda – primeiramente porque irrita o utilizador e depois porque todos os navegadores de internet modernos estão equipados com sistemas que impedem o surgimento de tais janelas –, muitos webmasters insistem em utilizar essa técnica, nomeadamente para difundir vírus ou programas mal intencionados.
O BOM USO DAS JANELAS POP-UP
O segundo uso que poderá dar à uma janela pop-up, esse sim útil, é o de mostrar informações secundárias, sem que seja preciso levar o utilizador para uma outra página como, por exemplo, mostrar informações detalhadas sobre um determinado tema ou produto ou uma outra página que não faça parte do seu site.
Neste segundo caso a janela aparecerá quando o utilizador fizer clique num determinado link e não de forma automática.
Porém, ao fazer uso de uma dessas janelas, deve certificar-se de que a janela é mostrada num tamanho menor do que o tamanho da página do seu site, para ficar claro ao visitante que ele não mudou de página e que está apenas a ver a informação solicitada.
NOTA: Se está a desenvolver o site para dispositivos PDA, telemóveis e outros equipamentos portáteis, deve certificar-se de que são capazes de mostrar o conteúdo destas janelas.
JAVASCRIPT
Uma janela pop-up tradicional é geralmente feita com um código JavaScript adicionado à secção <HEAD> do código HTML da página.
Indicamos um código que usamos há anos e que é muito eficaz e pequeno.
<script language="JavaScript">
<!--
function JanelaPopUp(alfa) {
NovaJanela = window.open(alfa, "NovaJanela", "height=350,
width=580, alwaysLowered=0, alwaysRaised=1, channelmode=0,
dependent=0, screenX=30, left=30, screenY=65, top=65,
directories=0, fullscreen=0, hotkeys=1, location=0,
menubar=0, resizable=1, scrollbars=1, status=0,
titlebar=1, toolbar=0, z-lock=0", "MinhaJanela");
minhaJanela.focus();
}
//-->
</script>
NOTA: Para criar um link e fazer uma página abrir dentro do pop-up, faça o link da seguinte forma: "javascript:JanelaPopUp(’http://www.efeitosvisuais.com’);"
Exemplo: <a href="javascript:JanelaPopUp(’http://www.efeitosvisuais.com’);"> clique aqui </a>
No exemplo anterior, deve substituir o endereço do nosso site, pelo endereço da página que deseja abrir. Observe que existem aslas e apóstrofes no link. Deve usar ambos da forma indicada, para que tudo funcione e não deve esquecer do ponto e vírgula no final.
Poderá ver que existem vários parâmetros que poderá configurar dentro do script, como height e width que definem a largura e a altura da janela, left e top que definem as coordenadas no ecrã onde a janela deverá ser mostrada (left = 0 e top = 0 equivale ao canto superior esquerdo).
Para ver um exemplo de uma janela pop-up do tipo que mostrámos neste artigo, clique aqui. Verá uma janela de 200 x 200 pixels, resizeable = 1, scrollbars = 1, left = 200, top = 200, width = 350, height = 200.
| Tweetar |
| Se gostou desse artigo... | |
:: |
receba as novidades deste site por e-mail! |
Dê a sua opinião sobre este artigo
9 Opiniões
-
ricardo on
Setembro 28, 200817:08
eu queria saber como criar um site... esse site parece ser bom, mas não consigo entender como criar um site.
-
Magno Urbano on
Setembro 28, 200821:35
Caro Ricardo, cria um site envolve uma série de conhecimentos como, saber trabalhar minimamente com um programa de imagens, saber lidar com um programa de criação de site, etc. Esses conhecimentos são muito extensos para abordar numa página de internet. Um livro que fale sobre isso vai ter 300, 400 ou mais páginas e, mesmo assim, vai só abordar uma parte. Um curso em vídeo terá várias horas de explicação para tratar do básico. Por esta razão, o nosso site tem centenas de páginas, para tratar de vários assuntos diferentes. Porque não começa pelo nosso curso grátis de HTML?
-
Ilieda on
Outubro 5, 20080:59
Olá estava navegando na rede garimpando informações e dicas a fim de construir meu problog. Muito bom o seu dando dicas etc.. Caso vc possa me ajudar mandando algum material de apoio ou dicas eu agradeço.
-
Luis Henrique on
Outubro 21, 20080:41
Gostei do artigo, é exatamente do que preciso pro meu site... mas não estou conseguindo implementar esse código. No meu site, uso templates, e coloco o código da janela pop-up na parte editável do template, na página que me interessa. Mas qndo vou testar, o link não funciona. Será que estou passando o nome da minha página errado? Agradeço a ajuda.
-
Magno Urbano on
Outubro 21, 20087:54
Caro Luis, é difícil saber o que pode estar errado. O código em questão deve estar na secção HEAD do HTML da página e ao fazer o link deve usar a forma indicada. Na hora de fazer o link deve prestar atenção aos apóstrofos e às aspas. Deve estar tudo exactamente conforme indicado. Ao visitar a página onde colocou o código, veja o source desta e verifique se o código e o link aparecem conforme indicamos aqui.
-
Luis Henrique on
Outubro 21, 200822:40
Magno, consigui colocar o script pra funcionar, mas tive q fazer algumas alterações. Por algum motivo, o script q vc postou, nao funciona aki. O script q utilizei é o seguinte: function JanelaPopUp(alfa){ window.open(alfa, 'Janela', 'top=20, left=20, toolbar=no, location=no, status=no, scrollbars=yes, resizable=no, width=500, height=500')} Agradeço sua atenção. Sds,
-
Magno Urbano on
Outubro 22, 200814:43
Caro Luis, o que fez foi mudar as aspas para apóstrofos. Tanto faz. Usar um ou outro depende de como está a criar o teu site. Se estás, pºor exemplo, a usar PHP para imprimir a função com echo "", precisarás de usar apóstrofos. Se usares echo '', precisarás de usar aspas. Caso contrário o comando será impresso errado e não funcionará.
-
isak Satierf on
Março 23, 200921:26
caro(a) gostaria de fazer um janela pou-up mais Eu nem sei por onte começar pode me dá um dicas grato Isak Satierf
-
Isabela Nery on
Abril 20, 20095:05
Estou construindo um site e antes de ler esses artigos tava me preocupando muito com a beleza do site e esquendo o conteúdo do mesmo. Valeu, ah, e eu adorei as dicas das cores. Massa!
Google PageRank
Conteúdo Duplicado
- 2D
- 3D
- Adobe
- Apple
- Áudio
- Book & E-book
- Cinema
- Continuação
- Curso de Photoshop
- Cursos pela Internet
- Dicas
- e-learning
- Edição de Vídeo
- Fórum (2002-2005)
- Filmes - Making of
- Firefox
- Flash Catalyst
- Fotografia Digital
- Galeria de Imagens
- GIMP
- Ilustração
- Intel
- Linux
- Livro
- Microsoft
- Montagem de Fotos
- Nikon
- Pinnacle Studio
- Pixar
- Servidor Apache
- Software
- Tecnologias
- Tutoriais
- Ubuntu
- Vídeos
- Vídeos iPod
- Web
- Wordpress
- Yahoo!
- YouTube
ddddddd
- 2020: J - - - - - - - - - - D
- 2019: - - - - - - - - S - - -
- 2018: J - - - - - - - - - - -
- 2017: - - - - - - - - S - - -
- 2014: J - - - M - J - - - - -
- 2013: - - - A M - - - - - N -
- 2012: - F M - M - - A - - - -
- 2011: - - M A - - - - - O N -
- 2010: J - - A - J - - - - - -
- 2009: J F M A M J J A S O N D
- 2008: J F M A M J J A S O N D
- 2007: J F M A M J J A S O N D
- 2006: - F M - - J J A S O N D
- 2005: J - M - - J J - - - - -
- 2004: - F M A M J - - S - N D
- 2003: J F M A M J J A S O N D
- 2002: - - - - - - - - - - N D