Animação de entrada do elementor: 70 efeitos de rolagem para qualquer elemento
Primeiras impressões stick. Em vez de deixar seu conteúdo apenas aparecer, faça-o chegar O Entrada Animação a extensão, parte do Master Addons Pro, adiciona movimento a qualquer elemento Elementor no momento em que ele aparece, com 70 efeitos para escolher entre: fades, slides, máscaras, rotações, zooms, flips, pulsos e saltos Você define a duração, atraso, flexibilização e contagem de repetições, para que um título possa entrar suavemente enquanto uma linha de ícones de recursos aparece um após o outro. Sem CSS, sem quadros-chave, apenas algumas configurações na guia Avançado.
Use-o bem e uma animação de entrada puxa o olho para baixo da página e faz o site se sentir vivo no primeiro pergaminho Use-o em tudo e ele se transforma em ruído O vídeo abaixo cobre o básico, e mais abaixo EU entro na lista de efeitos completos, como aplicar uma animação em toda uma seção, e como obter o tempo certo.
O que é uma animação de entrada?
Uma animação de entrada é o movimento que um elemento faz ao entrar na tela O visitante rola, um título ou imagem ou botão atinge a janela de visualização, e ela desaparece, desliza ou salta no lugar em vez de ter estado sentado lá o tempo todo Você os verá chamados efeitos de entrada, animações de rolagem ou uma animação de entrada do site A mesma ideia a cada vez: uma página estática que começa a reagir à medida que você a desce.
Você mesmo pode escrever tudo isso com animações CSS Então os quadros-chave são seus para manter, e assim é o comportamento responsivo em cada tamanho de tela Os Complementos Mestres kit de ferramentas de animação move isso para as configurações do elemento, para que você escolha um efeito de um menu suspenso e pule o código.
Uma biblioteca de 70 efeitos de entrada
Com 70 predefinições, há uma maneira adequada de introduzir quase qualquer seçãoQuer quieto? desvanece-se. Quer energia? salta dentro ou Jack na caixa Depois de algo mais deliberado? flip in ou máscara de. Essa propagação permite que você dê seções seu próprio caráter: calmo e suave para uma declaração de missão, um pouco brincalhão para a linha de recursos.
- Desaparece: Fade In, mais Up, Down, Left e Right com variações numeradas, para chegadas tranquilas.
- Slides e máscaras: Deslize e mascarar em todas as quatro direções.
- Rotações e inversões: Gire em direção a cada canto e vire para cima, para baixo, para a esquerda e para a direita.
- Zooms e escalas: Ampliar, aumentar a escala e diminuir a escala, cada um com variações.
- Efeitos de atenção: Pulse In, Pulse Out, Shake, Bounce In e Jack In the Box para um herói ou um CTA.
- Combine o efeito com o trabalho: os altos em um apelo à ação, um suave desbotamento no corpo do texto.
- Visualize antes de se comprometer: o editor reproduz o efeito assim que você o escolhe.
Controle de duração, atraso e facilidade
O tempo é onde a maioria das animações são ganhas ou perdidas, e isso é mais do que uma alternância liga/desliga. Defina o Duração em milissegundos para fazer um movimento rápido e rápido ou lento e prolongado. Adicione um Atraso portanto, uma fileira de itens vem um após o outro, em vez de todos de uma vez. Escolha um Facilitação curve-se para que o movimento acelere e desacelere da maneira que um objeto real faria, em vez de deslizar em um ritmo plano e robótico.
- Defina a velocidade: 500 ms sente rápido, 1500 ms sente relaxado Esse número muda todo o humor.
- Acerte uma sequência: aumente o atraso em cada ícone consecutivo e eles aparecerão um por um.
- Escolha a flexibilização: Ease-Out (início rápido, parada suave) lê como natural para a maioria das entradas É aquele que EU alcancei primeiro.
- Repita: A contagem repetida reproduz o efeito de 1 a 5 vezes ou em loop.
Animação de entrada integrada do Elementor vs Master Addons
Elementor já permite escolher uma animação de entrada gratuitamente em Advanced, Motion Effects. Isso é bom para um simples fade A extensão Master Addons é para páginas onde você deseja um controle mais preciso sobre como cada elemento chega.
| Efeitos de movimento do elementador | Animação de entrada Master Addons | |
|---|---|---|
| Plano | Grátis | Master Addons Pro |
| Duração | Lento, Normal ou Rápido | Qualquer valor em milissegundos |
| Atraso | Milissegundos | Milissegundos |
| Facilitação | Não disponível | 30 curvas, de Linear a Back In Out |
| Repita a contagem | Não disponível | 1 a 5 vezes, ou infinito |
| Efeito diferente por dispositivo | Sim | Não, uma configuração para todos os pontos de interrupção |
| Efeitos | Predefinições elementadoras | 70 efeitos, incluindo máscaras, flips e pulsos |
Como definir uma animação de entrada padrão para todos os elementos?
As pessoas perguntam muito sobre isso: você pode aplicar uma animação de entrada para tudo de uma vez no Elementor? resposta direta, Elementor core não tem um único switch global que anima cada elemento no site O que funciona na prática é animar no nível do contêiner ou seção, em seguida, reutilizar essas configurações.
- Selecione o secção ou contentor em vez de cada widget dentro dele Abra Avançado → Master Addons Entrada Animação e escolha o seu efeito O bloco inteiro, em seguida, chega junto como ele rola para dentro.
- Para reutilizar o mesmo movimento, clique com o botão direito no elemento, clique em Copiar, então Estilo Pasta na próxima seção As configurações de animação andam junto com o estilo, então você o define uma vez e o cola na página.
- Para uma cascata em vez de tudo disparando junto, mantenha o efeito o mesmo e aumente o Atraso um pouco em cada seção à medida que você desce.
Isso proporciona uma animação de entrada consistente em todos os seus elementos sem tocar no código, que é o mais próximo de um padrão fornecido pelo Elementor.
Onde as animações de entrada mais ajudam?
- Seções de heróis: um Fade In Up no título e, em seguida, um pequeno atraso no botão abaixo dele.
- Linhas de recursos: escalonar os ícones para que eles pousem um por um.
- Estatísticas e contadores: um zoom à medida que os números são visualizados.
- Depoimentos e logotipos: um desbotamento suave para que eles não se encaixem abruptamente.
- Chamadas à ação: um Bounce In ou Jack In the Box no ponto em que alguém decide.
Entrance Animation faz parte de Master Addons Pro. Para movimento além do primeiro pergaminho, observe Efeitos Flutuantes, Revelar e Transforma, ou navegue por completo Recursos de animação Master Addons.
Perguntas frequentes para animação de entrada
Muitas animações de entrada irão desacelerar meu site?
Em uma página com dezenas de elementos animados pode adicionar algum peso, mas os efeitos são leves para começar A verdadeira correção é a contenção: animar as seções-chave e manchetes, não todos os parágrafos Alguns bem colocados mal se registram Se o tempo de carregamento está em sua mente, estes dicas para acelerar sites Elementor ajuda.
Por que minha animação de entrada do Elementor não está funcionando?
Geralmente é uma das três coisas A animação só dispara na primeira vez que o elemento entra na janela de visualização, então role para baixo fresco para testá-lo em vez de rolar de volta para cima Certifique-se de que o efeito está no elemento real e não um wrapper vazio em torno dele E limpe seu plugin de cache depois de publicar, já que uma página em cache servirá a versão antiga sem a animação.
Posso usar animações diferentes no desktop e no celular?
Não com esta extensão Suas configurações se aplicam em cada ponto de interrupção, então escolha um efeito que ainda pareça certo em uma tela pequena A animação de entrada do próprio Motion Effects da Elementor pode ser definida por dispositivo, o que ajuda se um layout de telefone precisar de algo mais calmo.
Como isso é diferente das animações de entrada do próprio Elementor?
O editor gratuito da Elementor tem um controle básico de Animação de Entrada sob Advanced, Efeitos de Movimento, com uma duração predefinida e um atraso Esta extensão faz parte do Master Addons Pro e dá-lhe 70 efeitos, duração e atraso em milissegundos, 30 curvas de flexibilização e uma contagem de repetição Para o ritmo, Ease Out se adequa à maioria das entradas.
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
