Editor do Wix Studio: sobre animações
4 min de leitura
Incorporar nossas animações em seus designs pode levá-los a um novo patamar. O Editor do Wix Studio oferece 5 tipos diferentes de animação, com base em quando você deseja que ela apareça.
Faça animações aparecerem quando os visitantes passam o mouse, clicam ou passam por um elemento. Você também pode adicionar uma animação de entrada, para quando o elemento é carregado pela primeira vez ou uma que se repete continuamente, tudo sem uma única linha de código.
Observação:
O tamanho da animação é calculado de acordo com o seu navegador específico quando a página é carregada pela primeira vez. Se você redimensionar a janela do navegador (ao arrastar suas alças), a animação pode não aparecer corretamente. Recomendamos atualizar a página para uma exibição ideal.
Animação de entrada
Adicionar uma animação de entrada a um elemento é uma ótima maneira de chamar a atenção dos visitantes para ele. A animação aparece quando o elemento aparece pela primeira vez, então chama a atenção instantaneamente. Existem muitos tipos para você escolher e personalizar de acordo com a demanda do seu cliente.
Interações de hover e clique
Adicione efeitos interessantes que aparecem quando os visitantes passam o mouse (hover) ou clicam em um elemento. Você pode fazer com que os elementos se transformem, se movam ou revelem um novo conteúdo ao passar o mouse/clicar.
Escolha entre uma variedade de efeitos predefinidos, ou crie um efeito personalizado com suas especificações exatas. Gerencie o tempo, a ordem e a translação e, em seguida, visualize o resultado final diretamente no Editor.
Você também pode criar interações entre elementos. Assim, passar o mouse ou clicar em um elemento ativa a animação em outro.
No exemplo abaixo, passar o mouse sobre o parágrafo faz com que o botão e a imagem se movam.
Animação de rolagem
Aumente o engajamento e crie efeitos interessantes com animações de rolagem. O progresso da animação está diretamente relacionado à posição de rolagem, indo para frente e para trás enquanto os visitantes rolam para cima e para baixo.
Você também pode criar interações entre elementos. Assim, rolar por um elemento ativa a animação em outro.
No exemplo abaixo, rolar pelo título faz com que o repetidor aumente.
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.
Perguntas frequentes
Clique nas perguntas para saber mais sobre efeitos de animação.
A quais elementos posso adicionar animação?
Como faço para começar?
no canto superior direito do editor. Você pode então abrir a aba Animações e efeitos 
para começar a configurar o tipo de animação que você deseja.Um único elemento pode ter várias animações?
Como posso combinar animações em um único elemento?
Esse artigo foi útil?
|