O widget expansível usa o elemento personalizado <devsite-expandable> para permitir
que os usuários ocultem ou mostrem partes do conteúdo em uma seção expansível. Em um arquivo Markdown,
encapsule o elemento personalizado com um elemento HTML padrão, como
<section> ou <div>.
Alternar seção
O exemplo a seguir é unido a um elemento personalizado <devsite-expandable> que
assume uma posição oculta por padrão. O cabeçalho tem um atributo class chamado
showalways.
Este título sempre mostra
Esse parágrafo fica oculto por padrão.
This code block within the custom element also defaults to a hidden
position.
Controle personalizado
O exemplo a seguir adiciona a classe expand-control ao elemento button do
elemento personalizado <devsite-expandable> para expandir e recolher a seção
sem um botão de alternância.
Abrir uma vez
O exemplo a seguir adiciona a classe expand-control once a um link no
elemento personalizado <devsite-expandable>, que mostra conteúdo adicional quando clicado
e depois desaparece da página.
Lorem Ipsum
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Redução de anúncios da Ut enim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Mais…Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Expansão automática na vinculação
O exemplo a seguir adiciona um ID #sample1 ao
Elemento personalizado <devsite-expandable> que expande automaticamente a seção no carregamento de página
quando você criar um link para ela.
Como expandir automaticamente na vinculação
Feche essa seção expansível, clique no link #sample1 acima e recarregue a página para que ela seja aberta automaticamente.
Code block within the 'Auto-expand on linking' demo.
Abrir por padrão
O exemplo a seguir adiciona o atributo expanded ao
elemento personalizado <devsite-expandable> para abrir o elemento expansível por padrão.
Expandido por padrão
A abertura padrão é ótima quando você tem muitos itens expansíveis, como notas da versão, mas quer manter o mais recente aberto.