CSS no Lanche

Você já experimentou procurar no Google por do a barrel roll? Ainda não? Então procure e veja o que acontece, mas pelo menos faça isso com um browser descente né, nesse seu Internet Explorer 6 não será possível ver o efeito.

Traduzindo ao pé da letra, ‘do a barrel roll’ é um termo que significa algo como “Dê uma cambalhota”. A expressão é uma manobra aérea que existe desde os primeiros combates entre aviões na Primeira Guerra Mundial, mas o termo só se tornou popular a partir do jogo Star Fox, do Nintendo 64. A manobra era obtida com um clique duplo nos botões “Z” e “R”. Já o Google querendo prestar então uma homenagem, implementou esse efeito em sua busca. Abaixo você pode ver o CSS responsável por fazer isso:

@-moz-keyframes roll { 100% { -moz-transform: rotate(360deg); } }
@-o-keyframes roll { 100% { -o-transform: rotate(360deg); } }
@-webkit-keyframes roll { 100% { -webkit-transform: rotate(360deg); } }

body.barrel-roll {
-moz-animation-name: roll;
-moz-animation-duration: 4s;
-moz-animation-iteration-count: 1;
-o-animation-name: roll;
-o-animation-duration: 4s;
-o-animation-iteration-count: 1;
-webkit-animation-name: roll;
-webkit-animation-duration: 4s;
-webkit-animation-iteration-count: 1;
}

E com um pouco de JavaScript, nós podemos fazer o negócio funcionar facilmente:

if(location.href.match('do-a-barrel-roll')){ //Checa se a URL contém o texto do a barrel roll
    setTimeout("document.getElementsByTagName('body')[0].className='barrel-roll';", 3000);
}

Vi aqui e aqui.