A rolagem nem sempre precisa descer a página. Às vezes, mover um lado para o outro é mais adequado, especialmente quando você exibe galerias de imagens, seções de recursos ou uma história passo a passo.
A rolagem horizontal oferece uma maneira mais limpa e envolvente de orientar os visitantes pelo seu conteúdo. É uma ótima opção para destaques de produtos, narrativa visual ou qualquer layout que precise de um pouco de movimento extra para se destacar.
configurar o scroll horizontal rs
Ativar rolagem horizontal Ativa o efeito de rolagem horizontal no contêiner. Você encontrará três opções: padrão, sim e não.
Padrão: nenhum efeito é aplicado. Sim: a rolagem horizontal está habilitada no contêiner. não : desativa explicitamente o efeito nesse ponto de interrupção. Esse controle é responsivo, portanto, você pode ativá-lo ou desativá-lo por dispositivo (desktop, tablet, celular).
modelo de trabalho Define como a animação horizontal da rolagem se comporta. Você encontrará duas opções: Normal e Mascaramento.
Normal: o conteúdo rola horizontalmente enquanto o usuário rola para baixo na página. Mascaramento: os itens são revelados com um efeito de corte à medida que o usuário rola, tratando cada recipiente filho como um slide.
direção Controla para que lado o conteúdo se move durante a rolagem. Você encontrará duas opções: da direita para a esquerda e da esquerda para a direita.
Direita para a esquerda: direção padrão, o conteúdo se move para a esquerda enquanto o usuário rola para baixo. Da esquerda para a direita: o conteúdo se move para a direita enquanto o usuário rola para baixo.
Largura da área de rolagem Define a largura total da área de rolagem horizontal como uma porcentagem. Um valor de 500% significa que o conteúdo é 5× a largura da tela e o usuário percorre tudo rolando para baixo na página. O intervalo é de 10% a 1000%, o padrão é de 500%. Disponível somente quando o modelo de trabalho está definido como normal.
Altura da seção Define a altura da seção de rolagem adesiva ao usar o modelo de mascaramento. Esta altura se aplica a cada item filho. Disponível somente quando o modelo de trabalho está definido para o mascaramento.
Deslocamento superior Ajusta onde a área de rolagem horizontal começa verticalmente, em pixels. Use isso para dar conta de um cabeçalho fixo ou navegação pegajosa para que o rolamento comece na posição correta na tela.
Barra de progresso Mostra ou oculta um indicador de progresso que preenche à medida que o usuário percorre o conteúdo horizontal, dando aos visitantes uma noção de quão longe na seção eles estão.
Número de paginação Mostra ou oculta um contador (por exemplo, 2/5) que é atualizado à medida que o usuário percorre as seções de conteúdo horizontal.
