O componente Reveal pode ser usado para mostrar e ocultar conteúdo ao passar o mouse ou clicar em um determinado elemento.
Por exemplo: se desejar exibir uma legenda quando os visitantes passarem o mouse sobre uma imagem, você pode usar o componente Reveal.
Ao arrastar o componente Reveal para sua página, você receberá duas caixas.
O Reveal Trigger será a primeira caixa. Basta arrastar qualquer conteúdo que desejar para essa caixa e ela será o que os usuários verão quando chegarem à página.
O Reveal Container será a segunda caixa. É aqui que você puxará o conteúdo que gostaria de mostrar quando os usuários passarem o mouse ou clicarem no elemento Reveal Trigger.
Configurações do Reveal
Ao editar seu componente Reveal, você verá as opções abaixo:
Reveal type
- Overlay (sobreposição) - exibe o conteúdo do Reveal Container sobre o Reveal Trigger.
- Toggle (alternar) - exibe o conteúdo do Reveal Container em vez do Reveal Trigger.
Reveals when
- Hovered (flutuante)- exibe o Reveal Container quando o usuário passa o mouse sobre o Reveal Trigger.
- Clicked (clicado) - exibe Reveal Container quando o usuário clica em Reveal Trigger.
Position
- Fornece opções de onde o Reveal Container deve ser exibido. Se o manual for selecionado, ele será exibido onde for publicado na sua página.
Dicas e truques
Se você parece estar tendo um problema com o componente Reveal no seu navegador Safari ao usar transições flip em mais de um objeto em uma página, basta adicionar o microtema alterando o estilo em Utilities > Animation Wrapper.
Lembre-se que o componente Reveal não adiciona espaço extra a uma página, ele apenas substitui o conteúdo dentro do Reveal Trigger. É por isso que não é possível variar a altura ao mostrar um Reveal Container.
Caso você tenha dúvidas, por favor, entre em contato conosco help@rockcontent.com. 😀