jQuery: Como evitar problemas com animate()

Postado por: Pedro Rogério em

Você provavelmente já deve ter passado por esse tipo de problema utilizando o framework jQuery para fazer animações nos elementos de sua página, o problema ocorre principalmente quando se deseja criar menus animados, onde através da função animate() da jQuery ao passar o mouse rapidamente pelo menu, o efeito pode ser executado ainda diversas vezes mesmo após você retirar o mouse.

Para que fique claro a natureza do problema, basta você acessar esse exemplo criado e experimente passar o mouse rapidamente diversas vezes encima do menu. Você verá que mesmo após retirar o mouse, o efeito de animate() ainda é executado.

Observe abaixo o código JavaScript com a utilização da jQuery para o efeito do menu:

$(document).ready(function() {
	$('ul.anim_queue a')
		.hover(function() {
		$(this).animate({ left: 20 }, 'fast');
		},function(){
		$(this).animate({ left: 0 }, 'fast');
	});
});

Para evitar esse problema indesejável, basta utilizar a função stop(). Agora vamos ao código final sem problemas de animação:

$(document).ready(function() {
	$('ul.anim_queue a')
		.hover(function() {
		$(this).stop().animate({ left: 20 }, 'fast');
		},function() {
		$(this).stop().animate({ left: 0 }, 'fast');
	});
});

Agora observem o exemplo com o código corrigido. Como você pode ver, a animação só ocorre uma vez, mesmo após você passar rapidamente o mouse sobre o menu, evitando assim o problema anterior.

Esse post foi escrito com base no artigo original de Brandon Aaron

SEO – Google agora segue links JavaScript

Postado por: Pedro Rogério em

Durante a conferência Google I/O eles fizeram alguns anúncios importantes que passaram despercebidos para algumas pessoas. Algumas pessoas andavam desconfiadas que o Google estava seguindo links JavaScript, mas ninguém até então havia efetuado testes concretos para saber se isso era verdade ou não.

Mas esse novo feito foi revelado por Vanessa Fox de que o Google a partir de agora estaria seguindo links que não seguem os padrões web.

O Google a partir de agora é capaz de acessar o evento onClick na maioria das tags HTML. Caso o evento onClick chame uma função, e em seguida a URL, o GoogleBot só pode interpretá-la se o script faz parte da página, ao invés de um script externo.

Alguns exemplos de código que o GoogleBot pode executar são os seguintes:

    <div onclick="document.location.href='http://foo.com/'"></div>
    <tr onclick="myfunction('index.html')"><a href="#" onclick="myfunction()">new page</a></tr>
    <a href="javascript:void(0)" onclick="window.open('welcome.html')">open new window</a>

Mais informações você pode ver em: JavaScript Links Now Passing PageRank & Anchor Text

Páginas:«123