De uitbreidbare widget gebruikt het aangepaste element <devsite-expandable> om gebruikers delen van de inhoud in een uitbreidbare sectie te laten verbergen of weergeven. In een Markdown-bestand verpakt u het aangepaste element met een standaard HTML-element, zoals een <section> of <div> .
Sectie schakelen
Het volgende voorbeeld is verpakt in een aangepast <devsite-expandable> -element dat standaard op een verborgen positie staat. De kop ervan heeft een class attribuut met de naam showalways .
Deze kop wordt altijd weergegeven
Deze paragraaf heeft standaard een verborgen positie.
This code block within the custom element also defaults to a hidden
position.Aangepaste controle
In het volgende voorbeeld wordt de klasse expand-control toegevoegd aan het button element van het aangepaste element <devsite-expandable> om de sectie zonder schakelaar uit en samen te vouwen.
Er zijn veel opties beschikbaar
Eén keer uitbreiden
In het volgende voorbeeld wordt de klasse expand-control once toegevoegd aan een link binnen het aangepaste element <devsite-expandable> dat extra inhoud toont wanneer erop wordt geklikt en vervolgens van de pagina verdwijnt.
Lorem Ipsum
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut arbeid en dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Meer...Dit is een zeer pijnlijke beschuldiging van een voluptate velit esse cillum dolore eu fugiat nulla pariatur. De uitzondering is dat hij af en toe een niet-prodent is, maar schuldig is aan het verlaten van de taak.
Automatisch uitvouwen bij koppelen
In het volgende voorbeeld wordt een ID #sample1 toegevoegd aan het aangepaste element <devsite-expandable> , waardoor de sectie automatisch wordt uitgevouwen bij het laden van de pagina wanneer u ernaar linkt.
Hoe u automatisch kunt uitvouwen bij koppelen
Sluit dit uitbreidbare gedeelte, klik op de link #sample1 hierboven en laad de pagina opnieuw om dit uitbreidbare gedeelte automatisch uit te vouwen.
Code block within the 'Auto-expand on linking' demo.
Standaard geopend
In het volgende voorbeeld wordt het expanded kenmerk toegevoegd aan het aangepaste element <devsite-expandable> om het uitbreidbare standaard open te maken.
Standaard uitgebreid
Standaard openen is geweldig als je veel uitbreidbare bestanden hebt, zoals voor releaseopmerkingen, maar je de meest recente open wilt houden.