Editor do Wix Studio: criar elementos e seções sticky
3 min de leitura
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.
Neste artigo, saiba mais sobre como:
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
- Selecione a seção ou elemento relevante.
- 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.](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/d6b40156-9694-4cfe-9209-54815ef9d6dc/2024/03/07/ed25ff0f-6b3d-4d1c-9155-e9b1c788a0b5/326f9801-aa4e-4ca8-8989-360b80ec33f2.png)
- Role para baixo até Posição.
- Selecione Sticky no dropdown Tipo de posição.
- Escolha onde a seção/elemento adere: Parte superior, Parte inferior, ou Parte superior e inferior.
- (Opcional) Insira um valor de recuo para criar espaço acima ou abaixo.
![Um elemento de texto definido para aderir à parte superior com um recuo de 5% da parte superior.](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/8696077d-830a-4b1e-bd86-9df98f89994a/2023/07/23/fb3a894e-fc6f-4aad-942b-546bc43fb058/f0817030-b55f-4a5d-a679-a4289ca4d06e.png)
Observação sobre a ordem do DOM:
Por definição, a ordem do DOM da página, incluindo a ordem da seção, é organizada automaticamente. Se você quiser que uma seção "sticky" apareça acima de outras no DOM, clique com o botão direito do mouse na seção, selecione Organizar e Trazer para frente.
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:
- Selecione a seção ou elemento relevante.
- 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.](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/d6b40156-9694-4cfe-9209-54815ef9d6dc/2024/03/07/ed25ff0f-6b3d-4d1c-9155-e9b1c788a0b5/326f9801-aa4e-4ca8-8989-360b80ec33f2.png)
- Role para baixo até Posição.
- Selecione Padrão no dropdown Tipo de posição.
![Selecionando o tipo de posição padrão para um elemento ou seção no Inspetor](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/8696077d-830a-4b1e-bd86-9df98f89994a/2023/07/23/538be1dd-ecb2-42f4-aa2b-2c9f2adad49b/bc889e6c-5e59-4a5f-94c7-b53149f12085.png)
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:
Esse artigo foi útil?
|