Problema:
Você tá lá fazendo sua pag. e pensa em botar um efeito em jQuery na pag para quando o usuário clicar em um link ele dar um fade no body e depois levar o usuário para a outra pag.
$(document).ready(function(){
$("a").click(function(e){
e.preventDefault();
var link = $(this).attr("href");
$("body").fadeOut(1000,function(){
window.location = url;
});
})
});
Como diria nosso amigo Jack "Ô Estripador": Vamos por partes mwahahaha...
Linha 1: O argumento passado para a nossa função anônima (e) recebe o evento do click sobre o link.
Problema:
Mas peraí, se quando o carinha lá clickar no link ele não será direcionado automaticamente para a outra pag. sem q ele veja o lindo efeito?
Linha 1: O argumento passado para a nossa função anônima (e) recebe o evento do click sobre o link.
Problema:
Mas peraí, se quando o carinha lá clickar no link ele não será direcionado automaticamente para a outra pag. sem q ele veja o lindo efeito?
Solução: Agora vem a manha
Linha 3: o método preventDefault() que o evento perca sua funcionalidade original, ou seja, que o browser leve o nosso amado usuário automaticamente para a outra pag.
Linha 3: o método preventDefault() que o evento perca sua funcionalidade original, ou seja, que o browser leve o nosso amado usuário automaticamente para a outra pag.
Linha 4: Armazenando o endereço do link
a var url = $(this).href("href") deve explicar-se por si só, ela armazena o valor do atributo href do link em questão.
a var url = $(this).href("href") deve explicar-se por si só, ela armazena o valor do atributo href do link em questão.
Linha 5:
Nosso tão falado e desejado efeito, que estará futuramente a seu critério. Assim sendo, após 1s de pura emoção do nosso usuário e ao fim da animação o jQuery chamará o callback da função que executará a
Linha 6:
window.location é a variável quem armazena o endereço da janela atual, alterando agora o valor da mesma para o valor da variável url levará o usuário para a outra pag.
Nosso tão falado e desejado efeito, que estará futuramente a seu critério. Assim sendo, após 1s de pura emoção do nosso usuário e ao fim da animação o jQuery chamará o callback da função que executará a
Linha 6:
window.location é a variável quem armazena o endereço da janela atual, alterando agora o valor da mesma para o valor da variável url levará o usuário para a outra pag.
Fim
