Stop using js for that

Kylian Valkhof – 5 februari 2025

Rule of the least power, kiest de minst krachtige taal

Het doel van de Browser is dat de inhoud van de pagina beschikbaar is. Meer werk in Html/css -> minder werk in js.

Code voorbeelden

Custom switches

<label><input type="checkbox"></label>

CSS

appearance: none;

Blijft van input af waardoor je meer mogelijkheden hebt in de stijling.

                :checked { ...
                }
    
                :checked::before {
                    transform:..;
                }
                    
                
input type="color"

Dit wordt een colorpicker

In page transitions

html { scroll-behavior: smooth; } #my-target { scroll-margin-top: 100px; }

Header blijft bijvoorbeeld staan

Accordion

<details> <summary>...</summary> <p>...</p> </details>