3D Card Hover Effect

Efeito 3D no cartão usando JavaScript

Essa semana me desafiei desenvolver uma página simples com efeito 3D. O resultado pode ser conferido neste link: aqui.

No HTML:

utilizei a metodologia BEM para manter as classes organizadas;
trabalhei a questão da semântica.

No CSS:

usei o Sass como pré-processador. Descobri que BEM e Sass formam uma grande dupla;
realizei pequenas animações com keyframe;
responsividade? Temos!

No JavaScript:

manipulei o DOM.
No efeito 3D aprendi a usar algumas propriedades como innerHeight, innerWidth, pageY, pageX. De quebra, descobri que para mobile, é preciso usar o touch events

O layout foi todo desenvolvido no Figma.