3 ms·
Or put the notes inside the slide, and then CSS is enough, the JavaScript doesn’t even need to know about notes: Notes: <label><input type=radio name=notes
by chrismorgan 1y ago
Or put the notes inside the slide, and then CSS is enough, the JavaScript doesn’t even need to know about notes:
Notes:
<label><input type=radio name=notes id=notes-hide checked> Hide</label>
<label><input type=radio name=notes id=notes-inline> Inline</label>
<label><input type=radio name=notes id=notes-only> Only</label>
<section>
Slide
<aside>
Notes
</aside>
</section>
<style>
section {
position: relative;
}
aside {
background: #feb;
padding: 1em;
body:has(#notes-only:checked) & {
position: absolute;
inset: 0;
}
body:has(#notes-inline:checked) & {
margin-top: auto; /* concept: if the slide uses flex, notes can try sticking to the bottom */
}
body:has(#notes-hide:checked) & {
display: none;
}
}
</style>
- econ 1y agoI think one would want either slides or notes? This seems perfectly heretical. <script> document.write(` <style> .${location.search.replace(/\W/g, '')}{ display:none } </style> `) </script>