Widget:Guides/PlatformSwitcher: Difference between revisions
Jump to navigation
Jump to search
No edit summary |
No edit summary |
||
| Line 28: | Line 28: | ||
for (const elem of fieldset.querySelectorAll('input')) { | for (const elem of fieldset.querySelectorAll('input')) { | ||
elem.addEventListener('change', () => | elem.addEventListener('change', () => switch_thing(elem.value)) | ||
} | } | ||
Revision as of 23:34, 6 December 2024
<form>
<fieldset id="platform-switcher"> <legend>Select your operating system:</legend>
<label>
<input type="radio" name="platform" value="windows" checked /> Windows
</label>
<label>
<input type="radio" name="platform" value="macos" /> macOS
</label>
<label>
<input type="radio" name="platform" value="linux" /> Linux
</label>
<label>
<input type="radio" name="platform" value="haiku" /> Haiku
</label>
</fieldset>
</form>
<script type="module" defer> const containers = document.querySelectorAll('.platform-specific'); switch_thing('windows');
const fieldset = document.getElementById("platform-switcher");
for (const elem of fieldset.querySelectorAll('input')) {
elem.addEventListener('change', () => switch_thing(elem.value))
}
function switch_thing(value) {
for (const x of containers) {
x.style.display = "none"
}
document.querySelector('.' + value).style.display = "block";
} </script>