image

Access unlimited bootcamps and 650+ courses forever

75
%OFF
Article image
Daniela Segadilha
Daniela Segadilha22/09/2023 12:13
Share

Parallax effect

    Pra quem não conhece o efeito parallax, essa é a definição dele:

    O efeito parallax na programação acontece quando elementos na tela de um computador se movem a diferentes velocidades. Isso cria a ilusão de profundidade e faz com que alguns objetos pareçam mais próximos do que outros, assim como a árvore na janela do carro. Por exemplo, em um jogo de computador, você pode ter um personagem na frente e um fundo com montanhas. O personagem se moverá mais rápido na tela do que as montanhas ao fundo. Isso cria a sensação de que o personagem está mais perto de você do que as montanhas.

    Nos sites o efeito parallax pode dar um aspecto mais profissional e dinâmico ao seu layout e melhorar a experiência do usuário, se usado de maneira correta.

    Por isso resolvi deixar com vocês um site que encontrei uma vez com 26 exemplos de efeitos parallax ( porque existe do mais simples ao mais avançado), onde o site conta com as demos e o código feito para quem quiser usar: https://freefrontend.com/css-parallax/

    A foto da capa do artigo é de um demo de efeito parallax com sensação de profundidade no eixo Z, quando o mouse se move, a imagem também se move em todos os eixos. É um dos tipos que eu mais gosto, ele está no site acima, mas vou deixar um link diretamente pra ele, fica mais fácil de vocês verem: https://codepen.io/dazulu/pen/VVZrQv

    Share
    Recommended for you
    CI&T - Backend com Java & AWS
    CAIXA - Inteligência Artificial na Prática
    Binance - Blockchain Developer with Solidity 2025
    Comments (0)