Front End

28 ago, 2015

Aprenda a criar o efeito Parallax com CSS3, HTML5 e JS

Publicidade

Seja você amante de SuperMario ou de League of Legends, com certeza já percebeu um dos efeitos mais conhecidos dos jogos: o efeito Parallax. O Parallax nada mais é do que um efeito de imersão criado nos games e também no desenvolvimento web, que gera uma ilusão de profundidade de campo quando nossos olhos estão focadas em um ponto óptico, ou seja, usando várias layers sobrepostas se movendo em velocidades distintas, conseguimos enganar nossos olhos gerando um aspecto de profundidade, o que muitas vezes pode enriquecer a experiência de navegação e gerar resultados incríveis.

Hoje, iremos aprender justamente a criar este espetacular efeito. Sem utilizar plugins, sem gerar dor de cabeça e dando algumas dicas especiais, vamos simular o efeito Parallax com algumas imagens.
Está preparado para esta imersão? Se estiver, aperta o play que tem coisa boa na tela! 😉

Os arquivos podem ser baixados neste link.

Sites:

Plugins: