Hur skapas: Sticky-element
- Föregående sida Fast sidfot
- Nästa sida Jämnhöjd
Lär dig hur du använder CSS för att skapa sticky-element.
Observera:Detta exempel gäller inte för Internet Explorer eller Edge 15 och tidigare versioner.
Sticky-element
Exempel
div.sticky {
position: -webkit-sticky; /* Safari */
position: sticky;
top: 0;
}
Element med position: sticky; kommer att positioneras baserat på användarens scroll-position.
Sticky-element växlar mellan relativ position och fast position beroende på scroll-position. Före att nå den angivna offset-positionen i viewporten är det relativ position, sedan 'sticker' det på plats (liksom position:fixed).
Observera:Internet Explorer, Edge 15 och tidigare versioner stöder inte sticky-position. Safari kräver -webkit-prefix (se exempel nedan). För att sticky-position ska fungera måste minst en av top, right, bottom eller left anges.
Relaterade sidor
Lär dig:CSS-positionering
- Föregående sida Fast sidfot
- Nästa sida Jämnhöjd
