Efeitos rápidos com Javascript

Antes de mergulharmos no tema, vejamos alguns exemplos de códigos simples de grande utilidade.

Por Miguel Angel Alvarez - Tradução de JML


Publicado em: 17/7/05
Valorize este artigo:
Antes de aprofundarmos na matéria podemos ver uma série de efeitos rápidos que podem se programar com Javascript. Isto pode nos dar uma idéia mais clara das capacidades e da potência da linguagem que que sera bom para termos uma idéia mais exata do que é Javascript na hora de percorrer os capítulos seguintes.

Abrir uma janela secundária

Primeiro vamos ver que com uma linha de Javascript podemos fazer coisas bastante atrativas. Por exemplo, podemos ver como abrir uma janela secundáaria sem barras de menus que mostre o buscador Google. O código seria o seguinte.

<script>
window.open("http://www.google.com","","width=550,height=420,menubar=no")
</script>


Podemos ver o exemplo em funcionamento aqui.

Uma mensagem de boas vindas

Podemos mostrar uma caixa de texto emergente ao terminar de se carregar o portal de nosso web site, que poderia dar as boas vindas aos visitantes.

<script>
window.alert("Bem-vindo ao meu website. Obrigado...")
</script>


Podemos ver o exemplo em uma página a parte.

Data atual

Vejamos agora um simples script para mostrar a data de hoje. Às vezes é muito interessante mostra-la nas webs para dar um efeito de que a página está "em dia", ou seja, que está atualizada.

<script> document.write(new Date()) </script>

Estas linhas deveriam ser introduzidas dentro do corpo da página no lugar onde quisermos que apareça a data da última atualização. Podemos ver o exemplo em funcionamneto aqui.

Nota: Um detalhe a destacar é que a data aparece em um formato um pouco raro, indicando também a hora e outros atributos da mesma, mas logo aprenderemos a obter exatamente o que desamos no formato correto.


Botão de voltar

Outro exemplo rápido pode ser visto a seguir. Trata-se de um botão para voltar atrás, como o que temos na barra de ferramentas do navegador. Agora, veremos uma linha de código que mistura HTML e Javascript para criar este botão que mostra a página anterior no histórico, se é que existe alguma.

<input type=button value=Atrás onclick="history.go(-1)">
O botão seria parecido ao seguinte. Podemos clica-lo para ver seu funcionamento (deveria nos lever para a página anterior).

Como diferença com os exemplos anteriores, temos que destacar que neste caso a instrução Javascript se encontra dentro de um atributo de HTML, onclick, que indica que essa instrução tem que ser executada como resposta ao clique do botão.

Foi possível comprovar a facilidade com a qual podem se realizar algumas ações interessantes, existiriam muitas outras amostras que nos reservamos para capítulos posteriores.





Comentários do artigo
Foi enviado 1 comentário ao artigo
1 comentário não revisado
0 comentários revisados

Usuários :    login / registro

Categorias relacionadas
O autor

Home | Sobre nós | Copyright | Anuncie | Entrar em contato