header-logo
Primeiros passosConfira como você pode usar o Wix para criar seu site e seu negócio. Personalize seu site usando templates ou contrate um profissional para criar ou aprimorar sua presença online.
Crie o seu siteAprenda a usar o Editor Wix e a gerenciar o conteúdo de seu site. Descubra como proteger a privacidade de seus visitantes e tornar seu site acessível.
Conta e faturamentoRevise as configurações da sua conta, gerencie suas assinaturas e planos Premium e entenda suas faturas.
Use os apps mobile do WixUse o app Wix Owner para administrar seu negócio com eficiência, interagir com seus visitantes e criar uma comunidade.
Conecte um domínioEntenda como comprar, conectar ou transferir um domínio e como manter os dados do seu site seguros.
Gerencie o seu negócioEncontre as ferramentas certas para criar e expandir seus negócios: aceite pagamentos, analise suas estatísticas, conecte-se com visitantes e muito mais.
Promova o seu siteConfira como promover seu site nos motores de busca, enviar campanhas de email e veicular anúncios pagos.
Wix Studio, Parceiros e empresasTire o máximo proveito da sua conta do Wix Studio, Parceiro Wix ou Wix Empresarial, para que você possa expandir seus negócios.
AjudaObtenha informações sobre como resolver os problemas técnicos e de desempenho do seu site. Além disso, acompanhe os próximos recursos em nosso roadmap de produtos.
placeholder-preview-image
Wix LearnDomine novas habilidades com nossos cursos e tutoriais.
Blog do WixConfira nossas dicas de web design, marketing e mais.
Learning Hub de SEOAumente o tráfego orgânico vindo dos motores de busca.
Website developmentDesenvolva um site único com a nossa plataforma full-stack.
Contrate um profissionalAlcance seus objetivos com a ajuda de um especialista.
placeholder-preview-image

Editor do Wix Studio: adicionar uma animação em loop

Neste artigo
  • Adicionar uma animação em loop
  • Personalizar uma animação em loop
  • Remover uma animação em loop
Crie uma sensação de movimento em seu design com animações que se repetem continuamente. Você pode adicionar uma animação em loop a qualquer elemento que deseja que atrair a atenção dos visitantes. Algumas são mais sutis e outras chamam mais atenção.
O que acontece com as animações em diferentes breakpoints?
Ao adicionar uma animação no breakpoint do desktop, ela é replicada para os breakpoints menores. No entanto, você pode definir uma animação diferente ou personalizar a mesma animação em cada breakpoint.  
Vá para a Wix Studio Academy (em inglês) para conferir webinars, tutoriais e cursos adicionais do Wix Studio.

Adicionar uma animação em loop

Você pode adicionar uma animação em loop a elementos e seções específicos ou à página do site como um todo.

Adicionar uma animação em loop

  1. Selecione o elemento relevante.
  2. Clique no ícone Abrir inspetor  no canto superior direito do editor.
Uma captura de tela do painel Inspetor no Editor do Wix Studio.
  1. Clique na aba Animações e efeitos .
  2. Clique em + Adicionar abaixo de Loop.
  3. Selecione uma animação da lista.
    Dica: passe o mouse sobre as animações para ver como elas ficam. 
Um GIF mostrando as animações em loop disponíveis e como passar o mouse sobre elas para visualizar

Personalizar uma animação em loop

Depois de escolher uma animação, configure-a para se comportar da maneira que você deseja. Escolha quanto tempo dura a animação, defina a intensidade, adicione um atraso entre as repetições e mais. 

Para personalizar uma animação em loop:

  1. Selecione o elemento relevante.
  2. Clique no ícone Abrir inspetor  no canto superior direito do editor.
Uma captura de tela do painel Inspetor no Editor do Wix Studio.
  1. Clique na aba Animações e efeitos .
  2. Clique na animação que você deseja alterar. 
  3. Clique em Ajustar animação para alterar suas configurações:
    • Direção: escolha a direção de onde a animação deve vir (por exemplo: da esquerda, de cima). 
    • Intensidade: torne essa animação mais sutil ou mais intensa. 
    • Duração: altere a duração da animação.
    • Atraso na repetição: adicione um atraso (em segundos) entre as repetições infinitas da animação.   
    • Easing: escolha a forma gradual com que a animação deve aparecer e/ou desaparecer. 
Observação:
As configurações disponíveis dependem da animação que você escolher.
Uma captura de tela das opções de ajuste disponíveis para a animação Respirar

Remover uma animação em loop

Você pode remover uma animação em loop a qualquer momento no painel Inspetor. 

Para remover uma animação em loop:

  1. Selecione o elemento relevante.
  2. Clique no ícone Abrir inspetor  no canto superior direito do editor.
Uma captura de tela do painel Inspetor no Editor do Wix Studio.
  1. Clique na aba Animações e efeitos .
  2. Passe o mouse sobre a animação e clique no ícone Mais ações .
  3. Clique em Remover.
Removendo uma animação em loop do painel Inspetor