Den udvidelige widget bruger det tilpassede element <devsite-expandable> til at lade brugere skjule eller vise dele af indholdet i en sektion, der kan udvides. I en Markdown-fil skal du pakke det brugerdefinerede element med et standard HTML-element, såsom en <section> eller <div> .
Skift sektion
Følgende eksempel er pakket ind i et <devsite-expandable> brugerdefineret element, der som standard har en skjult position. Dens overskrift har en class kaldet showalways .
Denne overskrift viser altid
Dette afsnit har som standard en skjult position.
This code block within the custom element also defaults to a hidden
position.Brugerdefineret kontrol
Følgende eksempel tilføjer expand-control klassen til button i det brugerdefinerede element <devsite-expandable> for at udvide og skjule sektionen uden en til/fra-knap.
Mange muligheder er tilgængelige
Udvid én gang
Følgende eksempel tilføjer klassen expand-control once til et link i det tilpassede element <devsite-expandable> , der viser yderligere indhold, når der klikkes på det og derefter forsvinder fra siden.
Lorem Ipsum
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ud enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Mere...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.
Udvid automatisk ved linkning
Følgende eksempel tilføjer et #sample1 -id til det tilpassede element <devsite-expandable> , der automatisk udvider afsnittet om sideindlæsning, når du linker til det.
Sådan udvides automatisk ved linkning
Luk denne udvidelige sektion, klik på linket #sample1 ovenfor, og genindlæs derefter siden for automatisk at udvide denne udvidelige sektion.
Code block within the 'Auto-expand on linking' demo.
Åbn som standard
Følgende eksempel tilføjer den expanded attribut til det brugerdefinerede element <devsite-expandable> for at gøre det udvidede åbent som standard.
Udvidet som standard
Åbn som standard er fantastisk, når du har masser af udvidelige funktioner, såsom for release notes, men du vil beholde den seneste åben.