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: criar elementos e seções sticky

Neste artigo
  • Aplicar a posição sticky a um elemento ou seção
  • Remover a posição sticky
  • Tutorial úteis
Faça com que uma seção ou elemento "grude" na página enquanto os visitantes rolam para cima e para baixo. Quando o elemento ou seção atinge a janela de visualização do visitante, ele gruda na parte superior, na parte inferior ou em ambos. Você pode definir o recuo, que é a distância da parte superior ou inferior.
Vá para a Wix Studio Academy (em inglês) para conferir webinars, tutoriais e cursos adicionais do Wix Studio.
Você sabia?
Você pode adicionar um efeito de rolagem no cabeçalho para alterar a aparência enquanto os visitantes percorrem pela página. Por exemplo, faça com que o cabeçalho mude de cor durante a rolagem ou mova-o para fora do caminho para ajudar os visitantes a se concentrar na página.

Aplicar a posição sticky a um elemento ou seção

  1. Vá para o seu editor.
  2. Selecione a seção ou elemento relevante.
  3. Clique no ícone Abrir inspetor  no canto superior direito do editor.
Uma captura de tela da abertura do painel Inspetor no Editor do Wix Studio.
  1. Role para baixo até Posição.
  2. Selecione Sticky no dropdown Tipo de posição.
  3. Escolha onde a seção/elemento adere: Parte superior, Parte inferior, ou Parte superior e inferior.
  4. (Opcional) Insira um valor de recuo para criar espaço acima ou abaixo.
  5. Marque a caixa de seleção Manter à frente para ativar ou desativar essa opção:
    • Ativada: o elemento/seção fica visualmente na frente, mas não altera sua posição na ordem DOM da página.
    • Desativada: a posição visual da seção ou elemento corresponde à sua posição na ordem DOM da página. Dependendo de como a página está organizada, o elemento/seção pode não estar na frente.
O dropdown de posição no painel inspetor.
Observação:
A ordem DOM é uma parte importante da acessibilidade do site, desempenho e classificações dos resultados de busca. Portanto, recomendamos ativar Manter à frente, para que você possa obter o efeito visual desejado, mantendo a estrutura da página.

Remover a posição sticky

Você pode reverter elementos e seções para a posição padrão quando quiser. Isso significa que eles não "grudam" mais na tela ao chegar à janela de visualização. Eles permanecem em sua posição.

Para remover a posição sticky:

  1. Vá para o seu editor.
  2. Selecione a seção ou elemento relevante.
  3. Clique no ícone Abrir inspetor  no canto superior direito do editor.
Uma captura de tela da abertura do painel Inspetor no Editor do Wix Studio.
  1. Role para baixo até Posição.
  2. Selecione Padrão no dropdown Tipo de posição.
Captura de tela de um elemento de pilha na tela, ao lado do painel Inspetor. O tipo de posição na pilha é definido como padrão

Tutorial úteis

Existem muitos efeitos interessantes que você pode criar com elementos e seções sticky. Confira esses vídeos da Wix Studio Academy (em inglês) e explore suas opções: