Experimenten

In deze wiki deel ik al mijn experimenten die ik maak in Codepen.

Anchor positioning

Samenvatting:

• Het artikel leert je hoe je met anchor positioning een floating focus state kan maken (CSS only !!!, want beter voor performance).
• Met floating focus creëer je een fijn effect als je de website met keyboard navigeert.
• Dit helpt jou als developer ook, om te bepalen of de volgorde van onderdelen met een focus state logisch zijn.
• Met slechts 2 elementen kun je dit al maken:
• Het element dat anchored (hier koppel je anchor-name aan)
• Het element dat als eerste de anchor ontvangt (hier koppel je position-anchor aan)
• Tot slot leer je ook hoe je dit PE kan maken (en voor de oplettende lezer kom je hier ook een shout-out naar Krijn Hoetmer tegen)

Codepen: https://codepen.io/ambersr/pen/wBMvXPV

Gedeeld met mijn medestudenten in Teams: