Comment

Comment by grishka

Another way is to use the checkbox-and-CSS trick. You add a hidden checkbox next to the element you want to hide, add a label to trigger the checkbox, and then use a + selector to toggle the visibility based on the state of the checkbox. Like this:

    <label for="spoiler">Toggle spoiler</label>
    <input type="checkbox" id="spoiler"/>
    <div id="spoilerContent">Spoilery stuff goes here</div>
    <style>
    #spoiler, #spoilerContent{display: none;}
    #spoiler:checked+#spoilerContent{display: block;}
    </style>
You can also use a variation of this for tabs - just use radio buttons instead - and accordions.
parent grishka 6 years ago

Discussion

Live from the official Hacker News API

A modern reader for Hacker News · SvelteKit + Skeleton