Efeito de Paralaxe Elementor com Rellax.js (Pro)
Rellax é uma extensão Master Addons Pro que traz a biblioteca de paralaxe Rellax.js para Elementor, Ligue-o para um elemento, defina uma Velocidade de -10 a 10, e esse elemento rola mais rápido ou mais devagar do que o resto da página, o que cria uma sensação de profundidade Você pode definir uma velocidade diferente para tablet e celular, escolher a direção vertical ou horizontal e usar o Índice Z para manter as camadas em movimento atrás ou na frente do seu conteúdo Nenhum carregamento de código ou script é necessário.
Como adicionar um efeito de rolagem de paralaxe no elementor
Você precisa do Elementor e de um ativo Master Addons Pro licença.
- Ir para Complementos Mestres, Extensões, ligue o Rellax e salve.
- Edite sua página com o Elementor e selecione o widget que deseja mover, como uma imagem, ícone ou forma.
- Abra as configurações do Rellax para esse elemento e ligue Habilitado Rellax.
- Defina uma velocidade, por exemplo -2 para uma deriva lenta, e ajuste-a para tablet e celular.
- Escolha Vertical ou Horizontal e defina Índice Z para que a camada não cubra seu texto.
- Visualize a página e role para verificar o movimento.
Mais detalhes estão no Configurações da extensão Rellax.
Velocidade, Porcentagem e Direção
Velocidade corre de -10 a 10 em passos de 0,1 e pode ser definido por dispositivo Valores negativos fazem o elemento se mover mais devagar do que a página, então ele se sente mais longe, e valores positivos o movem mais rápido, então ele se sente mais perto. Percentagem (0 a 1) define onde o elemento fica quando seu movimento começa, e o Vertical e Horizontal opções escolher a direção.
- Um desvio lento de -1 a -2 para formas decorativas atrás de um herói.
- Uma pequena velocidade positiva para ícones flutuantes na frente do conteúdo.
- Uma velocidade menor ou 0 no celular se o movimento parecer muito forte em telas pequenas.
Camadas com índice Z
Camadas de paralaxe podem deslizar sobre texto e botões Rellax adiciona a Índice Z configuração de -1 a 50, para que você possa manter uma camada de fundo em movimento abaixo do seu conteúdo e uma forma de primeiro plano acima dele Rellax move todo o elemento, não sua imagem de fundo, então coloque a imagem que você deseja mover em seu próprio widget Imagem.
- Use -1 para camadas que devem ficar atrás do conteúdo.
- Mantenha as manchetes e os botões fora do caminho das camadas móveis.
- Teste o pergaminho em um telefone real antes de publicar.
Elementor Motion Effects vs Master Addons Rellax
Elementor Pro já tem Efeitos de Movimento com efeitos de rolagem Aqui é como os dois se comparam.
| Característica | Elementor Pro Motion Efeitos | Mestre Addons Rellax |
|---|---|---|
| Preço | Precisa do Elementor Pro | Precisa de Master Addons Pro |
| Movimento Scroll | Rolagem vertical e horizontal com velocidade e faixa de janela de visualização | Velocidade de Rellax.js de -10 a 10, vertical ou horizontal |
| Outros efeitos de rolagem | Transparência, desfoque, gire e dimensione | Nenhum, apenas movimento |
| Efeitos rato | Faixa de mouse e inclinação 3D | Não |
| Paralelaxe de fundo | Efeitos do movimento de fundo em seções e recipientes | Move o elemento inteiro |
| Configurações por dispositivo | Escolha dispositivos onde os efeitos são executados | Velocidade por dispositivo |
Se você já tem Elementor Pro, Motion Effects cobre mais tipos de efeito Rellax se adequa a camadas simples baseadas em velocidade quando você usa Master Addons Pro. Para o movimento em loop que não depende de rolagem, consulte Efeitos Flutuantes (Pro).
O que é Rellax.js?
Rellax.js é uma pequena biblioteca JavaScript de código aberto de Dixon e Moe que faz os elementos se moverem a uma velocidade diferente enquanto uma página rola Em um site codificado manualmente você adiciona o script, dá aos elementos uma classe rellax e define opções como velocidade, porcentagem, índice z e direção no código.
Esta extensão agrupa Rellax.js dentro do Master Addons Pro e mapeia essas opções para controles Elementor, então você define Velocidade, Porcentagem, Índice Z e direção do painel O script carrega apenas em páginas onde um elemento usa Rellax Se você não estiver no Elementor, use a biblioteca Rellax.js diretamente.
Perguntas frequentes sobre Rellax
O efeito de paralaxe funcionará no celular?
Sim. velocidade pode ser definida separadamente para tablet e celular, então você pode usar um valor menor ou 0 em telefones se o movimento parece muito forte Sempre teste em um dispositivo real.
Posso fazer uma seção da imagem de fundo se mover?
Rellax move todo o elemento, não uma imagem de fundo Coloque a imagem em seu próprio widget de imagem atrás do seu conteúdo e adicione Rellax a esse widget, ou use os efeitos de movimento de fundo do Elementor Pro para um fundo de seção móvel.
A extensão Rellax é gratuita?
No. Rellax faz parte Master Addons Pro. A própria biblioteca Rellax.js é gratuita e de código aberto se você adicioná-la com seu próprio código.
Muitos efeitos de paralaxe podem retardar meu site?
Eles podem. Cada elemento em movimento faz com que o navegador faça mais trabalho durante a rolagem Use paralaxe em alguns elementos-chave por página e mantenha as velocidades modestas.
Widgets e extensões de elementos de tendência
Construa sites sofisticados em menos tempo.
Glassmorphismo
Contêiner Extras
Padrões
![Extensão Master Addons Post/Page Duplicator para Elementor: MA Link de linha Duplicator na lista de páginas WordPress criando uma página de destino - rascunho [duplicado #128]](https://d1asvmc6qcowgk.cloudfront.net/wp-content/uploads/2026/09/15102930/post-page-duplicator-768x403.webp)
Duplicador de postagem/página
