Jak tworzyć: obraz lepkie

Naucz się, jak używać CSS do tworzenia obrazów lepkich.

obraz lepkie

Uwaga:Ten przykład nie jest odpowiedni dla Internet Explorer lub Edge 15 i wcześniejszych wersji.

Spróbuj sam

obraz lepkie

img.sticky {
  position: -webkit-sticky; /* Safari */
  position: sticky;
  top: 0;
}

Spróbuj sam

ustawione position: sticky; elementy będą pozycjonowane w zależności od pozycji przewijania użytkownika.

Elementy lepkie przełączają się między pozycjonowaniem względnym a stałym, w zależności od pozycji przewijania. Przed osiągnięciem określonej odległości od krawędzi w widoku, będą one pozycjonowane względem, a następnie "lepko" będą stać na miejscu (np. position:fixed)

Uwaga:Internet Explorer, Edge 15 i wcześniejsze wersje nie obsługują pozycjonowania lepkiego. Safari wymaga -webkit- Przedrostek (patrz przykłady). Aby efektywnie zastosować pozycjonowanie lepkie, musi być co najmniej określone toprightbottom lub left w jednym z nich.

Strony związane

Tutorial:CSS obraz

Tutorial:CSS pozycjonowanie