Seção que Abre de Lado Plus

Sobre este efeito

Uma seção inteira, do tamanho da tela, que abre como uma cortina. Ela chega como um bloco de cor lisa e, quando sobe na tela, a foto ou o vídeo de fundo é revelado de um lado ao outro, com um deslocamento curto de câmera e um zoom que assenta, enquanto um fio de luz corre na borda do corte. Depois, as partes de dentro entram em sequência: o parágrafo linha por linha, cada linha subindo de uma fresta; o cartão abrindo pelo mesmo lado, com a imagem assentando; e o título subindo. A cortina abre da esquerda, da direita, de baixo ou de cima. Quando a pessoa volta pra cima e a seção sai da tela, ela fecha e abre de novo na próxima descida, ou fica aberta de vez, se preferir. Com a preferência de menos movimento, a seção já aparece aberta. Cor antes de abrir, ponto da tela em que abre, duração, movimento da foto e brilho e cor do fio ajustáveis. JavaScript e CSS puros, sem biblioteca.

Ficha

Categoria

Scroll

Onde combina

recursos, topo (hero), transições

Alcance

Área: vive dentro de um bloco da página.

Plano

Incluso no Plus (R$ 19,90/mês) e no Ultra (R$ 39,90/mês).

Na loja desde

03/11/2026

Como colocar no seu site

1. Criando o site com IA (Claude Code, Codex e parecidas): baixe o kit, extraia na pasta do projeto e cole o pedido pronto que a loja entrega. Não precisa saber programar.
2. Usando um construtor (Elementor, Shopify, Webflow e outros): a loja mostra o passo a passo de cada um.
3. Programando: importe o efeito.css e o efeito.js e marque o elemento com a classe fx-secao-que-abre-de-lado.

Assuntos

• scroll
• rolagem
• seção
• cortina
• revelar
• abrir
• foto
• vídeo
• fundo
• entrada
• sequência
• clip-path