Demonstrativo: Background animado em CSS3, com loop infinito, de Super Star Socker Deluxe
Você já jogou o International Super Star Soccer Deluxe do Super Nintendo? Sabia que é possível criar um background animado idêntico ao do game para o seu site? Eis aqui a demonstração do background animado do game, feita 100% em CSS3, você poderá utilizar a animação com loop em qualquer site, tudo isso com aquele toque de nostalgia que nenhum outro game de futebol além do International Super Star Soccer Deluxe (Um clássico do Super Nintendo) possui.
A animação é extremamente leve para os recursos da máquina do servidor, por utilizar um arquivo de imagem simples que é multiplicado na tela, não existe nenhum JavaScript e nada de HTML5 com SVG, apenas CSS3 e algumas modificações no HTML, por que a gente ainda precisa da música né? Cadê a graça do negócio sem aquela música icônica 😉.
Quer um tutorial? Vamos fazer o seguinte: se houver 20 comentários no post, eu crio um passo-a-passo, preciso ter o interesse das pessoas primeiro, se não não tem graça. 😉
Divirta-se:
Devido às políticas de Autoplay do navegador, pode acontecer do áudio não reproduzir sozinho, nesse caso você deve clicar dentro da área do Result e depois clicar no botão Rerun, para que a música reproduza. Infelizmente isso está fora do meu controle, já que é o navegador de internet que decide isso.
See the Pen Infinite Slideshow by 6146514 (@275845) on CodePen.
Por Matheus Lopes