Galeria Slider
Cansado de grades de imagens básicas ou apresentações de slides simples? o elemento Gallery Slider combina o melhor dos dois mundos Ele apresenta um layout dividido elegante: uma grande e bonita área de visualização emparelhada com uma faixa ou grade de miniatura de navegação Clique em qualquer miniatura para atualizar instantaneamente a visualização perfeita para portfólios, galerias de produtos ou exibindo qualquer coleção de imagens com uma sensação interativa premium Com personalização separada e profunda para cada parte única, desde passagens de miniaturas até legendas de visualização (preview) Você pode construir uma galeria que não seja apenas funcional, mas uma parte memorável da experiência do seu site.
Design exclusivo de layout dividido
Este não é um carrossel padrão É uma interface de galeria dedicada Escolha sua Posição de Visualização (Esquerda ou Direita) e controle sua Largura como uma porcentagem do espaço total As miniaturas ficam ordenadamente ao lado dele Em telas menores, use o recurso “Stack on” para empilhar automaticamente a visualização e as miniaturas verticalmente, garantindo uma visualização perfeita em todos os dispositivos Esse layout dá aos usuários uma visualização clara e focada com fácil navegação.
- Controle de Layout Flexível: Defina a visualização como o ponto focal à esquerda ou à direita, com largura ajustável (por exemplo, 70%).
- Navegação em miniatura: Os usuários podem clicar através de miniaturas para alterar a visualização principal intuitiva e rápida.
- Empilhamento móvel-responsivo: Empilha automaticamente o layout no tablet e no celular para uso ideal do espaço vertical.
Projete a visualização, miniaturas
Obtenha um design perfeitamente coeso estilizando cada parte de forma independente Estilize o fundo, as bordas e a sombra da área de Visualização Projete as Legendas de Visualização com tipografia completa, preenchimento e controles de alinhamento Em seguida, estilize as Miniaturas: controle seu Espaçamento Vertical/Horizontal, Fronteiras, Raio de Fronteira e alinhamento Finalmente, crie interações envolventes projetando Efeitos de Hover separados para visualização e miniaturas, incluindo escala, sombra, filtros e sobreposições coloridas.
- Estilo de visualização completo: adicione fundos, alturas personalizadas e sombras à área principal da imagem.
- Controle de grade de miniaturas: ajuste o espaçamento e as bordas para criar uma grade de miniaturas organizada e organizada.
- Feedback interativo: defina efeitos de hover exclusivos para miniaturas (escala, cor de fundo, sobreposição) e legendas de visualização.
Animações e transições suaves
Dê vida à sua galeria com um movimento suave e profissional A visualização principal pode apresentar um efeito sutil de panorâmica e zoom de Ken Burns Escolha a direção (cruzar, subir, descer) e Posição Controle a transição Velocidade entre slides Adicione elegantes Legenda Transições que desaparecem ou deslizam Toda interação, desde a troca de imagens até o pairar em miniaturas, pode ter uma Velocidade de Animação personalizada e facilitar uma sensação premium e polida.
- Efeito Ken Burns: Adicione uma panorâmica ou zoom cinematográfico lento à imagem de visualização principal para maior dinamismo.
- Velocidade de transição personalizada: controle a rapidez com que a imagem principal muda quando uma miniatura é clicada.
- Microinterações refinadas: transições suaves de hover em miniaturas e legendas melhoram a experiência do usuário.
Controles e navegação profissionais da galeria
Gerencie sua galeria como um profissional Escolha a Resolução de Imagem para obter tempos de carregamento ideais Ative a Reprodução Automática para o controle deslizante ou deixe os usuários navegarem manualmente Adicione setas de navegação elegantes sobre a visualização e personalize seus estados de tamanho, cor e hover Cada configuração foi projetada para oferecer controle total sobre a funcionalidade e a estética.
- Reprodução automática e looping: defina a galeria para percorrer as imagens automaticamente com velocidade ajustável.
- Setas de navegação personalizadas: Estile as setas anterior/seguinte para combinar com o design do seu site.
Perguntas frequentes para o controle deslizante da galeria
Qual é a principal vantagem disso em relação a um carrossel de imagens padrão?
Um carrossel padrão mostra uma imagem de cada vez com pontos/setas Este Gallery Slider fornece uma interface de dois painéis: uma grande visualização e um conjunto visível de todas as opções de miniaturas Isso permite que os usuários vejam suas escolhas de relance e pulem diretamente para qualquer imagem, o que é muito mais eficiente e fácil de usar para galerias com mais de algumas imagens.
Posso fazer a exibição das miniaturas em uma grade em vez de uma única linha?
Sim! as opções de estilo para Miniaturas incluem controles para Espaçamento Horizontal e Vertical, que são fundamentais para criar uma grade Ao ajustar a largura do contêiner e esses valores de espaçamento, você pode criar uma grade de miniaturas de várias linhas ao lado de sua visualização.
O efeito Ken Burns é aplicado a todas as imagens?
Quando ativado, o efeito Ken Burns (um pan/zoom lento) é aplicado à imagem de visualização principal Ele cria uma animação sutil e contínua na foto atualmente ativa, adicionando uma sensação de vida e profundidade à sua galeria.
Como isso funciona com muitas imagens de alta resolução?
Para obter o melhor desempenho, use a configuração Resolução de imagem com sabedoria (por exemplo, “Large” em vez de “Full” se o tamanho da exibição não exigir resolução total).O elemento é otimizado, mas carregar mais de 20 imagens em tamanho real sempre afetará a velocidade da página Considere preguiçoso carregar ou quebrar galerias muito grandes em vários controles deslizantes.
Posso usar isso para uma galeria de imagens de produtos em uma loja online?
Absolutamente. é uma excelente escolha para páginas de produtos onde você precisa mostrar vários ângulos, cores ou detalhes Os usuários podem clicar na miniatura de uma variante de cor diferente para vê-la na visualização principal instantaneamente Basta vincular o botão principal “Buy Now” ao seu carrinho ou página do produto.
O que acontece no celular com o recurso "Stack on"?
Quando Stack on é definido como “Tablet & Mobile,” o layout horizontal lado a lado muda para uma pilha vertical A visualização grande aparece na parte superior, e a grade de miniaturas aparece abaixo dela Isso garante que a visualização permaneça grande e visível, e as miniaturas ainda são facilmente tocáveis em uma tela sensível ao toque.
Widgets e extensões de elementos de tendência
Construa sites sofisticados em menos tempo.
Glassmorphismo
Contêiner Extras
Padrões
Duplicador de postagem/página
