Divi Imagem HoverEfeitos
Virar cartão
Deslizar
Efeitos de foco de imagem Divi – 15 animações
Transforme suas imagens em experiências interativas. Divi Image Hover Effects é ummódulo Divi 5 nativoque adiciona animações de foco impressionantes e conteúdo de sobreposição a qualquer imagem - diretamente dentro do Divi Visual Builder, sem necessidade de codificação.
🃏 Flip Cards — Integrados
Virar horizontalmentetransforme sua imagem em uma verdadeiraCartão flip 3D: a frente mostra sua imagem, a parte traseira revela seu conteúdo de sobreposição com uma mudança de perspectiva satisfatória. Perfeito para membros de equipe, peças de portfólio, vitrines de produtos ou qualquer situação em que você queira revelar informações com impacto.
🎬 15 efeitos de flutuação artesanais
- Desaparecer— revelação clássica de opacidade com um aumento sutil de conteúdo
- Deslize para cima/para baixo/esquerda/direita— slides de sobreposição direcional
- Ampliar— a imagem aumenta conforme a sobreposição aparece
- Diminuir zoom- a imagem começa ampliada, recua ao passar o mouse
- Virar horizontalmente- virar cartão 3D completo com perspectiva
- Borrão- a imagem suaviza à medida que seu conteúdo ocupa o centro das atenções
- Tons de cinza- a imagem fica dessaturada ao passar o mouse para um contraste impressionante
- Brilhar- um leve brilho varre a imagem
- Saltar— a sobreposição surge de baixo com energia elástica
- Revelar Esquerda → Direita- revelação do caminho do clipe em estilo cortina
✨ Conteúdo rico de sobreposição
Construa sua sobreposição visualmente, exatamente como você deseja:
- Fundo de sobreposição – cor sólida ou completagradiente(cor inicial, cor final, direção)
- Posição do conteúdo -9 pontos de ancoragem(canto superior esquerdo, centro, canto inferior direito…)
- Ícone – escolha qualquer ícone Divi, defina sua cor e tamanho
- Título – escolha a tag HTML (H1–H6 ou P) e estilize-a totalmente
- Descrição — corpo do texto com controle tipográfico completo
- Botão de call to action – URL, suporte para nova guia e opainel completo de design de botão Divi(fundo, borda, fonte, espaçamento, dimensionamento, sombra da caixa)
⚙️ Controles de animação de precisão
Ajuste tudo diretamente no Visual Builder sem sair da sua página:
- Animaçãovelocidade— qualquer duração CSS válida (
0.3s,500ms…) - Animaçãofacilitando- Facilidade, Facilidade de entrada, Facilidade de saída, Facilidade de entrada, Linear
🎨 Personalização completa do design Divi
Because Divi Image Hover Effects is a true native Divi 5 module, you get access to the sistema de design Divi completo— as mesmas ferramentas que você usa em todos os outros módulos:
- Typography controls for title, description, and button
- Planos de fundo, gradientes e imagens no módulo
- Bordas, sombras de caixa e raio da borda
- Spacing (margin & padding) and sizing
- Filtros, transformações e animações
- Posicionamento fixo, efeitos de rolagem e índice z
- Visibilidade responsiva e CSS personalizado por ponto de interrupção
Tudo o que você espera de um módulo Divi – pronto para uso.
🔍 True Visual Builder preview
The overlay is always visible in the canvas so you can edit your content comfortably. Activate hover mode in the Design panel to preview your hover styles — colors, transitions, and flip animations — exactly as your visitors will see them.
♿ Performance & accessibility built in
- Images use native lazy loading for fast page speeds
- Animations automatically disable for users who prefer reduced motion (
prefers-reduced-motion) - GPU-accelerated transitions for silky 60fps rendering
📋 Requisitos
- Divi 5 (não compatível com Divi 4)
- WordPress 6.0+
- PHP 7.4
