Função para abertura de pop-up
Esta é uma função simples que criei tem algum tempo e utilizo sempre que preciso abrir algum tipo de Janela em formato pop-up.
Eu poderia utilizar uma função específica para cada tipo de pop-up, mas pesem: Se um site tiver links para abrir 5 pop-ups, seria 5 códigos diferentes, ou seja, como resultado o dódigo da página seria maior e a necessidade de ampliar a bande de acesso ao site poderia aumentar.
A função:
<script type=”text/javascript”>
function abre(caminho,largura,altura,rolagem){
w = largura;
h = altura;
rol = rolagem;
largura = screen.width;
altura = screen.height;
XX = (largura-w)/2;
YY = (altura-h)/2;
janela = window.open(caminho,nm_janela, ‘width=’+w+’, height=’+h+’, left=’+XX+’, top=’+YY+’menubar=no, toolbar=no,status=no,scrollbars=’+rol+’,');
janela.focus(); }</script>
Vamos ver linha a linha como funciona.
Linha 1
function abre(caminho,nm_janela,largura,altura,rolagem){
Esta linha é onde se inicia a função, ou seja, é o nome da função e as variáveis que ela utiliza (caminho,largura,altura,rolagem).
As linhas 2, 3 e 4, nestas linhas eu coloco o conteúdo das variáveis que eu recebi via função em uma variáel que com um nome de minha preferência. Não há a necessidade de iniciar essas variáveis, uma vez que eu poderia usar os nomes que vem entre os parênteses, mas a títuli de clareza das informações, eu prefiro utilizar.
As Linhas 5 e 6 iniciam as variáveis largura e altura com o tamanho da tela de pessoa que está acessando o site utiliza. ex. 1024×768 px
Linhas 7 e 8, estas linhas são a chave para que a pop-up seja aberta centralizada na tela. É iniciada as variáveis XX e YY com a largura(altura) – a largura(altura) que você enviou via função w(h) e divide por 2.
Linha 9 inicia a veriável que abrirá a pop-up, mais uma vez, eu não precisaria iniciar a variável, bastaria que eu escrevesse o caminho depois do igual, mas para deixar o código claro, prefiro iniciar a variável.
window.open = abre a janela
caminho, esta é a variável recebida via função. Ex. “www.leandrogarcia.com/blog”
nm_janela, está é uma outra variável reebida pela função que diz qual é o nome da Janela, é o que dirá se você clicar em um outro link com esta função se deve abrir a nova página na Janela já aberta ou em uma nova. Ex. nm_janela = um, abre uma Janela; segundo clique, nm_janela = um, abre por cima da outra janela. nm_janela = dois, abre uma nova janela
width=’+w+’, é a largura da Janela
height=’+h+, é a altura da Janela
left=’+XX+’, é onde o browser entede que deve centralizar a abertura da Janela horizontalmente
top=’+YY+’, é onde o browser entede que deve centralizar a abertura da Janela verticalmente
menubar=no,toolbar=no,status=no, diz ao browser para não exibir a barra de menus, de ferramentas e a barra de status.
scrollbars=’+rol+’, diz ao rowser se haverá barra de rolagem, yes, no e auto (eu defini como variável da função, pois posso dizer se vai ou não ter barra de rolagem, mas poderia ter iniciado com yes, no ou auto.
e por último, janela.focus(); é onde o browser recebe a ordem de excutar a variável janela
Legal, coloquei esta função no meu site, como eu faço para executála?
Simples, você chama ela via link. Ex. <a href=”javascript:abre(‘http://www.leandrogarcia.com/blog’,'blog do Garcia’,’500′,’500′,’no’);”>Abrir Janela</a> ou, <a href=”#” onClick=”abre(‘http://www.leandrogarcia.com/blog’,'blog do Garcia’,’500′,’500′,’no’);”>Abrir Janela</a>
A função descrita deve ser colada entre as tags <head> e </head> do seu html, ou chamada externamente, mas isso deixa pra uma outra hora.
Espero que esta Função Ajude.
Enviado por: leandro garcia - Categoria(s): JavaScript Tags relacionadas: Java Script, JavaScript, Window.Open