Tag Archives: settimeout

Javascript: Shake Text

shake.jpg

Mais um exemplo em Javascript, agora uma função, creio que conhecida por muitos já, que tem a finalidade de embaralhar o texto contido em uma tag qualquer (embaralhar o texto após passar o mouse por cima).

Há duas maneiras de usá-la, uma aplicando em apenas uma tag o evento, e a outra, aplicando o evento a todas os elementos de mesmo “tag name”.

Ex:

shakeAll('h2');

...

<h3 onmouseover="shake(this)"></h3>

clique aqui para visualizar

Javascript: setTimeout() e setInterval()

Ver post no novo domínio: http://rogeriolino.com/2006/12/19/javascript-settimeout-e-setinterval/

São duas funções interessantes do Javascript, com elas podemos definir um intervalo de tempo que um evento irá acontecer.

A sintaxe das duas funções é idêntica. O que muda é como agem.

Sintaxe:

window.setTimeout(‘funcao()’, intervalo_em_milisegundos);
window.setInterval(‘funcao()’, intervalo_em_milisegundos);

As duas funções irão chamar uma segunda função passada por parâmetro no intervalo determinado também por parâmetro.

Sendo a setTimeout() chamando a função uma única vez. Enquanto a setInterval() chama a função “infinitamente” sempre no mesmo intervalo de tempo.

Para pausar a função usa-se clearInterval(). Passando como parâmetro o nome do seu intervalo.

Ex:

var intervalo = window.setInterval(lerolero, 1000);
function lerolero() {
window.alert(“Popup”);
}
clearInterval(intervalo);

Juntando as duas funções podemos “brincar” fazendo por exemplo um script que simula um sorteio.

Ex:

var intervalo = window.setInterval(function() {
<funcao>
}, 50);
window.setTimeout(function() {
clearInterval(intervalo);
}, 3000);

Explicando: A setInterval() vai executar o que for definido dentro de uma função passada como parâmetro em 50 em 50 milisegundos. Isso durante 3000 milisegundos (3 segundos), que é o tempo definido na setTimeout() para entrar na função que pausa a setInterval.

Deu pra entender né? Veja o script um pouco mais incrementado em funcionamento aqui.

Você pode usar setInterval() para fazer um relógio também. Agora é só deixar com a criatividade de cada um.

mais sobre:

http://javascript.about.com/library/blstvsi.htm

http://www.w3schools.com/js/js_timing.asp